ia.novokshanov/asb_cloud_front
1
0
Fork 0
forked from ddrilling/asb_cloud_front
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Исправлена ширина всплывающей подсказки на графике Телеметрия - Мониторинг

Browse Source
This commit is contained in:
ts_salikhov 2022-09-06 14:53:44 +04:00
parent cc1eb706ea
commit 0e6a0888d8
3 changed files with 39 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/d3/monitoring/D3HorizontalCursor.tsx
View File

@ -186,7 +186,7 @@ const _D3HorizontalCursor = <DataType,>({
pointerEvents={fixed ? 'all' : 'none'}
style={{ transition: 'opacity .1s ease-out', userSelect: fixed ? 'auto' : 'none' }}
>
<div className={`tooltip ${position} ${className}`}
<div className={`adaptive-tooltip tooltip ${position} ${className}`}
style={{height: 'auto', bottom: `${position === 'bottom' ? '0' : ''}`}}
>
<div className={'tooltip-content'}>

2
src/pages/Telemetry/Archive/index.jsx
View File

@ -255,7 +255,7 @@ const Archive = memo(() => {
plugins={{
menu: { enabled: false },
cursor: {
width: 220,
width: 230,
render: cursorRender,
}
}}

58
src/styles/d3.less
View File

@ -9,10 +9,6 @@
width: 100%;
height: 100%;
left: 0;
right: 0;
margin: 0 auto;
font-size: 13px;
color: @color;
@ -113,31 +109,51 @@
width: 100%;
height: 100%;
}
& .adaptive-tooltip {
left: 0;
right: 0;
margin: 0 auto;
}
}
@media (max-width: 1800px) {
.asb-d3-chart {
& .tooltip {
width: 190px;
font-size: 10px;
}
@media (max-width: 1830px) {
.asb-d3-chart .adaptive-tooltip {
max-width: 190px;
font-size: 10px;
}
}
@media (max-width: 1600px) {
.asb-d3-chart {
& .tooltip {
width: 160px;
font-size: 8px;
}
.asb-d3-chart .adaptive-tooltip {
max-width: 160px;
font-size: 8px;
}
}
@media (max-width: 1400px) {
.asb-d3-chart {
& .tooltip {
width: 140px;
font-size: 7px;
}
@media (max-width: 1420px) {
.asb-d3-chart .adaptive-tooltip {
max-width: 140px;
font-size: 7px;
padding: 0;
}
}
@media (max-width: 1300px) {
.asb-d3-chart .adaptive-tooltip {
max-width: 125px;
}
}
@media (max-width: 1200px) {
.asb-d3-chart .adaptive-tooltip {
max-width: 105px;
font-size: 6px;
}
}
@media (max-width: 1100px) {
.asb-d3-chart .adaptive-tooltip {
max-width: 90px;
}
}