change style

This commit is contained in:
Philipp Kühn
2021-02-02 14:26:25 +01:00
parent 959b7a26c6
commit 8cc6d359a9
29 changed files with 100 additions and 75 deletions

View File

@@ -82,7 +82,7 @@ a {
code {
font-family: 'JetBrainsMono', monospace;
padding: 0.1rem 0.3rem;
border-radius: 0.25rem;
border-radius: 0.4rem;
font-size: 0.9rem;
}
@@ -207,9 +207,12 @@ code {
> ol code,
> .table-wrapper code,
> .remark-container code {
color: rgba($colorBlack, 0.7);
background-color: rgba($colorYellow, 0.3);
background-color: $colorYellow;
box-decoration-break: clone;
// font-family: 'Inter';
font-weight: 700;
// font-size: 0.8rem;
}
> p a,
@@ -229,9 +232,9 @@ code {
& + ul {
list-style: none;
background-color: rgba($colorBlack, 0.03);
border: 3px solid $colorBlack;
padding: 1.25rem !important;
border-radius: 0.5rem;
border-radius: 0.75rem;
font-size: 0.85rem;
&::before {
@@ -241,7 +244,6 @@ code {
letter-spacing: 0.025rem;
font-size: 0.75rem;
text-transform: uppercase;
color: rgba($colorBlack, 0.3);
margin-bottom: 0.5rem;
}
@@ -365,28 +367,31 @@ code {
}
> .remark-container {
padding: 1.25rem;
border-radius: 0.5rem;
color: rgba($colorBlack, 0.7);
padding: 1rem 1.25rem;
border-radius: 0.75rem;
border: 3px solid $colorBlack;
&.warning {
background-color: rgba($colorYellow, 0.3);
background-color: $colorYellow;
}
&.info {
background-color: rgba($colorBlue, 0.3);
background-color: $colorBlue;
}
&.error {
background-color: rgba($colorRed, 0.3);
background-color: $colorRed;
}
&.pro {
background-color: rgba($colorOrange, 0.3);
background-color: $colorBlack;
color: $colorWhite;
}
.remark-container-title {
font-size: 1.1rem;
font-weight: 600;
margin-bottom: 0.25rem;
}
}

View File

@@ -93,24 +93,24 @@
;
}
// @font-face {
// font-family: 'Inter';
// font-style: normal;
// font-weight: 600;
// src:
// url("~@/assets/fonts/Inter-SemiBold.woff2") format("woff2"),
// url("~@/assets/fonts/Inter-SemiBold.woff") format("woff"),
// ;
// }
// @font-face {
// font-family: 'Inter';
// font-style: italic;
// font-weight: 600;
// src:
// url("~@/assets/fonts/Inter-SemiBoldItalic.woff2") format("woff2"),
// url("~@/assets/fonts/Inter-SemiBoldItalic.woff") format("woff"),
// ;
// }
@font-face {
font-family: 'Inter';
font-style: normal;
font-weight: 600;
src:
url("~@/assets/fonts/Inter-SemiBold.woff2") format("woff2"),
url("~@/assets/fonts/Inter-SemiBold.woff") format("woff"),
;
}
@font-face {
font-family: 'Inter';
font-style: italic;
font-weight: 600;
src:
url("~@/assets/fonts/Inter-SemiBoldItalic.woff2") format("woff2"),
url("~@/assets/fonts/Inter-SemiBoldItalic.woff") format("woff"),
;
}
@font-face {
font-family: 'Inter';
@@ -172,9 +172,19 @@
@font-face {
font-family: 'JetBrainsMono';
font-style: normal;
font-weight: 500;
font-weight: 400;
src:
url("~@/assets/fonts/JetBrainsMono-Regular.woff2") format("woff2"),
url("~@/assets/fonts/JetBrainsMono-Regular.woff") format("woff"),
;
}
@font-face {
font-family: 'JetBrainsMono';
font-style: normal;
font-weight: 700;
src:
url("~@/assets/fonts/JetBrainsMono-Bold.woff2") format("woff2"),
// url("~@/assets/fonts/JetBrainsMono-Bold.woff") format("woff"),
;
}

View File

@@ -45,7 +45,7 @@ pre[class*="language-"] {
color: $colorWhite;
background: $codeBackground;
padding: 1.25rem !important;
border-radius: 0.5rem;
border-radius: 0.75rem;
max-height: unquote("max(300px, 60vh)");
}

View File

@@ -188,7 +188,6 @@ $menuBreakPoint: 800px;
letter-spacing: 0.025rem;
font-size: 0.75rem;
text-transform: uppercase;
color: rgba($colorBlack, 0.3);
margin-bottom: 0.5rem;
}
@@ -224,6 +223,7 @@ $menuBreakPoint: 800px;
}
&--exact {
font-weight: 700;
color: $colorBlack;
background-color: rgba($colorBlack, 0.05);
}
@@ -232,47 +232,56 @@ $menuBreakPoint: 800px;
color: rgba($colorBlack, 0.4);
&::after {
content: 'draft';
font-family: 'JetBrainsMono', monospace;
content: 'DRAFT';
display: inline-flex;
align-items: center;
font-family: "JetBrainsMono", monospace;
font-weight: 700;
text-transform: uppercase;
color: $colorGrey;
background-color: rgba($colorGrey, 0.1);
padding: 0 0.5em;
border-radius: 5px;
background-color: rgba($colorBlack, 0.05);
font-size: 0.75rem;
padding: 0 0.4rem;
border-radius: 0.4rem;
}
}
&--pro {
&::after {
content: 'PRO';
font-family: 'JetBrainsMono', monospace;
content: "PRO";
display: inline-flex;
align-items: center;
font-family: "JetBrainsMono", monospace;
font-weight: 700;
text-transform: uppercase;
color: $colorOrange;
background-color: rgba($colorOrange, 0.1);
padding: 0 0.5em;
border-radius: 5px;
color: $colorWhite;
background-color: $colorBlack;
font-size: 0.75rem;
padding: 0 0.4rem;
border-radius: 0.4rem;
}
}
&--new {
&::after {
content: 'NEW';
font-family: 'JetBrainsMono', monospace;
display: inline-flex;
align-items: center;
font-family: "JetBrainsMono", monospace;
font-weight: 700;
text-transform: uppercase;
color: $colorGreen;
background-color: rgba($colorGreen, 0.1);
padding: 0 0.5em;
border-radius: 5px;
color: $colorBlack;
background-color: $colorGreen;
font-size: 0.75rem;
padding: 0 0.4rem;
border-radius: 0.4rem;
}
}
&--sponsor {
&::after {
content: '💖';
font-family: 'JetBrainsMono', monospace;
text-transform: uppercase;
content: '♥️';
padding: 0 0.5em;
border-radius: 5px;
}
}