personal-website/assets/css/single.css

main #container {
  display: grid;
  grid-template-columns: auto 15rem;
  column-gap: 2rem;
}

main #metadata {
  margin-bottom: 2rem;
}

main #metadata div {
  min-width: 100%;
  display: flex;
  column-gap: 2rem;
}

main #metadata div span {
  display: inline-flex;
  align-items: center;
  column-gap: 0.25rem;
}

main #metadata div #share {
  display: none;
}

main #metadata #share {
  cursor: pointer;
}

main #content ul,
main #content ol,
main #content .highlight {
  margin-bottom: 2rem;
}

main #content a {
  color: var(--crimson);
}

main #content .highlight pre,
main #content .highlight div {
  border-radius: 0.75rem;
}

main #content .highlight div {
  padding: 2rem 1rem;
}

main #content .highlight pre {
  padding: 0rem;
}

@media only screen and (max-width: 1024px) {
  main #container {
    display: block;
  }

  main #container #table-of-contents {
    display: none;
  }

  main #metadata div {
    column-gap: 0.75rem;
  }

  main #metadata div #share {
    display: inline-flex;
  }
}