From 7d602ae678af0427c4c1fed9ad15980adc4bc356 Mon Sep 17 00:00:00 2001 From: Thomas Lamprecht Date: Wed, 13 Apr 2022 11:09:07 +0200 Subject: [PATCH] css: fix tab icon/text baseline the baseline for the text was seriously off, the text had (relatively) much more space below than above, which looks off for buttons with an actual background Instead of centering with margin/padding explicitly, do so with the flex layout model. Signed-off-by: Thomas Lamprecht --- src/css/ext6-pmx.css | 24 ++++++++++++++++++++++++ 1 file changed, 24 insertions(+) diff --git a/src/css/ext6-pmx.css b/src/css/ext6-pmx.css index 2516578..c26b533 100644 --- a/src/css/ext6-pmx.css +++ b/src/css/ext6-pmx.css @@ -179,6 +179,30 @@ div.right-aligned { height: 100%; } +/* Fix icon/text baseline */ +.x-tab-default { + display: inline-flex; + align-items: center; + justify-content: center; +} +.x-tab-default > span { + text-align: center; + vertical-align: middle; +} +.x-tab-button { + line-height: unset; +} +.x-tab-inner { + display: unset; + vertical-align: text-top; +} +.x-tab-wrap { + display: unset; +} +.x-tab-default-top { + padding: 2px 6px 2px 6px; +} + /* rules for the markdown content, prefix with the .pmx-md class */ .pmx-md { font-size: 1.0em;