fix: latex rendering bugs + patch for #195

Jacky Zhao

2022-09-12 e6c7a4e1e2e3b0437b5dbbbeb7abc4e05622db16

 assets/styles/base.scss

@@ -10,11 +10,14 @@
html {
  scroll-behavior: smooth;
  &:lang(ar) {
    & p, & h1, & h2, & h3, article {
    & p, & h1, & h2, & h3, article, header {
      direction: rtl;
      text-align: right;
    }
  }
  & footer > p {
    text-align: center !important;
  }
}

.singlePage {
@@ -34,27 +37,26 @@
  background-color: var(--light);
}

h1, h2, h3, h4, h5, h6, ol, ul, thead {
h1, h2, h3, h4, h5, h6, thead {
  font-family: var(--font-header);
  color: var(--dark);
  font-weight: revert;
  margin: revert;
  padding: revert;
  margin: 2rem 0 0;
  padding: 2rem auto 1rem;

  &:hover > .hanchor {
    opacity: 1;
    color: var(--secondary);
  }
}

.hanchor {
  font-family: var(--font-header);
  margin-left: -1em;
  opacity: 0.3;
  transition: opacity 0.3s ease;
  color: var(--secondary);
  opacity: 0.8;
  transition: color 0.3s ease;
  color: var(--dark);
}

p, ul, text, a, tr, td {
p, ul, text, a, tr, td, li, ol, ul {
  font-family: var(--font-body);
  color: var(--gray);
  fill: var(--gray);
@@ -63,7 +65,7 @@
  padding: revert;
}

tbody, li {
tbody, li, p {
  line-height: 1.5em;
}

@@ -170,29 +172,20 @@
      background-color: transparent !important;
    }

    & a[href$="#"] {
    & a[href$="#"], &.active a {
      opacity: 0.2;
    }
  }
}

.section {
  & h3 > a {
    font-weight: 700;
    margin: 0;
  }
  & p {
    margin-top: 0;
  }
}

article {
  & > h1 {
    margin-top: 2em;
    font-size: 2em;
  }
  
  & > .meta {
    margin: -1.5em 0 1em 0;
    margin: 0 0 1em 0;
    opacity: 0.7;
  }

@@ -223,6 +216,7 @@
  padding-left: 0;

  & .meta {
    margin: 1.5em 0;
    & > h1 {
      margin: 0;
    }
@@ -233,7 +227,7 @@

  & > li {
    display: inline-block;
    margin: 0.4em 0;
    margin: 0.4em 0.2em;
  }

  & > li > a {
@@ -258,8 +252,11 @@
  padding: 0 0.1em 0 0.2em;
}

#page-title > a {
  font-family: var(--font-header);
#page-title {
  margin: 0;
  & > a {
    font-family: var(--font-header);
  }
}

a {
@@ -327,7 +324,8 @@
  & > .backlinks-container {
    & > ul {
      list-style: none;
      padding-left: 0;
      padding: 0;
      margin: 0;

      & > li {
        margin: 0.5em 0;
@@ -343,6 +341,7 @@
    border-radius: 5px;
    box-sizing: border-box;
    min-height: 250px;
    margin: 0.5em 0;

    & > svg {
      margin-bottom: -5px;
@@ -355,10 +354,15 @@
  margin-top: 30vh;
}

.spacer {
  flex: 1 1 auto;
}

header {
  display: flex;
  flex-direction: row;
  align-items: center;
  margin: 1em 0 2em;

  & > h1 {
    font-size: 2em;
@@ -370,10 +374,6 @@
    }
  }

  & > .spacer {
    flex: 1 1 auto;
  }

  #search-icon {
    background-color: var(--lightgray);
    border-radius: 4px;
@@ -383,7 +383,7 @@
    cursor: pointer;
    & > p {
      display: inline;
      padding: 0 0.5em 0 1em;
      padding: 0 1.5em 0 2em;
    }
  }

@@ -499,23 +499,44 @@

.section-ul {
  list-style: none;
  margin-top: 2em;
  padding-left: 0;

  & > li {
    border: 1px solid var(--outlinegray);
    border-radius: 5px;
    padding: 0 1em;
    margin-bottom: 1em;
}

    & h3 {
      opacity: 1;
.section-li {
  margin-bottom: 1em;

  & > .section {
    display: flex;
    align-items: center; 

    @media all and (max-width: 600px) {
      & .tags {
        display: none;
      }
    }

    & h3 > a {
      font-weight: 700;
      margin-bottom: 0em;
      margin: 0;
    }
    
    & p {
      margin: 0;
      padding-right: 1em;
      flex-basis: 6em; 
    }
  }

    & .meta {
      opacity: 0.6;
    }
  & h3 {
    opacity: 1;
    font-weight: 700;
    margin: 0em;
  }

  & .meta {
    opacity: 0.6;
  }
}

@@ -574,9 +595,13 @@
    font-size: 0.8rem;
  }

  & > p {
    margin: 0;
    padding: 0.5rem 0;
  } 

  & > p, & > a {
    font-size: 1rem;
    margin: 0;
    font-weight: 400;
    user-select: none;
  }