forked from ddrilling/asb_cloud_front
Исправлена адаптивность шрифта в подсказке
This commit is contained in:
parent
f336ceb698
commit
16ae6959cf
@ -22,7 +22,6 @@ export type D3HorizontalCursorSettings<DataType extends BaseDataType> = {
|
|||||||
style?: CSSProperties
|
style?: CSSProperties
|
||||||
limit?: number
|
limit?: number
|
||||||
lineStyle?: SVGProps<SVGLineElement>
|
lineStyle?: SVGProps<SVGLineElement>
|
||||||
adaptiveTooltipSmall?: boolean
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export type D3HorizontalCursorProps<DataType extends BaseDataType> = D3HorizontalCursorSettings<DataType> & {
|
export type D3HorizontalCursorProps<DataType extends BaseDataType> = D3HorizontalCursorSettings<DataType> & {
|
||||||
@ -73,7 +72,6 @@ const _D3HorizontalCursor = <DataType extends BaseDataType>({
|
|||||||
style: _style = {},
|
style: _style = {},
|
||||||
limit = 2,
|
limit = 2,
|
||||||
lineStyle: _lineStyle,
|
lineStyle: _lineStyle,
|
||||||
adaptiveTooltipSmall = false,
|
|
||||||
|
|
||||||
data,
|
data,
|
||||||
groups,
|
groups,
|
||||||
@ -191,7 +189,7 @@ const _D3HorizontalCursor = <DataType extends BaseDataType>({
|
|||||||
style={{ transition: 'opacity .1s ease-out', userSelect: fixed ? 'auto' : 'none' }}
|
style={{ transition: 'opacity .1s ease-out', userSelect: fixed ? 'auto' : 'none' }}
|
||||||
>
|
>
|
||||||
<div className={'tooltip-wrapper'}>
|
<div className={'tooltip-wrapper'}>
|
||||||
<div className={`adaptive-tooltip ${adaptiveTooltipSmall ? 'adaptive-tooltip-small' : ''} tooltip ${position} ${className}`}
|
<div className={`tooltip ${position} ${className}`}
|
||||||
style={{height: 'auto', bottom: `${position === 'bottom' ? '0' : ''}`}}
|
style={{height: 'auto', bottom: `${position === 'bottom' ? '0' : ''}`}}
|
||||||
>
|
>
|
||||||
<div className={'tooltip-content'}>
|
<div className={'tooltip-content'}>
|
||||||
|
@ -142,7 +142,6 @@ export type D3MonitoringChartsProps<DataType extends BaseDataType> = Omit<React.
|
|||||||
spaceBetweenGroups?: number
|
spaceBetweenGroups?: number
|
||||||
/** Название графика для сохранения в базе */
|
/** Название графика для сохранения в базе */
|
||||||
chartName?: string
|
chartName?: string
|
||||||
adaptiveTooltipSmall?: boolean
|
|
||||||
methods?: (value: {
|
methods?: (value: {
|
||||||
setSettingsVisible: (visible: boolean) => void
|
setSettingsVisible: (visible: boolean) => void
|
||||||
}) => void
|
}) => void
|
||||||
@ -192,7 +191,6 @@ const _D3MonitoringCharts = <DataType extends Record<string, unknown>>({
|
|||||||
dash,
|
dash,
|
||||||
chartName,
|
chartName,
|
||||||
methods,
|
methods,
|
||||||
adaptiveTooltipSmall = false,
|
|
||||||
|
|
||||||
className = '',
|
className = '',
|
||||||
...other
|
...other
|
||||||
@ -572,7 +570,6 @@ const _D3MonitoringCharts = <DataType extends Record<string, unknown>>({
|
|||||||
spaceBetweenGroups={spaceBetweenGroups}
|
spaceBetweenGroups={spaceBetweenGroups}
|
||||||
data={data}
|
data={data}
|
||||||
height={height}
|
height={height}
|
||||||
adaptiveTooltipSmall={adaptiveTooltipSmall}
|
|
||||||
/>
|
/>
|
||||||
</D3MouseZone>
|
</D3MouseZone>
|
||||||
</svg>
|
</svg>
|
||||||
|
@ -302,7 +302,6 @@ const TelemetryView = memo(() => {
|
|||||||
},
|
},
|
||||||
}}
|
}}
|
||||||
height={'70vh'}
|
height={'70vh'}
|
||||||
adaptiveTooltipSmall
|
|
||||||
/>
|
/>
|
||||||
</GridItem>
|
</GridItem>
|
||||||
<GridItem col={'2'} row={'3'} colSpan={'7'}>
|
<GridItem col={'2'} row={'3'} colSpan={'7'}>
|
||||||
|
@ -14,11 +14,11 @@
|
|||||||
|
|
||||||
max-width: 100%;
|
max-width: 100%;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
|
|
||||||
font-size: 13px;
|
font-size: calc(7px + 6 * (100vw - 1024px) / 896);
|
||||||
color: @color;
|
color: @color;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
padding: 5px;
|
padding: calc(0px + 5 * (100vw - 1024px) / 896);
|
||||||
border: none;
|
border: none;
|
||||||
border-radius: 2px;
|
border-radius: 2px;
|
||||||
background-color: @bg-color;
|
background-color: @bg-color;
|
||||||
@ -119,35 +119,4 @@
|
|||||||
.grid-line:not(:first-of-type):not(:last-of-type) line {
|
.grid-line:not(:first-of-type):not(:last-of-type) line {
|
||||||
stroke: #ddd;
|
stroke: #ddd;
|
||||||
stroke-dasharray: 4;
|
stroke-dasharray: 4;
|
||||||
}
|
|
||||||
|
|
||||||
@media (max-width: 1800px) {
|
|
||||||
.asb-d3-chart .adaptive-tooltip {
|
|
||||||
font-size: 11px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (max-width: 1600px) {
|
|
||||||
.asb-d3-chart .adaptive-tooltip {
|
|
||||||
font-size: 9px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (max-width: 1440px) {
|
|
||||||
.asb-d3-chart .adaptive-tooltip {
|
|
||||||
font-size: 8px;
|
|
||||||
padding: 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (max-width: 1310px) {
|
|
||||||
.asb-d3-chart .adaptive-tooltip-small {
|
|
||||||
font-size: 7px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (max-width: 1279px) {
|
|
||||||
.asb-d3-chart .adaptive-tooltip-small {
|
|
||||||
font-size: 6px;
|
|
||||||
}
|
|
||||||
}
|
}
|
Loading…
Reference in New Issue
Block a user