Actions

MediaWiki

Foreground.css

From Permanent Future Lab

Note: After saving, you may have to bypass your browser's cache to see the changes.

  • Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
  • Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
  • Internet Explorer: Hold Ctrl while clicking Refresh, or press Ctrl-F5
  • Opera: Go to Menu → Settings (Opera → Preferences on a Mac) and then to Privacy & security → Clear browsing data → Cached images and files.
/**
 * INDEX:
 * - GLOBAL
 * - TOP BAR
 * - PAGE HEADER
 */

  /**
   * GLOBAL
   */
  body{
    background:#f2f2f2;
    font-family: 'HKGroteskRegular';
  }
  h1, h2, h3, h4, h5, h6{
    font-family: 'HKGroteskRegular';
  }
  h2 span{
    display:inline;
  }
  p{
    margin:1em 0px;
  }
  a,
  a:hover,
  a:focus{
    color:blue;
  }
  #bodyContent a:hover {
    color: #EE1971;
  }
  a.new{
    color:#FF6983;
  }

  .row{
    max-width:72.5em;
  }

  /**
   * TOP BAR
   */

  .top-bar{
    background-color: black;
    margin-bottom:0;
  }
  .top-bar .name h1 a {
    width: 100%;
  }
  .top-bar .name h1 a {
    width: 100%;
    padding-left: 40px;
    margin-left: 10px;
    background-image: url('https://static.miraheze.org/permanentfuturelabwiki/4/4d/Permanent-Future-Lab-header-logo.png');
    background-repeat: no-repeat;
    background-position: left center;
  }

  #p-cactions{
    position:static;
  }
  #p-cactions .dropdown{
    top: 50px;
    position: absolute;
    right: 10px;
  }
  #echo-notifications{
    top: 49px;
    right: 116px;
    position: absolute;
  }
  #p-cactions .namespace.label{
    display:none;
  }

  /* Fix the position of the action dropdown */
  #p-cactions #drop1.open {
    z-index: 100000;
    white-space: nowrap;
    top: 90px !important;
    position: absolute !important;
    left: initial !important;
    right: 20px !important;
  }

  /**
   * PAGE HEADER
   */
  #page-header{
    position:relative;
    display: block;
    width: 100%;
    min-height:300px;
    height: 75vh;
    background: url("http://janineterlouw.nl/pflwiki/img/PFL_MusCom.jpg") center center no-repeat;
    background-size: cover;
  }
    #page-header h1{
      position: absolute;
      text-align: center;
      color: #000;
      top: 20px;
      text-shadow: -1px -2px 1px #FAFCFE;
      width: 100%;
      display:none;
    }

    .title-bar {
      height: 100%;
    }

    .title-bar-bg {
      position: absolute;
      bottom: 0;
      background: rgba(0, 0, 0, 0.75);
      left: 0;
      right: 0;
    }

    .title-bar .title-bar-inner {
      position: absolute;
      bottom: 0;
      font-size: 30px;
      min-height: 50px;
      color: #fff;
      left: 0;
      right: 0;
      padding-left: 55px;
    }

    @media (max-width: 500px) {
      .title-bar .title-bar-inner {
        padding-left: 5px;
      }
    }

    .title-bar .large-12 {
      height: 100%;
      line-height: 100%;
    }

  /** Landing specific
   *
   */
  #bodyContent {
    width:1200px;
    max-width:100%;
  }
  .is-landing #bodyContent > #mw-content-text{
    max-width: 1200px;
    max-width:100%;
    margin-right:auto;
    margin-left:auto;
    display:flex;
    justify-content: space-around;
    flex-flow:row wrap;
    align-items:stretch;
  }
  .block{
    background-color:#fff;
    margin:20px;
    padding:20px;
  }
  .block:first-child{
    min-height: 294px;
  }

  .is-landing .block:nth-child(3n+2){
    flex:1 100%;
  }
  .is-landing .block:nth-child(2),
  .is-landing .block:nth-child(3),
  .is-landing .block:nth-child(5),
  .is-landing .block:nth-child(6){
    flex:1 100%
  }
  .block-blue,.block-pink, .is-landing .block:nth-child(2), .is-landing .block:nth-child(6)
  .is-landing .block:nth-child(1){
    background-color: blue;
    color: white;
  }
  
  .is-landing .block:nth-child(2) a:link, 
  .is-landing .block:nth-child(2) a:visited {
    text-decoration: none;
    border-bottom: 1px dotted #fff;
  }

  .is-landing .block:nth-child(2) a:hover, 
  .is-landing .block:nth-child(2) a:active {
    text-decoration: none;
    color: #ffffff !important;
    border-bottom: 1px solid #fff;
  }

  .is-landing .block:nth-child(2){
    flex:2;
  }
  .is-landing .block:nth-child(5){
    flex:2;
  }
  .is-landing .block:nth-child(6){
    flex:1;
  }

  .block h2:not(.title),
  .block h3:not(#tagline){
    margin-top:0;
  }
  .block-blue a,
  .block-blue h2,
  .is-landing .block:nth-child(2) h2,
  .is-landing .block:nth-child(2) a,
  .is-landing .block:nth-child(2) a:hover,
  .is-landing .block:nth-child(2) a:focus,
  .is-landing .block:nth-child(2) .mw-editsection-bracket:first-of-type,/*brackets around 'edit'*/
  .is-landing .block:nth-child(2) .mw-editsection-bracket:not(:first-of-type){
    color:#fff;
  }
  /* brackets */
  .client-js .mw-content-ltr .mw-editsection-bracket:first-of-type,
  .client-js .mw-content-rtl .mw-editsection-bracket:not(:first-of-type){
    color:blue;
    margin-right:0;
  }
  .client-js .mw-content-rtl .mw-editsection-bracket:first-of-type,
  .client-js .mw-content-ltr .mw-editsection-bracket:not(:first-of-type){
    color:blue;
    margin-left:0;
  }

  .block-pink,
  .is-landing .block:nth-child(1),
  .is-landing .block:nth-child(6){
    background-color: pink;
    flex: 1;
  }

  .mw-editsection{
    float:none;
  }
  .is-landing .block-blue .mw-editsection,
  .is-landing .block-blue .mw-editsection a{
    color:#fff;
  }

  /** Content page specific
   *
   */
  body:not(.is-landing) #bodyContent{
    padding:40px;
    padding-top:10px;
    background: #fff;
  }

  /**
   * Content
   */
  #toc{
    display:none;
  }
  #content{
    margin:20px 0;
  }
  h3#tagline{
    margin-bottom:2em;
  }
  /* Thumbnails at the right of the screen */
  div.tright{
    margin-right:20px;  
  }

  /**
   * Footer
   */
  #footer-lastmod{
    float:left;
  }
  #footer-copyright{
    float:right;
  }
  #footer-privacy,
  #footer-about,
  #footer-disclaimer,
  #footer-footer-mobileview{
    display:none;
  }
  #footer-right-icons{

  }

  /**
   *  VisualEditor fixes for use with Foreground skin
   */
  .oo-ui-barToolGroup > .oo-ui-toolGroup-tools > .oo-ui-tool > .oo-ui-tool-link{
    padding:0 0.625em;
  }
  .oo-ui-popupToolGroup-handle{
    height:100%;
  }
  .oo-ui-toolGroup,
  .oo-ui-barToolGroup > .oo-ui-toolGroup-tools > .oo-ui-tool{
    height:50px;
  }
  /* wrapper */

  .ve-ui-surface{
    background-color:#fff;
  }