From b4e26971165d49604014a1ed38aaa18b2c20fc23 Mon Sep 17 00:00:00 2001
From: Jacky Zhao <j.zhao2k19@gmail.com>
Date: Mon, 27 Dec 2021 20:59:19 +0000
Subject: [PATCH] content section
---
assets/base.scss | 120 +++++++++++++++++++++++++++++++++++++++++-------------------
1 files changed, 82 insertions(+), 38 deletions(-)
diff --git a/assets/base.scss b/assets/base.scss
index a1b5c7b..c9340a9 100644
--- a/assets/base.scss
+++ b/assets/base.scss
@@ -8,26 +8,19 @@
h1, h2, h3, h4, ol, ul, thead {
font-family: Inter;
- color: var(--dark)
+ color: var(--dark);
+ font-weight: revert;
+ margin: revert;
+ padding: revert;
}
p, ul, text {
font-family: 'Source Sans Pro', sans-serif;
color: var(--gray);
fill: var(--gray);
-}
-
-a {
- font-family: Inter;
- font-weight: 700;
- font-size: 1em;
- text-decoration: none;
- transition: all 0.2s ease;
- color: var(--secondary);
-
- &:hover {
- color: var(--tertiary) !important;
- }
+ font-weight: revert;
+ margin: revert;
+ padding: revert;
}
#TableOfContents > ol {
@@ -88,12 +81,8 @@
line-height: 1.5em;
}
-h2 {
- opacity: 0.85;
-}
-
-h3 {
- opacity: 0.75;
+h2, h3 {
+ opacity: 0.9;
}
blockquote {
@@ -122,9 +111,20 @@
article a {
font-family: Source Sans Pro;
font-weight: 600;
- text-decoration: underline;
- text-decoration-color: var(--tertiary);
- text-decoration-thickness: .15em;
+
+ // internal link
+ &[href^="./"], &[href^="/"] {
+ text-decoration: none;
+ background-color: transparentize(#8f9fa9, 0.85);
+ padding: 0 0.1em;
+ margin: auto -0.1em;
+ border-radius: 3px;
+ }
+}
+
+.backlinks a {
+ font-weight: 600;
+ font-size: 0.9rem;
}
sup > a {
@@ -132,6 +132,19 @@
padding: 0 0.1em 0 0.2em;
}
+a {
+ font-family: Inter, sans-serif;
+ font-size: 1em;
+ font-weight: 700;
+ text-decoration: none;
+ transition: all 0.2s ease;
+ color: var(--secondary);
+
+ &:hover {
+ color: var(--tertiary) !important;
+ }
+}
+
pre {
font-family: 'Fira Code';
padding: 0.75em;
@@ -184,14 +197,6 @@
background-color: var(--dark);
}
-// internal link
-a[href^="/"] {
- text-decoration: none;
- background-color: #afbfc922;
- padding: 0 0.2em;
- border-radius: 3px;
-}
-
.singlePage {
margin: 4em 30vw;
@@ -229,7 +234,7 @@
& #graph-container {
border: var(--outlinegray) 1px solid;
- border-radius: 5px
+ border-radius: 5px;
}
}
@@ -237,19 +242,23 @@
margin-top: 30vh;
}
+article > h1 {
+ font-size: 2em;
+}
+
header {
display: flex;
flex-direction: row;
align-items: center;
+ & > h1 {
+ font-size: 2em;
+ }
+
& > nav {
@media all and (max-width: 600px) {
display: none;
}
-
- & > a {
- margin-left: 2em;
- }
}
& > .spacer {
@@ -280,7 +289,8 @@
left: 0;
top: 0;
width: 100vw;
- height: 100vh;
+ height: 100%;
+ overflow: scroll;
display: none;
backdrop-filter: blur(4px);
-webkit-backdrop-filter: blur(4px);
@@ -323,8 +333,20 @@
transition: background 0.2s ease;
border: 1px solid var(--outlinegray);
border-bottom: none;
+ width: 100%;
- &:hover {
+ // normalize button props
+ font-family: inherit;
+ font-size: 100%;
+ line-height: 1.15;
+ margin: 0;
+ overflow: visible;
+ text-transform: none;
+ text-align: left;
+ background: var(--light);
+ outline: none;
+
+ &:hover, &:focus {
background: rgba(180, 180, 180, 0.15);
}
@@ -351,4 +373,26 @@
}
}
}
+}
+
+.section-ul {
+ list-style: none;
+ padding-left: 0;
+
+ & > li {
+ border: 1px solid var(--outlinegray);
+ border-radius: 5px;
+ padding: 0 1em;
+ margin-bottom: 1em;
+
+ & h3 {
+ opacity: 1;
+ font-weight: 700;
+ margin-bottom: 0em;
+ }
+
+ & .meta {
+ opacity: 0.6;
+ }
+ }
}
\ No newline at end of file
--
Gitblit v1.10.0