From 8bfee04c8c6948a88114d53769d4bb89b8ec7bf5 Mon Sep 17 00:00:00 2001
From: Jacky Zhao <j.zhao2k19@gmail.com>
Date: Sat, 17 Jun 2023 23:05:46 +0000
Subject: [PATCH] popovers

---
 quartz/styles/base.scss |   60 +++++++++++++++++++++++++++++++++++++++++++++++++++---------
 1 files changed, 51 insertions(+), 9 deletions(-)

diff --git a/quartz/styles/base.scss b/quartz/styles/base.scss
index 99613f9..9fc76f9 100644
--- a/quartz/styles/base.scss
+++ b/quartz/styles/base.scss
@@ -1,4 +1,5 @@
 @import "./syntax.scss";
+@import "./callouts.scss";
 
 html {
   scroll-behavior: smooth;
@@ -23,7 +24,7 @@
   border-radius: 5px;
 }
 
-p, ul, text, a, tr, td, li, ol, ul {
+p, ul, text, a, tr, td, li, ol, ul, .katex {
   color: var(--darkgray);
   fill: var(--darkgray);
 }
@@ -50,8 +51,31 @@
   padding: 4rem 30vw;
   margin: 0 auto;
   max-width: 1000px;
+  position: relative;
+
+  & .left, & .right {
+    position: fixed;
+    padding: 0 4rem 0 6rem;
+    max-width: 30vw;
+    box-sizing: border-box;
+    top: 10rem;
+  }
+  
+  & .left {
+    left: 0;
+  }
+
+  & .right {
+    right: 0;
+  }
+
   @media all and (max-width: 1200px) {
     padding: 25px 5vw;
+    & .left, & .right {
+      padding: 0;
+      max-width: none;
+      position: initial;
+    }
   }
 
   & p {
@@ -66,8 +90,7 @@
 }
 
 blockquote {
-  font-style: italic;
-  margin-left: 0;
+  margin: 1rem 0;
   border-left: 3px solid var(--secondary);
   padding-left: 1rem;
   transition: border-color 0.2s ease;
@@ -85,12 +108,26 @@
   font-weight: revert;
   margin: 2rem 0 0;
 
-  &:hover > .hanchor {
-    color: var(--secondary);
-  }
-
   article > & > a {
-    color: var(--dark)
+    color: var(--dark);
+    &.internal {
+      background-color: transparent;
+    }
+  }
+}
+
+h1, h2, h3, h4, h5, h6 {
+  &[id] > a {
+    margin: 0 0.5rem;
+    opacity: 0;
+    transition: opacity 0.2s ease;
+    transform: translateY(-0.1rem);
+    display: inline-block;
+    font-family: var(--codeFont);
+    user-select: none;
+  }
+  &[id]:hover > a {
+    opacity: 1;
   }
 }
 
@@ -120,7 +157,7 @@
   & > code {
     background: none;
     padding: 0;
-    font-size: 0.9rem;
+    font-size: 0.85rem;
     counter-reset: line;
     counter-increment: line 0;
     display: grid;
@@ -205,3 +242,8 @@
     padding: 0 1em
   }
 }
+
+audio, video {
+  width: 100%;
+  border-radius: 5px;
+}

--
Gitblit v1.10.0