취업/Tradingview

[Tradingview] 반응형으로 만들기.

카슈밀 2021. 9. 24. 09:34
반응형

구형까지만해도 그냥 자체적으로 지원하던 부분이었는데 1.15버전으로 와서는 지원하지 않는다.

아마도 하는것 같은데 내가 구한게 그런건지는 잘 모르겠다.

그래서 귀찮지만 직접 만들었다.

@media only screen and (max-width: 900px) {
	.layout__area--left,
	.charts-popup-list .separator,
	.charts-popup-list .title {
		display: none !important;
	}
	.layout__area--top,
	.layout__area--center,
	.chart-container {
		left: 0 !important;
		width: 100% !important;
	}
	.chart-container-border .chart-widget--themed-dark {
		width: 100% !important;
	}
	.chart-container-border .chart-widget--themed-dark table {
		width: 100% !important;
	}
	.chart-markup-table .pane,
	.chart-markup-table .pane canvas {
		width: 100% !important;
		height: 100% !important;
	}
	.chart-markup-table .time-axis div {
		width: 100%;
	}
	.chart-markup-table .time-axis canvas {
		width: 100% !important;
		height: 100% !important;
	}
}
@media only screen and (max-width: 750px) {
	.charts-popup-list .item.save-load-chart-title {
		display: block;
	}
	.layout__area--top .common-tooltip__body--no-buttons-3quqi1Sv- .load,
	.layout__area--top .common-tooltip__body--no-buttons-3quqi1Sv- .save {
		padding-left: 7px;
		padding-right: 7px;
	}
}
@media only screen and (max-width: 567px) {
	.layout__area--top .group-wWM3zP_M-:nth-child(3),
	.layout__area--top .group-wWM3zP_M-:nth-child(4) {
		display: none !important;
	}
}
@media only screen and (max-width: 325px) {
	.layout__area--top .group-wWM3zP_M-:nth-child(2),
	.layout__area--top .group-wWM3zP_M-:nth-child(7) {
		display: none !important;
	}
}

일단 대부분은 맞춰놨는데, left_toolbar쪽은 제대로 한건지 모르겠다. 일단 제대로 사라져서 내가 원하는 방향으로 가긴 했음.

728x90