Main Page/styles.css: Difference between revisions

    From Longevity Wiki
    (Created page with "ol.breadcrumb-nav-container, ul.breadcrumb-nav-container { list-style-image: none; list-style-position: outside; list-style-type: none; margin:...")
    (No difference)

    Revision as of 03:39, 10 November 2023

    ol.breadcrumb-nav-container, ul.breadcrumb-nav-container {

      list-style-image:    none;
      list-style-position: outside;
      list-style-type:     none;
      margin:              0.2em 0;
      padding-left:        0;
    

    } ol.breadcrumb-nav-container > li, ul.breadcrumb-nav-container > li {

      display:      inline;
      margin-right: 1.5em;
      padding:      0;
    

    } ol.breadcrumb-nav-midsep > li, ul.breadcrumb-nav-midsep > li, ol.breadcrumb-nav-pipe > li, ul.breadcrumb-nav-pipe > li {

      margin-right: 0;
    

    } ol.breadcrumb-nav-midsep > li::after, ul.breadcrumb-nav-midsep > li::after, ol.breadcrumb-nav-pipe > li::after, ul.breadcrumb-nav-pipe > li::after {

      margin-left:  0.2em;
      margin-right: 0.2em;
    

    } ol.breadcrumb-nav-midsep > li::after, ul.breadcrumb-nav-midsep > li::after {

      content: "\A0\25AA";
    

    } ol.breadcrumb-nav-pipe > li::after, ul.breadcrumb-nav-pipe > li::after {

      content: "\A0|";
    

    } ol.breadcrumb-nav-midsep > li:last-child::after, ul.breadcrumb-nav-midsep > li:last-child::after, ol.breadcrumb-nav-pipe > li:last-child::after, ul.breadcrumb-nav-pipe > li:last-child::after {

      display: none;
    

    } ul + ul.breadcrumb-nav-container, div + ul.breadcrumb-nav-container {

      margin-top: 0.5em;
    

    } .center .breadcrumb-nav-container {

      margin-left:  auto;
      margin-right: auto;
      text-align:   center;
    

    } .center .breadcrumb-nav-container > li {

      margin-left:  0.75em;
      margin-right: 0.75em;
    

    }

    1. mainpage-toc,

    .mainpage-upward {

      display: none;
    

    } .mainpage-box {

      display:      table;
      margin-left:  auto;
      margin-right: auto;
      margin-top:   1em;
    

    }

    1. willkommen p:first-child {
      margin-top: 0;
    

    } .mainpage-box-title {

      font-family: inherit;
      font-size:   1em;
      font-weight: bold;
      line-height: 1.5;
    

    } .mainpage-preview-wikidata {

      color: #444444;
    

    }

    @media only screen {

      /* klassischer Desktop, zweispaltig; Grundstruktur */
      #spalten {
         overflow:       auto;
         padding-bottom: 1px;
      }
      #links,
      #rechts {
         float: left;
         width: calc(50% - 0.5em - 0.005px);
      }
      #links {
         margin-right: 1em;
      }
      #links .mainpage-box {
         margin-left: 0;
      }
      #unten {
         clear: both;
      }
      .mainpage-portale a,
      #schwesterprojekte a {
         font-weight: bold;
      }
      .mainpage-box {
         width: 100%;
      }
      .mainpage-box-content,
      .mainpage-box-title {
         border: #8898BF thin solid;
      }
      .mainpage-box-title {
         background-color: #D8E8FF;
         margin-bottom:    0;
         margin-top:       0;
         padding:          0.2em 0.8em;
      }
      .mainpage-box-content,
      .mainpage-preview-wikidata {
         background-color: #FFFFFF;
         border-top: none;
         overflow:  auto;
         padding:   0.3em 0.8em 0.3em;
      }
      .mainpage-mehr {
         font-size:  90%;
         margin: 0.5em 0 0.2em 0;
         text-align: right;
      }
      .mainpage-audiodesc {
         font-family: monospace;
      }
      .mainpage-item {
         white-space: nowrap;
      }
      .mainpage-item-long {
         white-space: normal;
      }
      #oben  .mainpage-box-title,
      #unten .mainpage-box-title, 
      .mainpage-wikipedia-aktuell {
         text-align: center;
      }
    

    } @media only screen and (max-width: 54rem) {

      /* Platzmangel */
      #links,
      #rechts {
         float:        none;
         margin-right: 0;
         width:        auto;
      }
      .mainpage-box {
         width: 99%;
      }
      .mainpage-box-content,
      .mainpage-preview-wikidata {
         border-bottom: none;
         border-left:   none;
         border-right:  none;
         padding:       0.5em 0;
      }
      ul:not(.breadcrumb-nav-container) li:not(.mainpage-item) {
         margin-left: 0.5em;
      }
      .mainpage-details,
      .breadcrumb-nav-container > li.mainpage-details {
         display: none;
      }
      #mainpage-toc {
         display:       block;
         font-size:     92%;
         line-height:   1.4em;
         margin-bottom: 1em;
      }
      .mainpage-upward {
         display:     block;
         float:       right;
         margin-left: 2em;
      }
      #oben  .mainpage-box-title,
      #unten .mainpage-box-title,
      #willkommen p:first-child,
      .mainpage-wikipedia-aktuell {
         text-align: left;
      }
    

    } @media only screen and (max-width: 42rem) {

      /* Besonders kleiner Screen */
      #mainpage-toc {
         display: none;
      }
      #oben .mainpage-upward {
         display: none;
      }
    

    } @media only screen and (min-width: 180rem) {

      /* Mehr als zweispaltig; 121rem */
      #links {
         float:        none;
         margin-right: 0;
         width:        auto;
      }
      #links-oben,
      #links-unten {
         float: left;
      }
      #oben  .mainpage-box,
      #unten .mainpage-box {
         max-width: none;
         width:     auto;
      }
    

    } @media only screen and (min-width: 99999rem) {

      /* Dreispaltig */
      #links-oben,
      #links-unten {
         margin-right: 3%;
         width:        28%;
      }
      #rechts {
         width: 38%;
      }
    

    } @media only screen and (min-width: 180rem) {

      /* Vierspaltig */
      #rechts {
         float: none;
         width: auto;
      }
      #links-oben,
      #links-unten,
      #rechts-oben,
      #rechts-unten {
         width: 23%;
      }
      #links-oben,
      #links-unten,
      #rechts-oben,
      #rechts-unten {
         margin-left:  1%;
         margin-right: 1%;
      }
      #rechts-oben,
      #rechts-unten {
         float: left;
      }
    

    } @media only screen and (min-width: 260rem) {

      /* Fünfspaltig */
      #rechts-unten {
         float: none;
         width: auto;
      }
      #links-oben,
      #links-unten,
      #rechts-oben,
      #rechts-unten-1,
      #rechts-unten-2 {
         margin-left:  1%;
         margin-right: 1%;
         width: 18%;
      }
      #rechts-unten-1,
      #rechts-unten-2 {
         float: left;
      }
      #rechts-unten-2 {
         margin-right: 0;
      }
      .mainpage-box {
         max-width: 75em;
      }
      #unten .mainpage-box {
         max-width: none;
      }
    

    } @media print {

      .mainpage-portale,
      #intern,
      #schwesterprojekte,
      .mainpage-mehr {
         display: none;
      }
      .mainpage-box {
         margin-left: 10%;
         max-width:   70em;
         width:       80%;
      }
    

    }