Compare commits

...

1 Commits

Author SHA1 Message Date
Albert Backenhof
f8857b1594 Adjusted header height for medium font size
-The size pushed the lower end of the row-wrapper
 outside of the parent container, which was caused
 by the heights not adding up.

Issue: DEB-163
2019-04-10 11:23:11 +02:00
3 changed files with 5 additions and 13 deletions

View File

@@ -6,7 +6,7 @@ import Tooltip from '../tooltip/index.jsx';
const MeasurementColumnHeader = ({ baseCSS, general, hasSecondDimension, measurement, styling }) => { const MeasurementColumnHeader = ({ baseCSS, general, hasSecondDimension, measurement, styling }) => {
const title = `${measurement.name} ${measurement.magnitudeLabelSuffix}`; const title = `${measurement.name} ${measurement.magnitudeLabelSuffix}`;
const { fontSizeAdjustment } = styling.headerOptions; const { fontSizeAdjustment } = styling.headerOptions;
const isMediumFontSize = styling.headerOptions.fontSizeAdjustment === HEADER_FONT_SIZE.MEDIUM; const isMediumFontSize = fontSizeAdjustment === HEADER_FONT_SIZE.MEDIUM;
if (hasSecondDimension) { if (hasSecondDimension) {
const isPercentageFormat = measurement.format.substring(measurement.format.length - 1) === '%'; const isPercentageFormat = measurement.format.substring(measurement.format.length - 1) === '%';
@@ -20,7 +20,7 @@ const MeasurementColumnHeader = ({ baseCSS, general, hasSecondDimension, measure
...baseCSS, ...baseCSS,
cursor: 'default', cursor: 'default',
fontSize: `${baseFontSize + fontSizeAdjustment}px`, fontSize: `${baseFontSize + fontSizeAdjustment}px`,
height: isMediumFontSize ? '50px' : '25px', height: isMediumFontSize ? '40px' : '25px',
verticalAlign: 'middle' verticalAlign: 'middle'
}; };
return ( return (
@@ -39,7 +39,8 @@ const MeasurementColumnHeader = ({ baseCSS, general, hasSecondDimension, measure
); );
} }
const isLong = (title.length > 11 && fontSizeAdjustment === 0) || (title.length > 12 && fontSizeAdjustment === -2); const isLong = (title.length > 11 && fontSizeAdjustment === HEADER_FONT_SIZE.SMALL)
|| (title.length > 12 && fontSizeAdjustment === HEADER_FONT_SIZE.MEDIUM);
const suffixWrap = isLong ? '70' : 'empty'; const suffixWrap = isLong ? '70' : 'empty';
const style = { const style = {
...baseCSS, ...baseCSS,

View File

@@ -18,8 +18,7 @@ function getAlignment (option) {
function getFontSizeAdjustment (option) { function getFontSizeAdjustment (option) {
const fontSizeAdjustmentOptions = { const fontSizeAdjustmentOptions = {
1: HEADER_FONT_SIZE.SMALL, 1: HEADER_FONT_SIZE.SMALL,
2: HEADER_FONT_SIZE.MEDIUM, 2: HEADER_FONT_SIZE.MEDIUM
3: 2
}; };
return fontSizeAdjustmentOptions[option] || 0; return fontSizeAdjustmentOptions[option] || 0;

View File

@@ -87,14 +87,6 @@
text-overflow: ellipsis; text-overflow: ellipsis;
} }
.wrapclass45 {
width: 100%;
height: 45px;
white-space: pre-line;
overflow: hidden;
display: block;
}
.wrapclass70 { .wrapclass70 {
width: 100%; width: 100%;
height: 70px; height: 70px;