Override fonts using Fomantic config (#13465)

Saves is from doing it manually and saves a few CSS bytes.

Co-authored-by: techknowlogick <techknowlogick@gitea.io>
tokarchuk/v1.17
silverwind 4 years ago committed by GitHub
parent c05a8abc76
commit 049a87c402
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
  1. 5
      web_src/fomantic/_site/globals/site.variables
  2. 38
      web_src/fomantic/build/semantic.css
  3. 47
      web_src/less/_base.less

@ -1 +1,4 @@
@fontName : 'Roboto'; /* https://github.com/fomantic/Fomantic-UI/blob/develop/src/themes/default/globals/site.variables */
@headerFont: var(--fonts-regular);
@pageFont: var(--fonts-regular);

@ -43,7 +43,7 @@
.ui.accordion .title:not(.ui) { .ui.accordion .title:not(.ui) {
padding: 0.5em 0; padding: 0.5em 0;
font-family: 'Roboto', 'Helvetica Neue', Arial, Helvetica, sans-serif; font-family: var(--fonts-regular);
font-size: 1em; font-size: 1em;
color: rgba(0, 0, 0, 0.87); color: rgba(0, 0, 0, 0.87);
} }
@ -423,7 +423,7 @@
vertical-align: baseline; vertical-align: baseline;
background: #E0E1E2 none; background: #E0E1E2 none;
color: rgba(0, 0, 0, 0.6); color: rgba(0, 0, 0, 0.6);
font-family: 'Roboto', 'Helvetica Neue', Arial, Helvetica, sans-serif; font-family: var(--fonts-regular);
margin: 0 0.25em 0 0; margin: 0 0.25em 0 0;
padding: 0.78571429em 1.5em 0.78571429em; padding: 0.78571429em 1.5em 0.78571429em;
text-transform: none; text-transform: none;
@ -5179,7 +5179,7 @@
.ui.card > .content > .header { .ui.card > .content > .header {
display: block; display: block;
margin: ''; margin: '';
font-family: 'Roboto', 'Helvetica Neue', Arial, Helvetica, sans-serif; font-family: var(--fonts-regular);
color: rgba(0, 0, 0, 0.85); color: rgba(0, 0, 0, 0.85);
} }
@ -7619,7 +7619,7 @@ a.inverted.ui.card:hover,
/* Text Container */ /* Text Container */
.ui.text.container { .ui.text.container {
font-family: 'Roboto', 'Helvetica Neue', Arial, Helvetica, sans-serif; font-family: var(--fonts-regular);
max-width: 700px; max-width: 700px;
line-height: 1.5; line-height: 1.5;
font-size: 1.14285714rem; font-size: 1.14285714rem;
@ -10723,7 +10723,7 @@ select.ui.dropdown {
.ui.form input[type="text"], .ui.form input[type="text"],
.ui.form input[type="file"], .ui.form input[type="file"],
.ui.form input[type="url"] { .ui.form input[type="url"] {
font-family: 'Roboto', 'Helvetica Neue', Arial, Helvetica, sans-serif; font-family: var(--fonts-regular);
margin: 0; margin: 0;
outline: none; outline: none;
-webkit-appearance: none; -webkit-appearance: none;
@ -10755,7 +10755,7 @@ select.ui.dropdown {
box-shadow: 0 0 0 0 transparent inset; box-shadow: 0 0 0 0 transparent inset;
transition: color 0.1s ease, border-color 0.1s ease; transition: color 0.1s ease, border-color 0.1s ease;
font-size: 1em; font-size: 1em;
font-family: 'Roboto', 'Helvetica Neue', Arial, Helvetica, sans-serif; font-family: var(--fonts-regular);
line-height: 1.2857; line-height: 1.2857;
resize: vertical; resize: vertical;
} }
@ -14784,7 +14784,7 @@ select.ui.dropdown {
border: none; border: none;
margin: calc(2rem - 0.1428571428571429em) 0 1rem; margin: calc(2rem - 0.1428571428571429em) 0 1rem;
padding: 0 0; padding: 0 0;
font-family: 'Roboto', 'Helvetica Neue', Arial, Helvetica, sans-serif; font-family: var(--fonts-regular);
font-weight: bold; font-weight: bold;
line-height: 1.28571429em; line-height: 1.28571429em;
text-transform: none; text-transform: none;
@ -24986,7 +24986,7 @@ img.ui.bordered.image {
-webkit-tap-highlight-color: rgba(255, 255, 255, 0); -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
text-align: left; text-align: left;
line-height: 1.21428571em; line-height: 1.21428571em;
font-family: 'Roboto', 'Helvetica Neue', Arial, Helvetica, sans-serif; font-family: var(--fonts-regular);
padding: 0.67857143em 1em; padding: 0.67857143em 1em;
background: #FFFFFF; background: #FFFFFF;
border: 1px solid rgba(34, 36, 38, 0.15); border: 1px solid rgba(34, 36, 38, 0.15);
@ -25868,7 +25868,7 @@ img.ui.bordered.image {
.ui.items > .item > .content > .header { .ui.items > .item > .content > .header {
display: inline-block; display: inline-block;
margin: -0.21425em 0 0; margin: -0.21425em 0 0;
font-family: 'Roboto', 'Helvetica Neue', Arial, Helvetica, sans-serif; font-family: var(--fonts-regular);
font-weight: bold; font-weight: bold;
color: rgba(0, 0, 0, 0.85); color: rgba(0, 0, 0, 0.85);
} }
@ -28905,7 +28905,7 @@ ol.ui.list ol li,
.ui.list > .item .header { .ui.list > .item .header {
display: block; display: block;
margin: 0; margin: 0;
font-family: 'Roboto', 'Helvetica Neue', Arial, Helvetica, sans-serif; font-family: var(--fonts-regular);
font-weight: bold; font-weight: bold;
color: rgba(0, 0, 0, 0.87); color: rgba(0, 0, 0, 0.87);
} }
@ -30779,7 +30779,7 @@ ol.ui.suffixed.list li:before,
.ui.menu { .ui.menu {
display: flex; display: flex;
margin: 1rem 0; margin: 1rem 0;
font-family: 'Roboto', 'Helvetica Neue', Arial, Helvetica, sans-serif; font-family: var(--fonts-regular);
background: #FFFFFF; background: #FFFFFF;
font-weight: normal; font-weight: normal;
border: 1px solid rgba(34, 36, 38, 0.15); border: 1px solid rgba(34, 36, 38, 0.15);
@ -33232,7 +33232,7 @@ Floated Menu / Item
.ui.message .header { .ui.message .header {
display: block; display: block;
font-family: 'Roboto', 'Helvetica Neue', Arial, Helvetica, sans-serif; font-family: var(--fonts-regular);
font-weight: bold; font-weight: bold;
margin: -0.14285714em 0 0 0; margin: -0.14285714em 0 0 0;
} }
@ -33958,7 +33958,7 @@ Floated Menu / Item
.ui.modal > .header { .ui.modal > .header {
display: block; display: block;
font-family: 'Roboto', 'Helvetica Neue', Arial, Helvetica, sans-serif; font-family: var(--fonts-regular);
background: #FFFFFF; background: #FFFFFF;
margin: 0; margin: 0;
padding: 1.25rem 1.5rem; padding: 1.25rem 1.5rem;
@ -34747,7 +34747,7 @@ Floated Menu / Item
.ui.popup > .header { .ui.popup > .header {
padding: 0; padding: 0;
font-family: 'Roboto', 'Helvetica Neue', Arial, Helvetica, sans-serif; font-family: var(--fonts-regular);
font-size: 1.14285714em; font-size: 1.14285714em;
line-height: 1.2; line-height: 1.2;
font-weight: bold; font-weight: bold;
@ -37054,7 +37054,7 @@ template {
.ui.search > .results .result .title { .ui.search > .results .result .title {
margin: -0.14285714em 0 0; margin: -0.14285714em 0 0;
font-family: 'Roboto', 'Helvetica Neue', Arial, Helvetica, sans-serif; font-family: var(--fonts-regular);
font-weight: bold; font-weight: bold;
font-size: 1em; font-size: 1em;
color: rgba(0, 0, 0, 0.85); color: rgba(0, 0, 0, 0.85);
@ -37080,7 +37080,7 @@ template {
} }
.ui.search > .results > .message .header { .ui.search > .results > .message .header {
font-family: 'Roboto', 'Helvetica Neue', Arial, Helvetica, sans-serif; font-family: var(--fonts-regular);
font-size: 1rem; font-size: 1rem;
font-weight: bold; font-weight: bold;
color: rgba(0, 0, 0, 0.87); color: rgba(0, 0, 0, 0.87);
@ -37288,7 +37288,7 @@ template {
width: 100px; width: 100px;
white-space: nowrap; white-space: nowrap;
background: transparent; background: transparent;
font-family: 'Roboto', 'Helvetica Neue', Arial, Helvetica, sans-serif; font-family: var(--fonts-regular);
font-size: 1em; font-size: 1em;
padding: 0.4em 1em; padding: 0.4em 1em;
font-weight: bold; font-weight: bold;
@ -39034,7 +39034,7 @@ body {
overflow-x: hidden; overflow-x: hidden;
min-width: 320px; min-width: 320px;
background: #FFFFFF; background: #FFFFFF;
font-family: 'Roboto', 'Helvetica Neue', Arial, Helvetica, sans-serif; font-family: var(--fonts-regular);
font-size: 14px; font-size: 14px;
line-height: 1.4285em; line-height: 1.4285em;
color: rgba(0, 0, 0, 0.87); color: rgba(0, 0, 0, 0.87);
@ -39049,7 +39049,7 @@ h2,
h3, h3,
h4, h4,
h5 { h5 {
font-family: 'Roboto', 'Helvetica Neue', Arial, Helvetica, sans-serif; font-family: var(--fonts-regular);
line-height: 1.28571429em; line-height: 1.28571429em;
margin: calc(2rem - 0.1428571428571429em) 0 1rem; margin: calc(2rem - 0.1428571428571429em) 0 1rem;
font-weight: bold; font-weight: bold;

@ -104,52 +104,7 @@
url("../fonts/noto-color-emoji/NotoColorEmoji.ttf") format("truetype"); url("../fonts/noto-color-emoji/NotoColorEmoji.ttf") format("truetype");
} }
/* Most of these selectors override fomantic ui */ textarea {
body,
textarea,
h1,
h2,
h3,
h4,
h5,
.markdown:not(code),
.ui.accordion .title:not(.ui),
.ui.button,
.ui.card > .content > .header.ui.card > .content > .header,
.ui.category.search > .results .category > .name,
.ui.form input:not([type]),
.ui.form input[type="date"],
.ui.form input[type="datetime-local"],
.ui.form input[type="email"],
.ui.form input[type="file"],
.ui.form input[type="number"],
.ui.form input[type="password"],
.ui.form input[type="search"],
.ui.form input[type="tel"],
.ui.form input[type="text"],
.ui.form input[type="time"],
.ui.form input[type="url"],
.ui.input textarea,
.ui.form textarea,
.ui.header,
.ui.items > .item > .content > .header,
.ui.list .list > .item .header,
.ui.list > .item .header,
.ui.menu,
.ui.message .header,
.ui.modal > .header,
.ui.popup > .header,
.ui.search > .results .result .title,
.ui.search > .results > .message .header,
.ui.input > input,
.ui.input input,
.ui.statistics .statistic > .value,
.ui.statistic > .value,
.ui.statistics .statistic > .label,
.ui.statistic > .label,
.ui.steps .step .title,
.ui.text.container,
.ui.language > .menu > .item {
font-family: var(--fonts-regular); font-family: var(--fonts-regular);
} }

Loading…
Cancel
Save