various polish

quartz/components/styles/backlinks.scss

@@ -7,13 +7,9 @@
   & > ul {
     list-style: none;
     padding: 0;
-    margin: 0;
+    margin: 0.5rem 0;
 
     & > li {
-      margin: 0.5rem 0;
-      padding: 0.25rem 1rem;
-      border: var(--lightgray) 1px solid;
-      border-radius: 5px;
       & > a {
         background-color: transparent;
       }

quartz/components/styles/footer.scss

@@ -1,6 +1,8 @@
 footer {
   text-align: left;
   opacity: 0.8;
+  margin-bottom: 4rem;
+
   & ul {
     list-style: none;
     margin: 0;

quartz/components/styles/graph.scss

@@ -11,6 +11,7 @@
     height: 250px;
     margin: 0.5em 0;
     position: relative;
+    overflow: hidden;
 
     & > #global-graph-icon {
       color: var(--dark);
@@ -30,10 +31,6 @@
         background-color: var(--lightgray);
       }
     }
-
-    & > #graph-container > svg {
-      margin-bottom: -5px;
-    }
   }
 
   & > #global-graph-outer {

quartz/components/styles/listPage.scss

@@ -8,29 +8,36 @@ li.section-li {
   margin-bottom: 1em;
 
   & > .section {
-    display: flex;
-    align-items: center;
+    display: grid;
+    grid-template-columns: 6em 3fr 1fr;
 
     @media all and (max-width: 600px) {
-      & .tags {
+      & > .tags {
         display: none;
       }
     }
 
-    & h3 > a {
-      font-weight: 700;
-      margin: 0;
-      background-color: transparent;
+    & > .tags {
+      justify-self: end;
+      margin-left: 1rem;
     }
 
-    & p {
+    & > .desc a {
+      background-color: transparent; 
+    }
+
+    & > .meta {
       margin: 0;
-      padding-right: 1em;
       flex-basis: 6em;
+      opacity: 0.6;
     }
   }
-
-  & .meta {
-    opacity: 0.6;
-  }
+}
+
+// modifications in popover context
+.popover .section {
+  grid-template-columns: 6em 1fr !important;
+  & > .tags {
+    display: none;
+  }
 }

quartz/components/styles/popover.scss

@@ -24,7 +24,7 @@
     height: 20rem;
     padding: 0 1rem 1rem 1rem;
     font-weight: initial;
-    line-height: initial;
+    line-height: normal;
     font-size: initial;
     font-family: var(--bodyFont);
     border: 1px solid var(--gray);

quartz/components/styles/search.scss

@@ -1,8 +1,7 @@
 .search {
   min-width: 5rem;
-  max-width: 12rem;
+  max-width: 14rem;
   flex-grow: 0.3;
-  margin: 0 1.5rem;
 
   & > #search-icon {
     background-color: var(--lightgray);