MediaWiki:Vector.css: Difference between revisions

Mr Pie 5 (talk | contribs)
Updates for new skin
Mr Pie 5 (talk | contribs)
Search bar adjustments to better match figma.
 
(7 intermediate revisions by the same user not shown)
Line 13: Line 13:
   --head-personal-height:3em;
   --head-personal-height:3em;
   --head-background-image:url("https://wiki.geministation.com/images/0/0f/Wiki_background.jpg"); /* [[File:Wiki_background.jpg]] */
   --head-background-image:url("https://wiki.geministation.com/images/0/0f/Wiki_background.jpg"); /* [[File:Wiki_background.jpg]] */
   --head-height:calc(8em + var(--head-personal-height) + var(--search-height) + var(--logo-height));
   --head-height:calc(5.5em + var(--head-personal-height) + var(--search-height) + var(--logo-height));
    
    


Line 154: Line 154:
   width:var(--logo-width);
   width:var(--logo-width);
   height:var(--logo-height);
   height:var(--logo-height);
}
@media screen and (max-width: 982px) {
  #p-logo {
    top:calc((var(--head-height) + var(--head-border-height) + 2.5em) * -1);
  }
}
}


Line 215: Line 221:
#left-navigation,
#left-navigation,
#right-navigation {
#right-navigation {
   margin-top:calc(var(--head-height) - 2.5em);
   margin-top:var(--head-height);
}
}


Line 280: Line 286:
   height:var(--search-height);
   height:var(--search-height);
   border-radius:var(--search-height);
   border-radius:var(--search-height);
   border:2px solid #fff;
   border:3px solid #FAFAFA;
   background:rgba(33,33,33,0.5);
   background:#212F3E;
   box-shadow:none;
   box-shadow:none;
   color:#fff;
   color:#fff;
Line 309: Line 315:
   top:calc(var(--head-height) + var(--head-border-height) - 1px);
   top:calc(var(--head-height) + var(--head-border-height) - 1px);
   width:var(--sidebar-width);
   width:var(--sidebar-width);
}
@media screen and (max-width: 982px) {
  #mw-panel {
    top:calc(var(--head-height) + var(--head-border-height) + 2.5em - 1px)
  }
}
}


Line 323: Line 335:
   content:'';
   content:'';
   top:0;
   top:0;
   margin-left:calc(var(--sidebar-width) * -1 - 1.5em);
   margin-left: calc(var(--sidebar-width) * -1 - 1em);
}
 
@media screen and (min-width:982px) {
  #content::after {
    margin-left: calc(var(--sidebar-width) * -1 - 1.5em);
  }
}
}
/**/
/**/
Line 335: Line 353:
**********/
**********/
.mw-footer {
.mw-footer {
  text-align:center;
   margin-left:0;
   margin-left:0;
   background-color:var(--footer-background-color);
   background-color:var(--footer-background-color);
Line 349: Line 366:
}
}


#footer-places li{
#footer__content {
   float:none;
  display: grid;
   display:inline-block;
  grid-column-gap: 20px;
  grid-template-columns: repeat(3, 1fr);
  margin:auto;
  padding-top:40px;
  max-width:64em;
}
 
#footer__logo {
  display:block;
  margin-bottom:1em;
}
 
#footer__logo img {
  width:15em;
}
 
#footer h2 {
  font-size:1em;
   color: var(--footer-text-color);
   border:0;
  margin-bottom:20px;
}
}


Line 394: Line 431:
#mw-head {
#mw-head {
   width:calc(100% - var(--left-extra-sidebar-width));
   width:calc(100% - var(--left-extra-sidebar-width));
}
#sidebar {
  position:fixed;
  top:0;
  left:0;
  width:var(--left-extra-sidebar-width);
 
  --link-size: 3em;
}
#sidebar ul {
  margin:0;
  text-align:center;
  list-style: none;
}
#sidebar a {
  display:flex;
  flex-flow:column-reverse;
  align-items:center;
  margin-top:1.5em;
  color:#DFDCDC;
  text-transform: uppercase;
  font-family: Roboto, sans-serif;
  font-size:0.8125em;
}
#sidebar a:hover {
  text-decoration: none;
  color: #fff;
}
#sidebar a:first-child {
  margin-top:calc(2.5em + 10px);;
  margin-bottom:4em;
}
#sidebar img {
  width: var(--link-size);
  height: var(--link-size);
  border-radius:100%;
  background:gray;
  margin-bottom:5px;
}
}
/*************************
/*************************
* End left extra sidebar *
* End left extra sidebar *
**************************/
**************************/