Entropia:Sandkasten:GPN16 test:Stylesheet: Unterschied zwischen den Versionen

aus dem Wiki des Entropia e.V., CCC Karlsruhe
Keine Bearbeitungszusammenfassung
Keine Bearbeitungszusammenfassung
 
(112 dazwischenliegende Versionen von 2 Benutzern werden nicht angezeigt)
Zeile 1: Zeile 1:
  /*
/*
     * GPN16 Stylesheet
     * GPN16 Stylesheet
     *
     *
     * https://github.com/entropia/gpn16-design/wiki/
     * https://github.com/entropia/gpn16-design/wiki/
     */
     */
 
 
  /*
  * Screen only
  */
  @media screen {
/* site logo */
div#p-logo.portlet a,
div#p-logo.portlet a:hover {
  background-image: url("https://entropia.de/images/0/0a/Gpn16-wikilogo.svg.png") !important;
  display: block;
  height: 110px;
  width: 160px;
  /* logo abstand so anpassen dass es in seinem bereich "zentriert wirkt". kommt aufs logo an. */
  margin-left: 1em;
  margin-top: 1.5em;
}
div#column-one div a img {
  display: none;
}
div.editOptions {
  color: #000000;
}
/* edit/history/... buttons */
#p-cactions li a:hover {
  background-color: hsla(200, 100%, 60%, 0.5);
}
/* misc */
  @font-face {
  @font-face {
   font-family: "LiberationSans-Regular";
   font-family: "LiberationSans-Regular";
   src: url("https://entropia.de/images/4/4a/LiberationSans-Regular.ttf");
   src: url("/images/4/4a/LiberationSans-Regular.ttf") format("truetype");
  }
  }
  @font-face {
  @font-face {
   font-family: "LiberationSans-Bold";
   font-family: "LiberationSans-Bold";
   src: url("https://entropia.de/images/a/a3/LiberationSans-Bold.ttf");
   src: url("/images/a/a3/LiberationSans-Bold.ttf") format("truetype");
  }
  }
  @font-face {
  @font-face {
   font-family: "LiberationSans-Italic";
   font-family: "LiberationSans-Italic";
   src: url("https://entropia.de/images/d/d9/LiberationSans-Italic.ttf");
   src: url("/images/d/d9/LiberationSans-Italic.ttf") format("truetype");
  }
  }
  @font-face {
  @font-face {
   font-family: "LiberationSans-BoldItalic";
   font-family: "LiberationSans-BoldItalic";
   src: url("https://entropia.de/images/a/a0/LiberationSans-BoldItalic.ttf");
   src: url("/images/a/a0/LiberationSans-BoldItalic.ttf") format("truetype");
}
h1.firstHeading {
    border: 0pt none;
    color: white;
    font-size: 175%;
    font-family: LiberationSans-Bold, "Open Sans", "Arial", sans-serif;
    letter-spacing: -1px;
    margin-bottom: 0pt;
    padding: 0.3em 0pt 0.3em;
    text-decoration: none;
}
#bodyContent {
  color: white;
  background: hsla(201, 100%, 28%, 0.5);
}
body {
    background-image: url('https://entropia.de/images/a/a9/GPN16_Raster.png');
    background-repeat: repeat;
    color: white;
    font-family: LiberationSans-Regular, "Open Sans", "Arial", sans-serif;
}
#column-content {
    background-image: url('https://entropia.de/images/a/a9/GPN16_Raster.png');
    background-repeat: repeat;
    color: white;
}
#content {
    background: hsla(201, 100%, 28%, 0.75) none repeat scroll 0 0;
    margin-right: 80px;
}
li, ul {
  list-style-image: none;
}
#p-navigation {
    background: none;
    color: white;
}
#p-navigation a {
    color: white;
}
#p-logo {
    background: none;
}
.pBody {
    background: none;
    color: white;
}
#p-personal li a {
    color: white;
    padding:
}
#p-fnord a, #p-tb a {
    color: white;
}
h1, h2, h3, h4, h5, h6 {
    color: white;
    font-family: LiberationSans-Bold, "Open Sans", "Arial", sans-serif;
    border-bottom-color: white;
}
h1 {
    border-bottom: 2px dashed white;
}
body {
    color: white;
}
a, a:visited, a:active, a:link, #bodyContent a.external {
    color: #ffffff;
}
#toc {
    background: none;
    border: 2px solid white;
    margin-top: 35px;
  }
  }
 
#p-navigation ul li, #p-tb ul li {
  /*
     border: none;
  * === Decorations (Header, Logo, Sidebar, Footer, and everything in them) ===
}
  */
#p-cactions li a, #p-cactions li, #p-cactions li.selected a {
  div#p-logo.portlet a,
     background: none;
  div#p-logo.portlet a:hover {
     color: white;
     background-image: url("/gulasch/imgs/wikilogo.png") !important;
}
    display: block;
#p-fnord ul li {
    height: 110px;
    width: 160px;
  }
  div#column-one div a img {
    display: none;
  }
  div#p-logo.portlet {
    background-image: url("/gulasch/imgs/topbar.png") !important;
    background-repeat: repeat-x;
    background-color: transparent;
  }
  /*
  // Sidebar
  #column-content
    background-color sidebarBgColor
  */
  .pBody {
    background-color: transparent;
  }
  #p-navigation a,
  #p-portlet2 a,
  #p-portlet3 a,
  #p-search a,
  #p-tb a,
  #p-fnord a {
    color: #000;
  }
  #searchInput {
    color: #000;
     background-color: #bed7e6;
    outline: none;
    border: 1px solid #91bbd4;
    padding: 2px 2px;
  }
  #searchform input[name="go"],
  #searchform input[name="fulltext"] {
    outline: 0;
     color: #000;
    background-color: #c4dbe9;
    border: 1px solid #91bbd4;
  }
  #searchform {
    margin-bottom: 8px;
  }
  #p-search {
    margin: 0;
  }
  div#footer,
  body,
  div#globalWrapper {
    background-color: #bed7e6;
  }
  div#footer {
    border-top: none;
     border-bottom: none;
     border-bottom: none;
  }
}
  #footer li {
#p-cactions li a {
     color: #b8e3ef;
     font-size: 125%
    margin: 0.2em !important;
}
  }
#footer, div#footer {
  div#footer li a,
    background: none;
  div#footer li a:link,
    border: none;
  div#footer li a:active,
}
  div#footer li a:visited {
div.NavHead {
     color: #639fc3;
     background: none;
  }
}
  div#footer li[id="viewcount"]:after {
div.NavFrame {
     content: " ";
     border: 2px solid white;
    display: block;
}
  }
div.thumbinner {
  #column-one {
     background-color: rgba(35, 150, 214, 0.4);
    background: #bed7e6;
     border: none;
     background-image: url("/gulasch/imgs/sidebar.png");
}
     background-position: 0px 0px;
html .thumbimage {
     background-repeat: no-repeat;
     border: none;
  }
}
  #p-navigation ul li,
h1 {
  #p-portlet2 ul li,
    border-bottom: 2px solid rgb(255, 255, 255);
  #p-portlet3 ul li,
}
  #p-search ul li,
#p-cactions .new a {
  #p-tb ul li,
    color: #d0d0d0;
  #p-fnord ul li {
}
     border-bottom: 1px solid #639fc3;
#bodyContent a.new {
  }
     color: #FF8A8A;
  /*
}
  * === Content box (and tabs) ===
div#catlinks {
  */
    background: none;
  li#ca-nstab-main,
    border: none;
  li#ca-nstab-main ~ li {
    border-top: 2px solid white;
}
pre {
     background: none;
     background: none;
  }
  #p-cactions ul li a,
  #p-cactions ul li a:link,
  #p-cactions ul li a:active,
  #p-cactions ul li a:visited,
  #p-cactions ul li a:hover,
  color black {
    background-color: #c4dbe9;
    border: 1px solid #91bbd4;
  }
  #p-cactions ul li a:hover {
    background-color: #cbdfeb;
  }
  #p-cactions ul li a:active {
    background-color: #d2e3ee;
  }
  /*
  * === Content box ===
  */
  .mw-body-primary {
    border: none !important;
    border-left: 1px solid #639fc3 !important;
  }
  div#content /* background of everything below header,
  incl. sidebar */ {
    background-color: #bed7e6;
  /* empty space between header/navbar/footer and content box */
    color: #000;
  /* main text color */
    padding-right: 0;
  /* content box meets right screen border */
  }
  div#content h1#firstHeading {
    background-color: #e1ebf1;
    border-left: 1px solid #cbdfeb;
    border-top: 1px solid #cbdfeb;
  /* Bottom joins div#bodyContent*/
    padding: 0.3em 0.3em 0;
    margin-bottom: 0;
  }
  div#bodyContent {
    background-color: #e1ebf1;
    border-left: 1px solid #cbdfeb;
  /* Top joins h1#firstHeading */
    margin-top: 0;
  }
  /*
  * Content
  */
  h1,
  h2 {
    font-family: YanoneKaffeesatz-Regular, sans-serif;
  }
  h1#firstHeading {
    font-size: 22pt;
    font-family: YanoneKaffeesatz-Light, sans-serif;
  }
  h2 {
    font-size: 18pt;
  }
  /* Table of contents */
  #toc,
  .toc,
  .mw-warning {
    background-color: rgba(255,255,255,0);
  }
  /* Code blocks */
  div#mw-content-text pre {
    background-color: rgba(255,255,255,0.25);
    overflow: auto;
  /* "GPN15: Anfahrt": adress pre would overflow onto floating image. auto => offer scrollbar instead. */
  }
  /* Thumbnails */
  html .thumbimage {
     border: none;
     border: none;
    color: white;
}
table.wikitable {
    background: none;
    margin: 1em 0;
    border: 1px solid white;
    border-collapse: collapse;
    color: white;
}
table.diff {
    background-color: #ffffff;
    color: #000000;
}
table.wikitable > tr > th, table.wikitable > tr > td, table.wikitable > * > tr > th, table.wikitable > * > tr > td {
    border: 1px solid white;
    padding: 0.2em 0.4em;
    background: none;
}
tbody {
    border-color: white;
}
  @-webkit-keyframes fadeIcon {
    0%  { opacity:0;}
    40%  { opacity:0;}
    50%  { opacity:1;}
    60%  { opacity:0;}
    100% { opacity:0;}
   }
   }
   /* Linkbox am Artikelende */
   @-moz-keyframes fadeIcon {
  div.NavHead,
    0%   { opacity:0;}
   .catlinks {
    40%  { opacity:0;}
    background-color: rgba(255,255,255,0);
    50%  { opacity:1;}
  }
     60% { opacity:0;}
  /* Bullet point lists */
    100% { opacity:0;}
  div#content ul {
    list-style: none;
  }
  div#content ul li {
    text-indent: -1em;
  }
  div#content ul li:before /* hack to change color of bullet point */ {
     content: "\25fe ";
    color: #1a6175;
  }
  li.gallerybox,
  li.toclevel-1,
  li.toclevel-2,
  li.toclevel-3,
  li.toclevel-4,
  li.toclevel-5,
  li.toclevel-6,
  div.mw-normal-catlinks li /* revert these changes for the toc and category link box */ {
    text-indent: 0 !important;
   }
   }
   li.gallerybox:before,
   @keyframes fadeIcon {
   li.toclevel-1:before,
    0%   { opacity:0;}
  li.toclevel-2:before,
    40%  { opacity:0;}
  li.toclevel-3:before,
    50%  { opacity:1;}
  li.toclevel-4:before,
    60%  { opacity:0;}
  li.toclevel-5:before,
    100% { opacity:0;}
  li.toclevel-6:before,
  div.mw-normal-catlinks li:before /* revert these changes for the toc and category link box */ {
    content: none !important;
   }
   }
   /*
    
  * Links
  div.NavFrame div.NavPic div.icon {
  */
  -webkit-animation:fadeIcon linear infinite;
   div#content a,
   -moz-animation:fadeIcon linear infinite;
   div#content a:link,
   animation:fadeIcon linear infinite;
   div#content a:active {
 
    text-decoration: underline;
   -webkit-animation-duration:4s;
    color: #207a92;
  -moz-animation-duration:4s;
  animation-duration:4s;
   }
   }
   div#content a:visited {
    
     text-decoration: underline;
  div.NavFrame div.NavPic div.icon:nth-child(1n+0) {
     color: #175769;
     -webkit-animation-delay: 0s;
     animation-delay: 0s;
    background: url('/images/1/10/GPN16-Logo1_smal.svg') no-repeat left top;
   }
   }
   div#content a:new {
   div.NavFrame div.NavPic div.icon:nth-child(2n+0) {
     text-decoration: underline;
     -webkit-animation-delay: 1s;
     color: #cb4d4d;
    animation-delay: 1s;
     background: url('/images/b/ba/GPN16-Logo2_smal.svg') no-repeat left top;
   }
   }
   div#content a:hover {
   div.NavFrame div.NavPic div.icon:nth-child(3n+0) {
     text-decoration: none;
     -webkit-animation-delay: 2s;
    animation-delay: 2s;
    background: url('/images/2/2c/GPN16-Logo3_smal.svg') no-repeat left top;
   }
   }
   div#mw-content-text pre a,
   div.NavFrame div.NavPic div.icon:nth-child(4n+0) {
  div#mw-content-text pre a:link,
    -webkit-animation-delay: 3s;
  div#mw-content-text pre a:active,
    animation-delay: 3s;
  div#mw-content-text pre a:visited {
     background: url('/images/e/ef/GPN16-Logo4_smal.svg') no-repeat left top;
     color: #101010;
   }
   }
   div#content table.highlight {
    
    background-color: #f1f3f4;
  div.NavFrame div.NavPic {
    border: solid 1px #99b3ff;
        height: 80px;
    margin: 1em;
        width: 80px;
    margin-top: 2em;
    padding: 0.3em 1em;
    font-size: 150%;
   }
   }
   div#content td.highlight {
   div.NavFrame div.NavPic div.icon {
    padding-right: 1.5em;
        position: absolute;
        opacity: 0;
        height: 80px;
        width: 80px;
        background-size: 100% auto;
   }
   }
  a.new {
    text-decoration: underline !important;
    color: #e05252 !important;
   }
   }

Aktuelle Version vom 23. Mai 2016, 14:27 Uhr

/*
   * GPN16 Stylesheet
   *
   * https://github.com/entropia/gpn16-design/wiki/
   */
 
 /*
  * Screen only
  */
 @media screen {
/* site logo */
div#p-logo.portlet a,
div#p-logo.portlet a:hover {
  background-image: url("https://entropia.de/images/0/0a/Gpn16-wikilogo.svg.png") !important;
  display: block;
  height: 110px;
  width: 160px;
  /* logo abstand so anpassen dass es in seinem bereich "zentriert wirkt". kommt aufs logo an. */
  margin-left: 1em;
  margin-top: 1.5em;
}
div#column-one div a img {
  display: none;
}
div.editOptions {
 color: #000000;
}
/* edit/history/... buttons */
#p-cactions li a:hover {
  background-color: hsla(200, 100%, 60%, 0.5);
}
/* misc */
@font-face {
  font-family: "LiberationSans-Regular";
  src: url("/images/4/4a/LiberationSans-Regular.ttf") format("truetype");
}
@font-face {
  font-family: "LiberationSans-Bold";
  src: url("/images/a/a3/LiberationSans-Bold.ttf") format("truetype");
}
@font-face {
  font-family: "LiberationSans-Italic";
  src: url("/images/d/d9/LiberationSans-Italic.ttf") format("truetype");
}
@font-face {
  font-family: "LiberationSans-BoldItalic";
  src: url("/images/a/a0/LiberationSans-BoldItalic.ttf") format("truetype");
}
h1.firstHeading {
   border: 0pt none;
   color: white;
   font-size: 175%;
   font-family: LiberationSans-Bold, "Open Sans", "Arial", sans-serif;
   letter-spacing: -1px;
   margin-bottom: 0pt;
   padding: 0.3em 0pt 0.3em;
   text-decoration: none;
}
#bodyContent {
 color: white;
 background: hsla(201, 100%, 28%, 0.5);
}
body {
   background-image: url('https://entropia.de/images/a/a9/GPN16_Raster.png');
   background-repeat: repeat;
   color: white;
   font-family: LiberationSans-Regular, "Open Sans", "Arial", sans-serif;
}
#column-content {
   background-image: url('https://entropia.de/images/a/a9/GPN16_Raster.png');
   background-repeat: repeat;
   color: white;
}
#content {
   background: hsla(201, 100%, 28%, 0.75) none repeat scroll 0 0;
   margin-right: 80px;
}
li, ul {
  list-style-image: none;
}
#p-navigation {
   background: none;
   color: white;
}
#p-navigation a {
   color: white;
}
#p-logo {
   background: none;
}
.pBody {
   background: none;
   color: white;
}
#p-personal li a {
   color: white;
   padding: 
}
#p-fnord a, #p-tb a {
   color: white;
}
h1, h2, h3, h4, h5, h6 {
   color: white;
   font-family: LiberationSans-Bold, "Open Sans", "Arial", sans-serif;
   border-bottom-color: white;
}
h1 {
   border-bottom: 2px dashed white;
}
body {
   color: white;
}
a, a:visited, a:active, a:link, #bodyContent a.external {
   color: #ffffff;
}
#toc {
   background: none;
   border: 2px solid white;
   margin-top: 35px;
}
#p-navigation ul li, #p-tb ul li {
   border: none;
}
#p-cactions li a, #p-cactions li, #p-cactions li.selected a {
   background: none;
   color: white;
}
#p-fnord ul li {
   border-bottom: none;
}
#p-cactions li a {
   font-size: 125%
}
#footer, div#footer {
   background: none;
   border: none;
}
div.NavHead {
   background: none;
}
div.NavFrame {
   border: 2px solid white;
}
div.thumbinner {
   background-color: rgba(35, 150, 214, 0.4);
   border: none;
}
html .thumbimage {
   border: none;
}
h1 {
   border-bottom: 2px solid rgb(255, 255, 255);
}
#p-cactions .new a {
   color: #d0d0d0;
}
#bodyContent a.new {
   color: #FF8A8A;
}
div#catlinks {
   background: none;
   border: none;
   border-top: 2px solid white;
}
pre {
   background: none;
   border: none;
   color: white;
}
table.wikitable {
   background: none;
   margin: 1em 0;
   border: 1px solid white;
   border-collapse: collapse;
   color: white;
}
table.diff {
   background-color: #ffffff;
   color: #000000;
}
table.wikitable > tr > th, table.wikitable > tr > td, table.wikitable > * > tr > th, table.wikitable > * > tr > td {
   border: 1px solid white;
   padding: 0.2em 0.4em;
   background: none;
}
tbody {
   border-color: white;
}
 @-webkit-keyframes fadeIcon {
   0%   { opacity:0;}
   40%  { opacity:0;}
   50%  { opacity:1;}
   60%  { opacity:0;}
   100% { opacity:0;}
 }
 @-moz-keyframes fadeIcon {
   0%   { opacity:0;}
   40%  { opacity:0;}
   50%  { opacity:1;}
   60%  { opacity:0;}
   100% { opacity:0;}
 }
 @keyframes fadeIcon {
   0%   { opacity:0;}
   40%  { opacity:0;}
   50%  { opacity:1;}
   60%  { opacity:0;}
   100% { opacity:0;}
 }
 
 div.NavFrame div.NavPic div.icon {
 -webkit-animation:fadeIcon linear infinite;
 -moz-animation:fadeIcon linear infinite;
 animation:fadeIcon linear infinite;
 
 -webkit-animation-duration:4s;
 -moz-animation-duration:4s;
 animation-duration:4s;
 }
 
 div.NavFrame div.NavPic div.icon:nth-child(1n+0) {
   -webkit-animation-delay: 0s;
   animation-delay: 0s;
   background: url('/images/1/10/GPN16-Logo1_smal.svg') no-repeat left top;
 }
 div.NavFrame div.NavPic div.icon:nth-child(2n+0) {
   -webkit-animation-delay: 1s;
   animation-delay: 1s;
   background: url('/images/b/ba/GPN16-Logo2_smal.svg') no-repeat left top;
 }
 div.NavFrame div.NavPic div.icon:nth-child(3n+0) {
   -webkit-animation-delay: 2s;
   animation-delay: 2s;
   background: url('/images/2/2c/GPN16-Logo3_smal.svg') no-repeat left top;
 }
 div.NavFrame div.NavPic div.icon:nth-child(4n+0) {
   -webkit-animation-delay: 3s;
   animation-delay: 3s;
   background: url('/images/e/ef/GPN16-Logo4_smal.svg') no-repeat left top;
 }
 
 div.NavFrame div.NavPic {
       height: 80px;
       width: 80px;
 }
 div.NavFrame div.NavPic div.icon {
       position: absolute;
       opacity: 0;
       height: 80px;
       width: 80px;
       background-size: 100% auto;
 }
 }