1
0
Fork 0
mirror of https://github.com/dillonzq/LoveIt.git synced 2025-03-24 23:57:31 +01:00

fix: font family style

This commit is contained in:
Dillon 2022-05-15 23:41:35 +08:00
parent de88a28db7
commit b79ebc8141
No known key found for this signature in database
GPG key ID: 0EF4AE57FB98F108
10 changed files with 59 additions and 37 deletions

View file

@ -9,7 +9,7 @@ html {
scroll-behavior: smooth;
main [id] {
scroll-margin-top: $header-height + .5rem;
scroll-margin-top: calc(var(--header-height) + .5rem);
}
}

View file

@ -36,7 +36,7 @@ header {
}
.header-title {
font-family: $header-title-font-family;
font-family: var(--header-title-font-family);
font-weight: bold;
margin-right: .5rem;
min-width: 10%;
@ -148,8 +148,8 @@ header {
#header-desktop {
display: block;
position: fixed;
height: $header-height;
line-height: $header-height;
height: var(--header-height);
line-height: var(--header-height);
[data-header-desktop=normal] & {
position: static;
@ -159,7 +159,7 @@ header {
padding: 0 2rem 0 10vh;
.header-title {
font-size: $header-title-font-size;
font-size: var(--header-title-font-size);
}
.menu {
@ -213,8 +213,8 @@ header {
#header-mobile {
display: none;
position: fixed;
height: $header-height;
line-height: $header-height;
height: var(--header-height);
line-height: var(--header-height);
[data-header-mobile=normal] & {
position: static;
@ -230,7 +230,7 @@ header {
@include transition(margin-top 0.3s ease);
.header-title {
font-size: $header-title-font-size;
font-size: var(--header-title-font-size);
max-width: 80%;
}
@ -289,7 +289,7 @@ header {
justify-content: space-between;
align-items: center;
box-sizing: border-box;
padding: ($header-height - 2.5rem) / 2 1rem;
padding: calc((var(--header-height) - 2.5rem) / 2) 1rem;
line-height: 2.5rem;
}
@ -328,7 +328,7 @@ header {
&.open {
.header-wrapper {
margin-top: -$header-height;
margin-top: -var(--header-height);
}
.menu {
@ -349,7 +349,7 @@ header {
.search-dropdown {
position: fixed;
z-index: 200;
top: $header-height;
top: var(--header-height);
@include box-shadow(0 .125rem .25rem rgba(0, 0, 0, .1));
&.desktop {
@ -372,7 +372,7 @@ header {
.suggestions {
overflow-y: auto;
max-height: calc(100vh - #{$header-height});
max-height: calc(100vh - var(--header-height));
.suggestion {
padding: .75rem 1rem;

View file

@ -53,7 +53,7 @@
width: 100%;
[data-header-mobile] & {
padding-top: $header-height;
padding-top: var(--header-height);
}
[data-header-mobile=normal] & {

View file

@ -1,6 +1,30 @@
:root {
--global-font-family: #{$global-font-family};
// ========== Global ========== //
// Font and Line Height
--global-font-family: #{inspect($global-font-family)};
--global-font-size: #{$global-font-size};
--global-font-weight: #{$global-font-weight};
--global-line-height: #{$global-line-height};
// ========== Global ========== //
// ========== Header ========== //
// Height of the header
--header-height: #{$header-height};
// Font family and size of the header title
--header-title-font-family: #{inspect($header-title-font-family)};
--header-title-font-size: #{$header-title-font-size};
// ========== Header ========== //
// ========== Single Content ========== //
// Font size of the TOC
--toc-title-font-size: #{$toc-title-font-size};
--toc-content-font-size: #{$toc-content-font-size};
// ========== Single Content ========== //
// ========== Code ========== //
// Font family and size of the code
--code-font-family: #{inspect($code-font-family)};
--code-font-size: #{$code-font-size};
// ========== Code ========== //
}

View file

@ -5,7 +5,7 @@
margin: 0 auto;
[data-header-desktop] & {
padding-top: $header-height;
padding-top: var(--header-height);
}
[data-header-desktop=normal] & {

View file

@ -290,7 +290,7 @@
@include border-radius(3px);
@include box-shadow(inset 0 -1px 0 $global-border-color);
font-size: .8rem;
font-family: $code-font-family;
font-family: var(--code-font-family);
color: $code-color;
[theme=dark] & {
@ -316,7 +316,7 @@
.highlight {
padding: .375rem;
font-size: .875rem;
font-family: $code-font-family;
font-family: var(--code-font-family);
font-weight: bold;
word-break: break-all;
white-space: pre-wrap;

View file

@ -4,8 +4,8 @@ code {
padding: 0 .4rem;
@include overflow-wrap(break-word);
@include line-break(anywhere);
font-size: $code-font-size;
font-family: $code-font-family;
font-size: var(--code-font-size);
font-family: var(--code-font-family);
color: $code-color;
[theme=dark] & {
@ -38,8 +38,8 @@ code, pre, .highlight table, .highlight tr, .highlight td {
}
.highlight {
font-family: $code-font-family;
font-size: $code-font-size;
font-family: var(--code-font-family);
font-size: var(--code-font-size);
line-height: 1.4em;
margin: .5rem 0;
@ -210,8 +210,8 @@ code, pre, .highlight table, .highlight tr, .highlight td {
}
.gist {
font-family: $code-font-family;
font-size: $code-font-size;
font-family: var(--code-font-family);
font-size: var(--code-font-size);
.table-wrapper {
> table,

View file

@ -1,12 +1,12 @@
.toc {
.toc-title {
font-size: $toc-title-font-size;
font-size: var(--toc-title-font-size);
font-weight: bold;
text-transform: uppercase;
}
.toc-content {
font-size: $toc-content-font-size;
font-size: var(--toc-content-font-size);
ul {
text-indent: -0.85rem;

View file

@ -4,7 +4,7 @@
// ========== Global ========== //
// Font and Line Height
$global-font-family: system-ui, -apple-system, BlinkMacSystemFont, PingFang SC, Microsoft YaHei UI, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, Helvetica, Arial, sans-serif !default;
$global-font-family: system-ui, -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei UI", "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", Helvetica, Arial, sans-serif !default;
$global-font-size: 16px;
$global-font-weight: 400;
$global-line-height: 1.5rem;
@ -52,14 +52,14 @@ $selection-color-dark: rgba(50, 112, 194, 0.4) !default;
// Height of the header
$header-height: 3.5rem !default;
// Font family and size of the header title
$header-title-font-family: $global-font-family !default;
$header-title-font-size: 1.5rem !default;
// Color of the header background
$header-background-color: #f8f8f8 !default;
$header-background-color-dark: #252627 !default;
// Font style of the header title
$header-title-font-family: $global-font-family !default;
$header-title-font-size: 1.5rem !default;
// Color of the hover header item
$header-hover-color: #161209 !default;
$header-hover-color-dark: #fff !default;
@ -106,6 +106,10 @@ $pagination-link-hover-color-dark: #fff !default;
// ========== Pagination ========== //
// ========== Code ========== //
// Font family and size of the code
$code-font-family: "Source Code Pro", Menlo, Consolas, Monaco, monospace, $global-font-family !default;
$code-font-size: .875rem !default;
// Color of the code
$code-color: #E74C3C !default;
$code-color-dark: #E5BF78 !default;
@ -117,12 +121,6 @@ $code-background-color-dark: #272C34 !default;
$code-info-color: #9c9c9c !default;
$code-info-color-dark: #b1b0b0 !default;
// Font size of the code
$code-font-size: .875rem !default;
// Font family of the code
$code-font-family: Source Code Pro, Menlo, Consolas, Monaco, monospace, $global-font-family !default;
// Code type map
$code-type-map: (
// Custom code type

File diff suppressed because one or more lines are too long