Idea Supreme

MediaWiki:Common.css: Difference between revisions

An idea by Jeff Lawlor
Created on 2024-10-08
← Older edit
No edit summary
Header is left-aligned in desktop
 
(56 intermediate revisions by the same user not shown)
Line 1: Line 1:
/* CSS placed here will be applied to all skins */
/* CSS placed here will be applied to all skins */
body
body {
{
     font-family: Trebuchet MS, Tahoma, sans-serif;
     font-family: Trebuchet MS, Tahoma, sans-serif;
}
/* Hide options in preferences, particularly the ability to change skin in Vector and Minerva */
#mw-htmlform-skin,
#mw-input-wpskin,
#mw-prefsection-rendering-skin legend,
#mw-htmlform-skin {
display: none;
}
/* Logo tweaks */
body.skin-vector-2022 .mw-logo-icon {
margin-right: 6px;
}
}


Line 38: Line 50:


.mf-icon-expand {
.mf-icon-expand {
display: none;
}
/* Remove hamburger menu with nothing in it in Vector */
.vector-main-menu-landmark {
display: none;
display: none;
}
}
Line 66: Line 83:


.page-quick-details {
.page-quick-details {
margin-right: 1em;
font-size: 75%;
font-size: 75%;
}
}


.page-Main_Page .page-quick-details,
.page-Main_Page .hide-when-not-idea,
body[class*=' page-MediaWiki_'] .page-quick-details,
body[class*=' page-MediaWiki_'] .hide-when-not-idea,
/*body[class*=' page-User_'] .page-quick-details,*/
body[class*=' page-User_'] .hide-when-not-idea,
body[class*=' page-Idea_Supreme_'] .page-quick-details,
body[class*=' page-Idea_Supreme_'] .hide-when-not-idea,
body[class*=' ns-special '] .page-quick-details {
body[class*=' page-Special_'] .hide-when-not-idea,
body[class*=' ns-special '] .hide-when-not-idea {
display: none;
display: none;
}
}


/* Hide heading on user profiles */
/* Hide heading on user profiles
body[class*=' page-User_'].skin-minerva .page-heading,
body[class*=' page-User_'].skin-minerva .page-heading,
body[class*=' page-User_'].skin-vector header.vector-page-titlebar {
body[class*=' page-User_'].skin-vector header.vector-page-titlebar {
     display: none;
     display: none;
}
}
 
*/
body[class*=' page-User_'] .oo-ui-windowManager .oo-ui-fieldsetLayout-group>.oo-ui-layout {
body[class*=' page-User_'] .oo-ui-windowManager .oo-ui-fieldsetLayout-group>.oo-ui-layout {
display: none;
display: none;
Line 104: Line 121:
body[class*=' ns-special '] .vector-page-titlebar {
body[class*=' ns-special '] .vector-page-titlebar {
margin-bottom: unset;
margin-bottom: unset;
}
.header-button {
border: none;
    width: 2rem;
    height: 2rem;
    background-color: #6b8edf;
    color: #ffffff;
    border-radius: 50%;
    margin-left: 1em;
    text-align: center;
    line-height: 2rem;
}
.header-button:hover {
cursor: pointer;
}
.header-button a, .header-button a:hover, .header-button a:visited {
color: #ffffff;
}
}


Line 121: Line 158:
margin-right: 1em;  
margin-right: 1em;  
font-size: 75%;
font-size: 75%;
}
.page-heading-grid {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  width: 100%;
}
.page-heading-left-column {
justify-self: start;
}
.page-heading-right-column {
justify-self: end;
display: grid;
grid-template-columns: auto 1fr;
align-items: center;
}
}


Line 128: Line 183:
}
}


.page-Main_Page.skin-minerva .page-heading div,  
.page-Main_Page.skin-minerva .hide-when-not-idea,  
body[class*=' page-MediaWiki_'].skin-minerva .page-heading div,
body[class*=' page-MediaWiki_'].skin-minerva .hide-when-not-idea,
/*body[class*=' page-User_'].skin-minerva .page-heading div,*/
/*body[class*=' page-User_'].skin-minerva .page-heading div,*/
body[class*=' page-Idea_Supreme_'].skin-minerva .page-heading div,
body[class*=' page-Idea_Supreme_'].skin-minerva .hide-when-not-idea,
body[class*=' ns-special '].skin-minerva .page-heading div {
body[class*=' ns-special '].skin-minerva .hide-when-not-idea {
display: none;
display: none;
}
}
Line 176: Line 231:


/* No gray background behind pictures! */
/* No gray background behind pictures! */
.mw-parser-output figure[typeof='mw:File'] img
.mw-parser-output figure[typeof='mw:File'] img {
{
background-color: transparent;
background-color: transparent;
}
/* Turn the brightness to 10 for pictures in dark mode */
html.skin-theme-clientpref-night .mw-parser-output > figure[typeof='mw:File/Thumb'] img {
filter: brightness(1);
}
/* Remove filter on bottom logo in mobile dark mode */
html.skin-theme-clientpref-night .minerva-footer-logo > img {
filter: unset;
}
}


Line 238: Line 302:
display: block;
display: block;
width: 322px;
width: 322px;
}
.skin-minerva .content figure[typeof~='mw:File/Thumb'],
.skin-minerva .content figure[typeof~='mw:File/Frame'] {
margin: 0.6em auto 1.75em auto;
}
}


Line 269: Line 338:


#toc {
#toc {
display: none;
}
/* Hide Discussion button at bottom of mobile page */
#page-secondary-actions {
display: none;
display: none;
}
}
Line 283: Line 357:
   border: 1px solid var(--is-border-color);
   border: 1px solid var(--is-border-color);
   border-radius: 8px;
   border-radius: 8px;
   padding: 7px;
   padding: 10px;
   box-sizing: border-box;
   box-sizing: border-box;
   margin: 0.5em 0 1.3em 1.4em;
   margin: 0.5em 0 1.3em 1.4em;
Line 304: Line 378:
.infobox-image {
.infobox-image {
text-align: center;
text-align: center;
/*border: 1em solid var(--tab-active-bg, #f0f0f0);*/
}
 
.infobox-wishes {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 0.75em;
  margin-bottom: .5em;
}
 
.infobox-wishes img {
border-radius: 10%;
}
 
.infobox-wishes .infobox-heading {
margin: 0;
padding: 0;
font-size: 1.25em;
}
 
.infobox-wishes-p {
padding-bottom: 0 !important;
margin-bottom: .5em !important;
font-size: .875rem;
}
}


Line 321: Line 418:
.user-name {
.user-name {
   font-weight: bold;
   font-weight: bold;
   font-size: 1.1em;
   font-size: 1.25em;
  margin-left: .25em;
}
 
.user-email {
  font-size: 2em;
}
 
.user-email a, .user-email a:hover {
text-decoration: none;
}
}


Line 331: Line 437:
.infobox-tab {
.infobox-tab {
   padding: 0.4em 0.8em;
   padding: 0.4em 0.8em;
   border-radius: 4px 4px 0 0;
   border-radius: 8px 8px 0 0;
   background-color: var(--tab-bg, #e0e0e0);
   background-color: var(--tab-bg);
   cursor: pointer;
   cursor: pointer;
   font-weight: bold;
   font-weight: bold;
Line 338: Line 444:


.infobox-tab.active {
.infobox-tab.active {
   background-color: var(--tab-active-bg, #d0d0d0);
   background-color: var(--tab-active-bg);
}
}


.infobox-panel {
.infobox-panel {
   background-color: var(--tab-active-bg, #d0d0d0);
   background-color: var(--tab-active-bg);
   padding: 0.4em 0.8em;
   padding: 0.8em;
   overflow-y: auto;
   overflow-y: auto;
   height: 6em;
   height: 7em;
  border-radius: 0 8px 8px 8px;
}
 
.infobox-wishes-panel {
  background-color: var(--tab-active-bg);
  padding: 0.8em;
  border-radius: 8px;
}
}


.infobox-user, .infobox-panel.about-idea .panel-content {
.infobox-user, .infobox-panel.about-idea .panel-content {
   white-space: normal;
   white-space: normal;
}
.infobox-wishes {
/* background-color: var(--tab-active-bg, #f0f0f0);*/
padding: 0 0.5em .5em .5em;
font-size: 0.95em;
}
.infobox-wishes h1 {
margin: 0;
padding-top: .25em;
font-size: 1.5em;
}
.content .infobox-wishes p {
font-size: .86em;
}
}


.infobox-list {
.infobox-list {
   padding-left: 1.2em;
   padding-left: 0;
  margin-top: 0.5em;
   font-size: .875rem;
   font-size: 0.95em;
   list-style-type: disc;
   list-style-type: disc;
}
}


:root {
:root {
Line 388: Line 483:
}
}


/* Printer touch-ups */
@media print {
    .firstHeading::before {
    display: none;
    }
   
    .vector-page-titlebar, .skin-minerva .page-heading {
    border: 0;
    background: none;
    }
   
    header .share-container, .header-button {
    display: none;
    }
   
    .page-quick-details {
    float: right;
    }
   
    .infobox-tab.active, .infobox-panel, .infobox-wishes-panel {
    background-color: #CCCCCC;
    }
   
    .infobox-tab {
    background-color: #EEEEEE;
    }
   
    .mw-content-ltr figure[typeof~='mw:File/Thumb'], .mw-content-ltr figure[typeof~='mw:File/Frame'] {
    margin: 1em 0 1em 2em;
    float: right;
    clear: right;
    }
   
    .infobox-actions [data-tab='about-idea'] {
    display: none;
    }
   
    .infobox-idea {
page-break-inside: avoid;
    }
}
/* Lastest Big Ideas Tweaks */
@media (max-width: 639px) {
/* Center and bold Latest Big Ideas text */
    .gallery .gallerybox {
        text-align: center;
        font-weight: bold;
    }
}
@media (min-width: 640px) {
/* Header is left-aligned in desktop */
li.gallerycaption {
text-align: unset;
}
}


/* Light/dark mode  
/* Light/dark mode  
Retrieved from "https://www.ideasupreme.com/ideas/MediaWiki:Common.css"