MediaWiki:Jotunnheim.css: Difference between revisions

From Project: Jotunnheim
Jump to navigation Jump to search
No edit summary
No edit summary
 
(9 intermediate revisions by the same user not shown)
Line 10: Line 10:
@font-face { font-family: JotunnheimNoto; src: url('/w/skins/Jotunnheim/fonts/NotoSerif-Variable.ttf') format('truetype'); font-style: normal; font-weight: 100 900; font-display: swap; }
@font-face { font-family: JotunnheimNoto; src: url('/w/skins/Jotunnheim/fonts/NotoSerif-Variable.ttf') format('truetype'); font-style: normal; font-weight: 100 900; font-display: swap; }
@font-face { font-family: JotunnheimNoto; src: url('/w/skins/Jotunnheim/fonts/NotoSerif-Italic-Variable.ttf') format('truetype'); font-style: italic; font-weight: 100 900; font-display: swap; }
@font-face { font-family: JotunnheimNoto; src: url('/w/skins/Jotunnheim/fonts/NotoSerif-Italic-Variable.ttf') format('truetype'); font-style: italic; font-weight: 100 900; font-display: swap; }
/* TODO: THIS SHOULD BE LICENSED!! */
@font-face {
  font-family: JotunnheimCheltenham;
  src: url('/w/skins/Jotunnheim/fonts/CheltenhamStdBook.woff2') format('woff2');
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: JotunnheimCheltenham;
  src: url('/w/skins/Jotunnheim/fonts/CheltenhamStdBold.woff2') format('woff2');
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}
@font-face {
  font-family: JotunnheimCheltenhamCondensed;
  src: url('/w/skins/Jotunnheim/fonts/CheltenhamStdBookCond.woff2') format('woff2');
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}
body.skin-jotunnheim {
body.skin-jotunnheim {
   --jth-page: #F3EEE2;
   --jth-page: #F3EEE2;
Line 62: Line 38:
     &.new {
     &.new {
       color: var(--jth-link-red);
       color: var(--jth-link-red);
      &::after { content: "†"; display: inline; }
     }
     }


Line 91: Line 68:
     display: flex;
     display: flex;
     flex-direction: column;
     flex-direction: column;
     width: 320px;
     flex: 0 0 180px;


     a {
     a {
      font-weight: 600;
      font-size: .9rem;
       display: inline-block;
       display: inline-block;
      padding: .125rem;
       width: 100%;
       width: 100%;
      font-size: .925rem;
     }
     }


Line 113: Line 88:
     color: var(--jth-fg);
     color: var(--jth-fg);
     font-weight: 500;
     font-weight: 500;
   
   }
   }


Line 123: Line 99:


       h3 {
       h3 {
         font-family: var(--jth-body;
         font-family: var(--jth-body);
         font-variant: small-caps;
         font-variant: small-caps;
         margin: 1.25rem 0 .325rem 0;
         margin: .25rem 0 0 .25rem;
         padding: 0;
         padding: 0;
         font-weight: 400;
         font-weight: 500;
         font-size: 1rem;
         font-size: 1rem;
        display: inline-flex;
        flex-direction: row;
        align-items: center;
        width: 100%;
        position: relative;
        &::after {
          display: inline-flex;
          content: "";
          position: relative; top: 2px;
  flex: 1;
  height: 0px;
  border-bottom: 1px solid var(--jth-fg);
  margin: 0 .25rem;
        }
       }
       }


Line 145: Line 136:
   main#content {
   main#content {
     background: var(--jth-page);
     background: var(--jth-page);
    padding: 1rem;
    h1#firstHeading {
      font-family: var(--jth-body);
      font-variant: small-caps;
    }
   }
   }


Line 160: Line 157:
   }
   }


}
.mw-body-content {
  h2, h3, h4, h5, h6 {
  }
}
}

Latest revision as of 18:10, 25 September 2026

/* Edit this page in the wiki at MediaWiki:Jotunnheim.css. This file is the initial import and rollback copy. */
/* Fonts are bundled with this skin. /w is this wiki's configured script path. */
@font-face { font-family: JotunnheimCharis; src: url('/w/skins/Jotunnheim/fonts/Charis-Regular.woff2') format('woff2'); font-style: normal; font-weight: 400; font-display: swap; }
@font-face { font-family: JotunnheimCharis; src: url('/w/skins/Jotunnheim/fonts/Charis-Italic.woff2') format('woff2'); font-style: italic; font-weight: 400; font-display: swap; }
@font-face { font-family: JotunnheimCharis; src: url('/w/skins/Jotunnheim/fonts/Charis-Bold.woff2') format('woff2'); font-style: normal; font-weight: 700; font-display: swap; }
@font-face { font-family: JotunnheimCharis; src: url('/w/skins/Jotunnheim/fonts/Charis-BoldItalic.woff2') format('woff2'); font-style: italic; font-weight: 700; font-display: swap; }
@font-face { font-family: JotunnheimOldStandard; src: url('/w/skins/Jotunnheim/fonts/OldStandard-Regular.ttf') format('truetype'); font-style: normal; font-weight: 400; font-display: swap; }
@font-face { font-family: JotunnheimOldStandard; src: url('/w/skins/Jotunnheim/fonts/OldStandard-Bold.ttf') format('truetype'); font-style: normal; font-weight: 700; font-display: swap; }
@font-face { font-family: JotunnheimGoudy; src: url('/w/skins/Jotunnheim/fonts/GoudyBookletter1911.ttf') format('truetype'); font-style: normal; font-weight: 400; font-display: swap; }
@font-face { font-family: JotunnheimNoto; src: url('/w/skins/Jotunnheim/fonts/NotoSerif-Variable.ttf') format('truetype'); font-style: normal; font-weight: 100 900; font-display: swap; }
@font-face { font-family: JotunnheimNoto; src: url('/w/skins/Jotunnheim/fonts/NotoSerif-Italic-Variable.ttf') format('truetype'); font-style: italic; font-weight: 100 900; font-display: swap; }
body.skin-jotunnheim {
  --jth-page: #F3EEE2;
  --jth-fg: #0E0C06;
  --jth-page-1: #E0D6B8;

  --jth-link-normal: #3D314A;
  --jth-link-red: #96705B;
  --jth-link-visited: #684756;

  --jth-ink: #27231e;
  --jth-muted: #665e52;
  --jth-rule: #c7bdac;
  --jth-link: #734533;


  --jth-body: JotunnheimCharis, Charis, 'Charis SIL', JotunnheimNoto, 'Noto Serif', Georgia, serif;
  --jth-title: JotunnheimOldStandard, 'Old Standard TT', JotunnheimCharis, Georgia, serif;
  --jth-heading: JotunnheimGoudy, 'Goudy Bookletter 1911', JotunnheimCharis, Georgia, serif;
  margin: 0;
  color: var(--jth-fg);
  background: var(--jth-page-1);
  font-family: var(--jth-body);

  a, a:visited {
    color: var(--jth-link-normal);
    
    &.new {
      color: var(--jth-link-red);
      &::after { content: "†"; display: inline; }
    }

  }
}

.jth-skip {
  background: white;
  color: blue;
  padding: 1rem;
  display: block;

  position: absolute;
  left: -100vw;
  top: 0;

  &:focus {
    left: 0;
  }
}

.jth-shell {
  display: flex;
  flex-direction: row;



  .jth-nav {
    display: flex;
    flex-direction: column;
    flex: 0 0 180px;

    a {
      display: inline-block;
      width: 100%;
      font-size: .925rem;
    }

      a.jth-brand {
    display: flex;
    flex-direction: column;
    gap: .5rem;
    margin: 1rem 0;
    align-items: center;
    text-align: center;
    font-family: JotunnheimCheltenhamCondensed, var(--jth-title);
    font-size: 1.5rem;
    letter-spacing: -0.02em;
    color: var(--jth-fg);
    font-weight: 500;
    
  }

    input[type="checkbox"] { display: none; }

    #p-user-page-label { content: "User"; }

    .mw-portlet {
      padding: 0 0.25rem;

      h3 {
        font-family: var(--jth-body);
        font-variant: small-caps;
        margin: .25rem 0 0 .25rem;
        padding: 0;
        font-weight: 500;
        font-size: 1rem;
        display: inline-flex;
        flex-direction: row;
        align-items: center;
        width: 100%;
        position: relative;

        &::after {
          display: inline-flex;
          content: "";
          position: relative; top: 2px;
  flex: 1;
  height: 0px;
  border-bottom: 1px solid var(--jth-fg);
  margin: 0 .25rem;
        }
      }

      ul {
        margin: 0 0 0 1rem;
        list-style: none;
      }
    }
  }

  .jth-header {
    display: flex;
    flex-direction: row;
  }

  main#content {
    background: var(--jth-page);
    padding: 1rem;

    h1#firstHeading {
      font-family: var(--jth-body);
      font-variant: small-caps;
    }
  }

  footer.mw-footer, footer.mw-footer ul {
    display: flex;
    flex-direction: row;
    list-style: none;
    margin: 0;
    align-items: center;
    gap: 1rem;
  }

  footer.mw-footer {
    margin: 1rem 0;
  }

}

.mw-body-content {
  h2, h3, h4, h5, h6 {
  }
}