redemption/source/css/markdown/_markdown.scss

.markdown {
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
  margin: 0;
  color: #262626;
  background-color: #ffffff;
  @include darkmode {
    color: #dbdbdb;
    background-color: #292929;
  }
  line-height: 1.5;
  word-wrap: break-word;
  .octicon {
    display: inline-block;
    fill: currentColor;
    vertical-align: text-bottom;
    display: inline-block;
    overflow: visible !important;
    vertical-align: text-bottom;
    fill: currentColor;
  }
  summary {
    display: list-item;
  }
  [hidden] {
    display: none !important;
  }
  a {
    background-color: transparent;
    color: #0969da;
    @include darkmode {
      color: #58a6ff;
    }
    text-decoration: none;
    &:hover {
      text-decoration: underline;
    }
    &:not([href]) {
      color: inherit;
      text-decoration: none;
    }
  }
  abbr[title] {
    border-bottom: none;
    text-decoration: underline dotted;
  }
  dfn {
    font-style: italic;
  }
  h1 {
    margin: 0.67em 0;
    font-weight: 600;
    padding-bottom: 0.3em;
    font-size: 2em;
    border-bottom: 1px solid hsla(210, 18%, 87%, 1);
    @include darkmode {
        border-bottom: 1px solid #21262d;
    }
  }
  mark {
    background-color: #fff8c5;
    color: #24292f;
    @include darkmode {
        background-color: rgba(187,128,9,0.15);
        color: #c9d1d9;
    }
  }
  small {
    font-size: 90%;
  }
  sub {
    bottom: -0.25em;
  }
  sup {
    top: -0.5em;
    & > a {
      &::before {
        content: "[";
      }
      &::after {
        content: "]";
      }
    }
  }
  img {
    border-style: none;
    max-width: 100%;
    box-sizing: content-box;
    background-color: #ffffff;
    @include darkmode {
        background-color: #0d1117;
    }
  }
  figure {
    margin: 1em 40px;
  }
  hr {
    box-sizing: content-box;
    overflow: hidden;
    background: transparent;
    border-bottom: 1px solid hsla(210, 18%, 87%, 1);
    @include darkmode {
        border-bottom: 1px solid #21262d;
    }
    height: 0.25em;
    padding: 0;
    margin: 1.5rem 0rem;
    background-color: #d0d7de;
    @include darkmode {
        background-color: #30363d;
    }
    border: 0;
    &::before {
      display: table;
      content: "";
    }
    &::after {
      display: table;
      clear: both;
      content: "";
    }
  }
  input {
    font: inherit;
    margin: 0;
    overflow: visible;
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
  }
  [type="search"] {
    -webkit-appearance: textfield;
    outline-offset: -2px;
  }
  ::-webkit-input-placeholder {
    color: inherit;
    opacity: 0.54;
  }
  ::-webkit-file-upload-button {
    -webkit-appearance: button;
    font: inherit;
  }
  table {
    border-spacing: 0;
    border-collapse: collapse;
    display: block;
    width: max-content;
    max-width: 100%;
    overflow: auto;
    th {
      font-weight: 600;
    }
    tr {
      background-color: #ffffff;
      border-top: 1px solid hsla(210, 18%, 87%, 1);
      @include darkmode {
        background-color: #0d1117;
        border-top: 1px solid #21262d;
      }
      &:nth-child(2n) {
        background-color: #f6f8fa;
        @include darkmode {
            background-color: #161b22;
        }
      }
    }
    img {
      background-color: transparent;
    }
  }
  details {
    summary {
      cursor: pointer;
    }
    &:not([open]) {
      & > *:not(summary) {
        display: none !important;
      }
    }
  }
  kbd {
    display: inline-block;
    padding: 3px 5px;
    font: 11px ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas,
      Liberation Mono, monospace;
    line-height: 10px;
    color: #24292f;
    @include darkmode {
        color: #c9d1d9;
    }
    vertical-align: middle;
    background-color: #f6f8fa;
    border: solid 1px rgba(175, 184, 193, 0.2);
    border-bottom-color: rgba(175, 184, 193, 0.2);
    @include darkmode {
        background-color: #161b22;
        border: solid 1px rgba(110,118,129,0.4);
        border-bottom-color: rgba(110,118,129,0.4);
    }
    border-radius: 6px;
    box-shadow: inset 0 -1px 0 rgba(175, 184, 193, 0.2);
    @include darkmode {
        box-shadow: inset 0 -1px 0 rgba(110,118,129,0.4);
    }
  }
  h2 {
    font-weight: 600;
    padding-bottom: 0.3em;
    font-size: 1.5em;
    border-bottom: 1px solid hsla(210, 18%, 87%, 1);
    @include darkmode {
        border-bottom: 1px solid #21262d;
    }
  }
  h3 {
    font-weight: 600;
    font-size: 1.25em;
  }
  h4 {
    font-weight: 600;
    font-size: 1em;
  }
  h5 {
    font-weight: 600;
    font-size: 0.875em;
  }
  h6 {
    font-weight: 600;
    font-size: 0.85em;
    color: #57606a;
    @include darkmode {
        color: #8b949e;
    }
  }
  p {
    margin-top: 0;
    margin-bottom: 0.625rem;
  }
  blockquote {
    margin: 0;
    padding: 0 1em;
    color: #57606a;
    border-left: 0.25em solid #d0d7de;
    @include darkmode {
        color: #8b949e;
        border-left: .25em solid #30363d;
    }
    & > :first-child {
      margin-top: 0;
    }
    & > :last-child {
      margin-bottom: 0;
    }
  }
  dd {
    margin-left: 0;
  }
  pre {
    margin-top: 0;
    margin-bottom: 0;
    font-family: ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas,
      Liberation Mono, monospace;
    font-size: .75rem;
    word-wrap: normal;
    code {
      font-size: 100%;
    }
    & > code {
      padding: 0;
      margin: 0;
      word-break: normal;
      white-space: pre;
      background: transparent;
      border: 0;
    }
  }
  ::placeholder {
    color: #6e7781;
    @include darkmode{
        color: #484f58;
    }
    opacity: 1;
  }
  .pl-c {
    color: #6e7781;
    @include darkmode {
        color: #8b949e;
    }
  }
  .pl-ent {
    color: #116329;
    @include darkmode {
        color: #7ee787;
    }
  }
  .pl-k {
    color: #cf222e;
    @include darkmode {
        color: #ff7b72;
    }
  }
  .pl-bu {
    color: #82071e;
    @include darkmode {
        color: #f85149;
    }
  }
  .pl-ii {
    color: #f6f8fa;
    background-color: #82071e;
    @include darkmode {
        color: #f0f6fc;
        background-color: #8e1519;
    }
  }
  .pl-c2 {
    color: #f6f8fa;
    background-color: #cf222e;
    @include darkmode {
        color: #f0f6fc;
        background-color: #b62324;
    }
  }
  .pl-sr {
    .pl-cce {
      font-weight: bold;
      color: #116329;
      @include darkmode {
        color: #7ee787;
      }
    }
  }
  .pl-ml {
    color: #3b2300;
    @include darkmode {
        color: #f2cc60;
    }
  }
  .pl-mi {
    font-style: italic;
    color: #24292f;
    @include darkmode {
        color: #c9d1d9;
    }
  }
  .pl-mb {
    font-weight: bold;
    color: #24292f;
    @include darkmode {
        color: #c9d1d9;
    }
  }
  .pl-md {
    color: #82071e;
    background-color: #ffebe9;
    @include darkmode {
        color: #ffdcd7;
        background-color: #67060c;
    }
  }
  .pl-mi1 {
    color: #116329;
    background-color: #dafbe1;
    @include darkmode {
        color: #aff5b4;
        background-color: #033a16;
    }
  }
  .pl-mc {
    color: #953800;
    background-color: #ffd8b5;
    @include darkmode {
        color: #ffdfb6;
        background-color: #5a1e02;
    }
  }
  .pl-mi2 {
    color: #eaeef2;
    background-color: #0550ae;
    @include darkmode {
        color: #c9d1d9;
        background-color: #1158c7;
    }
  }
  .pl-mdr {
    font-weight: bold;
    color: #8250df;
    @include darkmode {
        color: #d2a8ff;
    }
  }
  .pl-ba {
    color: #57606a;
    @include darkmode {
        color: #8b949e;
    }
  }
  .pl-sg {
    color: #8c959f;
    @include darkmode {
        color: #484f58;
    }
  }
  .pl-corl {
    text-decoration: underline;
    color: #0a3069;
    @include darkmode {
        color: #a5d6ff;
    }
  }
  [data-catalyst] {
    display: block;
  }
  g-emoji {
    font-family: "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-size: 1em;
    font-style: normal !important;
    font-weight: 400;
    line-height: 1;
    vertical-align: -0.075em;
    img {
      width: 1em;
      height: 1em;
    }
  }
  &::before {
    display: table;
    content: "";
  }
  &::after {
    display: table;
    clear: both;
    content: "";
  }
  & > *:first-child {
    margin-top: 0 !important;
  }
  & > *:last-child {
    margin-bottom: 0 !important;
  }
  .absent {
    color: #cf222e;
    @include darkmode {
        color: #f85149;
    }
  }
  .anchor {
    float: left;
    padding-right: 4px;
    margin-left: -20px;
    line-height: 1;
    &:focus {
      outline: none;
    }
  }
  ol[type="1"] {
    list-style-type: decimal;
  }
  ol[type="a"] {
    list-style-type: lower-alpha;
  }
  ol[type="i"] {
    list-style-type: lower-roman;
  }
  div {
    & > ol {
      &:not([type]) {
        list-style-type: decimal;
      }
    }
  }
  li {
    & > p {
      margin-top: 1rem;
    }
    & + li {
      margin-top: 0.25em;
    }
  }
  dl {
    padding: 0;
    dt {
      padding: 0;
      margin-top: 1rem;
      font-size: 1em;
      font-style: italic;
      font-weight: 600;
    }
    dd {
      padding: 0 1rem;
      margin-bottom: 1rem;
    }
  }
  img[align="right"] {
    padding-left: 1.25rem;
  }
  img[align="left"] {
    padding-right: 1.25rem;
  }
  .emoji {
    max-width: none;
    vertical-align: text-top;
    background-color: transparent;
  }
  span {
    &.frame {
      display: block;
      overflow: hidden;
      & > span {
        display: block;
        float: left;
        width: auto;
        padding: 7px;
        margin: 13px 0 0;
        overflow: hidden;
        border: 1px solid #d0d7de;
        @include darkmode {
            border: 1px solid #30363d;
        }
      }
      span {
        img {
          display: block;
          float: left;
        }
        span {
          display: block;
          padding: 5px 0 0;
          clear: both;
          color: #24292f;
          @include darkmode {
            color: #c9d1d9;
          }
        }
      }
    }
    &.align-center {
      display: block;
      overflow: hidden;
      clear: both;
      & > span {
        display: block;
        margin: 13px auto 0;
        overflow: hidden;
        text-align: center;
      }
      span {
        img {
          margin: 0 auto;
          text-align: center;
        }
      }
    }
    &.align-right {
      display: block;
      overflow: hidden;
      clear: both;
      & > span {
        display: block;
        margin: 13px 0 0;
        overflow: hidden;
        text-align: right;
      }
      span {
        img {
          margin: 0;
          text-align: right;
        }
      }
    }
    &.float-left {
      display: block;
      float: left;
      margin-right: 13px;
      overflow: hidden;
      span {
        margin: 13px 0 0;
      }
    }
    &.float-right {
      display: block;
      float: right;
      margin-left: 13px;
      overflow: hidden;
      & > span {
        display: block;
        margin: 13px auto 0;
        overflow: hidden;
        text-align: right;
      }
    }
  }
  del {
    code {
      text-decoration: inherit;
    }
  }
  .highlight {
    margin-bottom: 1rem;
    pre {
      margin-bottom: 0;
      word-break: normal;
    }
  }
  .csv-data {
    .blob-num {
      padding: 10px 8px 9px;
      text-align: right;
      background: #ffffff;
      @include darkmode {
        background: #0d1117;
      }
      border: 0;
    }
    tr {
      border-top: 0;
    }
    th {
      font-weight: 600;
      background: #f6f8fa;
      @include darkmode {
        background: #161b22;
      }
      border-top: 0;
    }
  }
  .footnotes {
    font-size: 0.75rem;
    color: #57606a;
    border-top: 1px solid #d0d7de;
    @include darkmode {
        color: #8b949e;
        border-top: 1px solid #30363d;
    }
    ol {
      padding-left: 1rem;
    }
    li {
      position: relative;
      &:target {
        color: #24292f;
        @include darkmode {
            color: #c9d1d9;
        }
        &::before {
          position: absolute;
          top: -8px;
          right: -8px;
          bottom: -8px;
          left: -24px;
          pointer-events: none;
          content: "";
          border: 2px solid #0969da;
          @include darkmode {
            border: 2px solid #1f6feb;
          }
          border-radius: 6px;
        }
      }
    }
    .data-footnote-backref {
      g-emoji {
        font-family: monospace;
      }
    }
  }
  .task-list-item {
    list-style-type: none;
    label {
      font-weight: 400;
    }
    &.enabled {
      label {
        cursor: pointer;
      }
    }
    & + .task-list-item {
      margin-top: 3px;
    }
    .handle {
      display: none;
    }
  }
  .task-list-item-checkbox {
    margin: 0 0.2em 0.25em -1.6em;
    vertical-align: middle;
  }
  .contains-task-list {
    &:dir(rtl) {
      .task-list-item-checkbox {
        margin: 0 -1.6em 0.25em 0.2em;
      }
    }
  }
  ::-webkit-calendar-picker-indicator {
    filter: invert(50%);
  }
}
.markdown h1:hover .anchor .octicon-link:before,
.markdown h2:hover .anchor .octicon-link:before,
.markdown h3:hover .anchor .octicon-link:before,
.markdown h4:hover .anchor .octicon-link:before,
.markdown h5:hover .anchor .octicon-link:before,
.markdown h6:hover .anchor .octicon-link:before {
  width: 1rem;
  height: 1rem;
  content: " ";
  display: inline-block;
  background-color: currentColor;
  -webkit-mask-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' version='1.1' aria-hidden='true'><path fill-rule='evenodd' d='M7.775 3.275a.75.75 0 001.06 1.06l1.25-1.25a2 2 0 112.83 2.83l-2.5 2.5a2 2 0 01-2.83 0 .75.75 0 00-1.06 1.06 3.5 3.5 0 004.95 0l2.5-2.5a3.5 3.5 0 00-4.95-4.95l-1.25 1.25zm-4.69 9.64a2 2 0 010-2.83l2.5-2.5a2 2 0 012.83 0 .75.75 0 001.06-1.06 3.5 3.5 0 00-4.95 0l-2.5 2.5a3.5 3.5 0 004.95 4.95l1.25-1.25a.75.75 0 00-1.06-1.06l-1.25 1.25a2 2 0 01-2.83 0z'></path></svg>");
  mask-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' version='1.1' aria-hidden='true'><path fill-rule='evenodd' d='M7.775 3.275a.75.75 0 001.06 1.06l1.25-1.25a2 2 0 112.83 2.83l-2.5 2.5a2 2 0 01-2.83 0 .75.75 0 00-1.06 1.06 3.5 3.5 0 004.95 0l2.5-2.5a3.5 3.5 0 00-4.95-4.95l-1.25 1.25zm-4.69 9.64a2 2 0 010-2.83l2.5-2.5a2 2 0 012.83 0 .75.75 0 001.06-1.06 3.5 3.5 0 00-4.95 0l-2.5 2.5a3.5 3.5 0 004.95 4.95l1.25-1.25a.75.75 0 00-1.06-1.06l-1.25 1.25a2 2 0 01-2.83 0z'></path></svg>");
}
.markdown details,
.markdown figcaption,
.markdown figure {
  display: block;
}
.markdown a:active,
.markdown a:hover {
  outline-width: 0;
}
.markdown b,
.markdown strong {
  font-weight: 600;
}
.markdown sub,
.markdown sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}
.markdown code,
.markdown kbd,
.markdown pre,
.markdown samp {
  font-family: monospace, monospace;
  font-size: 1em;
}
.markdown [type="button"],
.markdown [type="reset"],
.markdown [type="submit"] {
  -webkit-appearance: button;
}
.markdown [type="button"]::-moz-focus-inner,
.markdown [type="reset"]::-moz-focus-inner,
.markdown [type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}
.markdown [type="button"]:-moz-focusring,
.markdown [type="reset"]:-moz-focusring,
.markdown [type="submit"]:-moz-focusring {
  outline: 1px dotted ButtonText;
}
.markdown [type="checkbox"],
.markdown [type="radio"] {
  box-sizing: border-box;
  padding: 0;
}
.markdown [type="number"]::-webkit-inner-spin-button,
.markdown [type="number"]::-webkit-outer-spin-button {
  height: auto;
}
.markdown [type="search"]::-webkit-search-cancel-button,
.markdown [type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}
.markdown td,
.markdown th {
  padding: 0;
}
.markdown h1,
.markdown h2,
.markdown h3,
.markdown h4,
.markdown h5,
.markdown h6 {
  margin-top: 1.5rem;
  margin-bottom: 1rem;
  font-weight: 600;
  line-height: 1.25;
}
.markdown ul,
.markdown ol {
  margin-top: 0;
  margin-bottom: 0;
  padding-left: 2em;
}
.markdown ol ol,
.markdown ul ol {
  list-style-type: lower-roman;
}
.markdown ul ul ol,
.markdown ul ol ol,
.markdown ol ul ol,
.markdown ol ol ol {
  list-style-type: lower-alpha;
}
.markdown tt,
.markdown code {
  font-family: ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas,
    Liberation Mono, monospace;
  font-size: 0.75rem;
}
.markdown input::-webkit-outer-spin-button,
.markdown input::-webkit-inner-spin-button {
  margin: 0;
  -webkit-appearance: none;
  appearance: none;
}
.markdown .pl-c1,
.markdown .pl-s .pl-v {
  color: #0550ae;
  @include darkmode {
    color: #79c0ff;
  }
}
.markdown .pl-e,
.markdown .pl-en {
  color: #8250df;
  @include darkmode {
    color: #d2a8ff;
  }
}
.markdown .pl-smi,
.markdown .pl-s .pl-s1 {
  color: #24292f;
  @include darkmode {
    color: #c9d1d9;
  }
}
.markdown .pl-s,
.markdown .pl-pds,
.markdown .pl-s .pl-pse .pl-s1,
.markdown .pl-sr,
.markdown .pl-sr .pl-cce,
.markdown .pl-sr .pl-sre,
.markdown .pl-sr .pl-sra {
  color: #0a3069;
  @include darkmode {
    color: #a5d6ff;
  }
}
.markdown .pl-v,
.markdown .pl-smw {
  color: #953800;
  @include darkmode {
    color: #ffa657;
  }
}
.markdown .pl-mh,
.markdown .pl-mh .pl-en,
.markdown .pl-ms {
  font-weight: bold;
  color: #0550ae;
  @include darkmode {
    color: #1f6feb;
  }
}
.markdown p,
.markdown blockquote,
.markdown ul,
.markdown ol,
.markdown dl,
.markdown table,
.markdown pre,
.markdown details {
  margin-top: 0;
  margin-bottom: 1rem;
}
.markdown h1 .octicon-link,
.markdown h2 .octicon-link,
.markdown h3 .octicon-link,
.markdown h4 .octicon-link,
.markdown h5 .octicon-link,
.markdown h6 .octicon-link {
  color: #24292f;
  @include darkmode {
    color: #c9d1d9;
  }
  vertical-align: middle;
  visibility: hidden;
}
.markdown h1:hover .anchor,
.markdown h2:hover .anchor,
.markdown h3:hover .anchor,
.markdown h4:hover .anchor,
.markdown h5:hover .anchor,
.markdown h6:hover .anchor {
  text-decoration: none;
}
.markdown h1:hover .anchor .octicon-link,
.markdown h2:hover .anchor .octicon-link,
.markdown h3:hover .anchor .octicon-link,
.markdown h4:hover .anchor .octicon-link,
.markdown h5:hover .anchor .octicon-link,
.markdown h6:hover .anchor .octicon-link {
  visibility: visible;
}
.markdown h1 tt,
.markdown h1 code,
.markdown h2 tt,
.markdown h2 code,
.markdown h3 tt,
.markdown h3 code,
.markdown h4 tt,
.markdown h4 code,
.markdown h5 tt,
.markdown h5 code,
.markdown h6 tt,
.markdown h6 code {
  padding: 0 0.2em;
  font-size: inherit;
}
.markdown ul.no-list,
.markdown ol.no-list {
  padding: 0;
  list-style-type: none;
}
.markdown ul ul,
.markdown ul ol,
.markdown ol ol,
.markdown ol ul {
  margin-top: 0;
  margin-bottom: 0;
}
.markdown table th,
.markdown table td {
  padding: .375rem 0.875rem;
  border: 1px solid #d0d7de;
  @include darkmode {
    border: 1px solid #30363d;
  }
}
.markdown code,
.markdown tt {
  padding: 0.2em 0.4em;
  margin: 0;
  font-size: 85%;
  background-color: rgba(175, 184, 193, 0.2);
  @include darkmode {
    background-color: rgba(110,118,129,0.4);
  }
  border-radius: 6px;
}
.markdown code br,
.markdown tt br {
  display: none;
}
.markdown .highlight pre,
.markdown pre {
  padding: 1rem;
  overflow: auto;
  font-size: 85%;
  line-height: 1.45;
  background-color: #f6f8fa;
  @include darkmode {
    background-color: #161b22;
  }
  border-radius: 6px;
}
.markdown pre code,
.markdown pre tt {
  display: inline;
  max-width: auto;
  padding: 0;
  margin: 0;
  overflow: visible;
  line-height: inherit;
  word-wrap: normal;
  background-color: transparent;
  border: 0;
}
.markdown .csv-data td,
.markdown .csv-data th {
  padding: 5px;
  overflow: hidden;
  font-size: 0.75rem;
  line-height: 1;
  text-align: left;
  white-space: nowrap;
}