diff --git a/web_src/css/admin.css b/web_src/css/admin.css
index 74e6b10a7..fecae5f2b 100644
--- a/web_src/css/admin.css
+++ b/web_src/css/admin.css
@@ -13,7 +13,7 @@
.admin dl.admin-dl-horizontal dt,
.admin dl.admin-dl-horizontal dd {
- line-height: 1;
+ line-height: var(--line-height-default);
padding: 5px 0;
}
diff --git a/web_src/css/base.css b/web_src/css/base.css
index 0ea0c8186..94dd85814 100644
--- a/web_src/css/base.css
+++ b/web_src/css/base.css
@@ -9,6 +9,8 @@
--font-weight-medium: 500;
--font-weight-semibold: 600;
--font-weight-bold: 700;
+ /* line-height: use the default value as "modules/normalize.css" */
+ --line-height-default: 1.15;
/* backgrounds */
--checkbox-mask-checked: url('data:image/svg+xml;utf8,');
--checkbox-mask-indeterminate: url('data:image/svg+xml;utf8,');
@@ -518,6 +520,9 @@ a.label,
.ui.menu .item {
color: var(--color-text);
user-select: auto;
+ line-height: var(--line-height-default); /* fomantic uses "1" which causes overflow problems because "1" doesn't consider the descent part */
+ padding-top: 11px; /* counteract line-height change */
+ padding-bottom: 11px; /* counteract line-height change */
}
.ui.menu .item > .svg {
@@ -664,6 +669,8 @@ a.label,
.ui.secondary.menu .item {
margin-left: 0;
margin-right: 0;
+ padding-top: 10px; /* counteract line-height change */
+ padding-bottom: 10px; /* counteract line-height change */
}
.ui.secondary.menu .dropdown.item:hover,
@@ -1476,7 +1483,7 @@ img.ui.avatar,
height: 3em;
float: none;
display: block;
- line-height: 1;
+ line-height: var(--line-height-default);
padding: 0;
margin: 0 auto 0.5rem;
opacity: 1;
@@ -2124,7 +2131,7 @@ table th[data-sortt-desc] .svg {
.emoji,
.reaction {
font-size: 1.25em;
- line-height: 1;
+ line-height: var(--line-height-default);
font-style: normal !important;
font-weight: var(--font-weight-normal) !important;
vertical-align: -0.075em;
@@ -2247,7 +2254,7 @@ table th[data-sortt-desc] .svg {
}
.ui.dropdown {
- line-height: 1; /* the dropdown doesn't have default line-height, use this to make the dropdown icon align with plain dropdown */
+ line-height: var(--line-height-default); /* the dropdown doesn't have default line-height, use this to make the dropdown icon align with plain dropdown */
}
/* dropdown has some kinds of icons:
diff --git a/web_src/css/repo.css b/web_src/css/repo.css
index 34fa2a005..8e8125a5f 100644
--- a/web_src/css/repo.css
+++ b/web_src/css/repo.css
@@ -390,8 +390,8 @@
}
.repository.file.list .non-diff-file-content .header .file-actions .btn-octicon {
- line-height: 1;
- padding: 10px 8px;
+ line-height: var(--line-height-default);
+ padding: 8px;
vertical-align: middle;
color: var(--color-text);
}