DjeexLab/site/stylesheets/extra.css

/* theme color */
:root > * {
    --md-code-hl-string-color: #a5d6ff;
    --md-code-hl-keyword-color: #7ee787;
    --md-code-hl-name-color: #c992ff;
    --md-code-hl-operator-color: #ffe400;
    --md-code-hl-punctuation-color: #ffffff;
    --md-code-hl-comment-color: #8b949e;
    --md-code-hl-generic-color: #ffc400;
    --md-code-hl-variable-color: #ffa656;
    --md-code-hl-constant-color: #ffda56;
    --md-default-bg-color: #0b0e14;
    --md-code-bg-color:#171924;
  }

 /* header title */ 
.md-header__title {
  font-family:'VT323', monospace;
  font-size: 32px;

}

.md-header__topic:first-child {
  font-weight:400;
}

/* replacing logo while keeping the one in mkdocs.yaml for social cards */
.md-header__button.md-logo {
  margin: .2rem;
  padding: .4rem;
  width: 30px;
  height: 30px;
  background-image: url(/img/logo/book_pixel.svg);
  background-repeat: no-repeat;
  background-position: center;
}
.md-header__button.md-logo img {
  display: none;
}

/* link decoration */
.md-nav__item .md-nav__link--active, .md-nav__item .md-nav__link--active code {
    color: #ffc105;
}

.md-typeset a {
  color: #ffc105;
}

/* code decoration */
.md-typeset code {
  border-radius: 15px;
  padding: 0.01em 0.5em 0.10em 0.5em;
  border: 2px solid #393939;
}
.highlighttable tbody {

  border: 2px solid #393939;
  border-radius: 15px;
}

.highlighttable .linenos {
  border-bottom-left-radius: 12px;
  border-top-left-radius: 12px;
  z-index: -1;
}

.md-typeset .md-code__content {
  border-radius: 12px;
  border: none;
  z-index: -1;
}

/* table decoration */
.md-typeset table:not([class]) {
  border-radius: 15px;
  background-color: #0f131b;
  border: .05rem solid hsl(225deg 100% 77.28% / 12%);
}

/* cards decoration */
.md-typeset .grid.cards>ol>li, .md-typeset .grid.cards>ul>li, .md-typeset .grid>.card {
  border-radius: 15px;
  background-color: #0e131c;
  border: .05rem solid hsl(225deg 100% 77.28% / 12%);
}

/* admonition decoration */
.md-typeset .admonition, .md-typeset details {
  border-radius: 15px;
  background-color: #0e131c;
  
}
.md-typeset .admonition-title {
  border-top-right-radius: 15px;
  border-top-left-radius: 15px;
}

.md-typeset .admonition-title {
  border-top-right-radius: 14px !important;
  border-top-left-radius: 14px !important;
}

/* img decoration */
.md-content img {
  border-radius: 15px;
}

/* footer decoration */
.md-footer-meta {
  background-color: #0b1329;
}

.md-copyright__highlight {
  color: #ffc105;
}

.md-social__link svg {
  fill: #ffc105;
}

/* nav and title decoration */

.md-header, .md-nav__title {
    background-color: #0b1329;
}

.md-typeset h1 {
  color: #b8b8b8;
}

.md-nav__item--section, .md-nav__title {
  font-size:20px;
}

/* mobile nav decoration */
@media screen and (max-width: 76.234375em) {
  .md-nav--primary .md-nav__title[for=__drawer] {
      background-color: #0b1329;
      ;
  }
}

/* mobile search decoration */
@media screen and (min-width: 60em) {
  .md-search__form {
      background-color: #7e7e7e3d;
      border-radius: 50px;    
  }
}

/* mobile code decoration */
@media screen and (max-width: 44.984375em) {
  .md-content__inner>.highlight {
      margin: 0;
  }
  .highlighttable .linenos {
    border-bottom-left-radius: 15px !important;
    border-top-left-radius: 15px !important;
  }
  .md-typeset .md-code__content {
    border-radius: 15px !important;
    border-bottom-left-radius: 0px !important;
    border-top-left-radius: 0px !important;

  }
}

/* card VT323 */
/*.vt323>ul>li>:first-child {
  font-family: 'VT323';
  font-size: 22px;
  color:#e2e2e2;
}

.vt323>ul>li>:first-child span {
  font-size: 18px;
}

.md-typeset .vt323  {
  font-size: 18px;
}
*/
/* icons and logo decoration */
.debian {
  color: rgb(246, 56, 123);
}

.docker {
  color: rgb(41, 194, 243);
}

.dockge {
  color: rgb(107, 192, 255);
}

.swag {
  color: rgb(221, 75, 147);
}

.wireguard {
  color: rgb(232, 116, 119);
}

.gold {
  color: #ffc105;
}

.cloudflare {
  color: rgb(245, 139, 50);
}

.uptime-kuma {
  color: rgb(99, 222, 144);
}

.dozzle {
  color: rgb(255, 134, 26);
}

.plex {
  color: rgb(243, 180, 46);
}

.qbit {
  color: rgb(93, 198, 152);
}

.nextcloud {
  color: rgb(93, 199, 255);
}

.immich {
  color: rgb(236, 116, 178);
}

.vscode {
  color: rgb(52, 174, 237);
}

.gitea {
  color: rgb(144, 213, 73);
}

.adguard {
  color: rgb(134, 185, 146);
}

.filebrowser {
  color: rgb(252, 215, 70);
}

.it-tools {
  color: rgb(132, 235, 182);
}

.bitwarden {
  color: rgb(77, 157, 237);
}

/* fonts */

/* vietnamese */
@font-face {
  font-family: 'VT323';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/vt323/v17/pxiKyp0ihIEF2isQFJXGdg.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'VT323';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/vt323/v17/pxiKyp0ihIEF2isRFJXGdg.woff2) format('woff2');
  unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'VT323';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/vt323/v17/pxiKyp0ihIEF2isfFJU.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Virgil';
  src: url('/fonts/Virgil.woff2') format('woff2');
}