MediaWiki:Common.css: Difference between revisions

From Drama Chaser
No edit summary
No edit summary
 
(27 intermediate revisions by the same user not shown)
Line 36: Line 36:
/* character-infobox */
/* character-infobox */


.Infobox-character {
.infobox-character {
     border: 2px solid #272d2d;
     border: 2px solid #272d2d;
     background-color: #e9dfc9;
     background-color: #e9dfc9;
     float: right;
     float: right;
     margin: 0 0 1em 1em;
     margin: 0 0 1em 1em;
     padding: 1em;
     padding: 1em 1em 1em 1em;
     width: 30%;
     width: 30%;
}
}
Line 52: Line 52:
.infobox-image {
.infobox-image {
     text-align: center;
     text-align: center;
     max-width: 100%;
     max-width: 95%;
     height: auto;
     height: auto;
    padding-bottom: 30px;
}
}


Line 59: Line 60:
     text-align: right;
     text-align: right;
     vertical-align: top;
     vertical-align: top;
     width: 120px;
     padding: 5px;
}
}


.infobox-table td {
.infobox-table td {
     vertical-align: top;
     vertical-align: top;
    padding: 5px;
}
}


.infobox-table {
    align: center;
    margin: auto;
}


/* body of the article—VECTOR SPECIFIC */
/* body of the article—VECTOR SPECIFIC */
Line 89: Line 95:
     background-repeat: no-repeat;
     background-repeat: no-repeat;
     background-position: 50% 50%;  
     background-position: 50% 50%;  
     height: 230px;
     height: 230px;  
}
}


Line 98: Line 104:


a:hover { text-decoration: underline !important; }
a:hover { text-decoration: underline !important; }
/* zebra tables */
tr:nth-child(even) { background-color: #f8f4ed; }
tr:nth-child(odd) { background-color: #f1e9dc; }
tr:hover { background-color: #ecd7d0; }


/* cleaning things up */
/* cleaning things up */
Line 110: Line 124:
.vector-feature-zebra-design-disabled .vector-toc { background-color:#ece2d0; }
.vector-feature-zebra-design-disabled .vector-toc { background-color:#ece2d0; }
.vector-feature-zebra-design-disabled #vector-main-menu-pinned-container .vector-main-menu { background-color:#ece2d0; }
.vector-feature-zebra-design-disabled #vector-main-menu-pinned-container .vector-main-menu { background-color:#ece2d0; }
/* messing around with episode picker tables; this is very much a wip */
#episodes {
display: grid;
  grid: auto / auto auto auto auto auto;
  gap: 10px;
  background-color: #f1e9dc;
  padding: 10px;
}
 
#episodes div {
  background-color: rgba(255, 255, 255, 0.6);
  text-align: center;
  padding: 10px 0;
  font-size: medium;
  box-shadow: 1px 1px 1px 1px;
}

Latest revision as of 05:02, 4 June 2024

/* CSS placed here will be applied to all skins */

/* infobox styling */

.infobox {
    border: 2px solid #272d2d;
    background-color: #e9dfc9;
    float: right;
    margin: 0 0 1em 1em;
    padding: 1em;
    width: 30%;
}

.infobox-title {
    font-size: 2em;
    text-align: center;
    }

.infobox-image {
    text-align: center;
    max-width: 100%;
    height: auto;
}

.infobox-table th {
    text-align: right;
    vertical-align: top;
    width: 120px;
}

.infobox-table td {
    vertical-align: top;
}


/* character-infobox */

.infobox-character {
    border: 2px solid #272d2d;
    background-color: #e9dfc9;
    float: right;
    margin: 0 0 1em 1em;
    padding: 1em 1em 1em 1em;
    width: 30%;
}

.infobox-title {
    font-size: 2em;
    text-align: center;
    }

.infobox-image {
    text-align: center;
    max-width: 95%;
    height: auto;
    padding-bottom: 30px;
}

.infobox-table th {
    text-align: right;
    vertical-align: top;
    padding: 5px;
}

.infobox-table td {
    vertical-align: top;
    padding: 5px;
}

.infobox-table {
    align: center;
    margin: auto;
}

/* body of the article—VECTOR SPECIFIC */

.vector-body {
    background-color: #ece2d0;
    padding: 2% !important;
    border: 2px solid #272d2d !important;
}

/* body background. hacky as hell. whatever. */

.mw-page-container {
    background-color: #8d6345 !important;
}


/* header with banner */ 

.vector-header-container {
    background-color: #8d6345 !important;
    background-image: url('https://dramachaser.com/images/a/a0/Dummy.gif');
    background-repeat: no-repeat;
    background-position: 50% 50%; 
    height: 230px; 
}

/* links */
a:link { color: #06560e !important; }

a:visited { color: #732e1c !important; }

a:hover { text-decoration: underline !important; }

/* zebra tables */

tr:nth-child(even) { background-color: #f8f4ed; }

tr:nth-child(odd) { background-color: #f1e9dc; }

tr:hover { background-color: #ecd7d0; }

/* cleaning things up */

#mw-teleport-target { display:none; }

/* no more ugly gradients */
.vector-feature-zebra-design-disabled #vector-page-tools-pinned-container .vector-page-tools::after { display: none; }
.vector-feature-zebra-design-disabled #vector-toc-pinned-container .vector-toc::after { display: none; }

/* make the background colour of the left sidebar match everything else */
.vector-feature-zebra-design-disabled .vector-toc { background-color:#ece2d0; }
.vector-feature-zebra-design-disabled #vector-main-menu-pinned-container .vector-main-menu { background-color:#ece2d0; }


/* messing around with episode picker tables; this is very much a wip */

#episodes {
display: grid;
  grid: auto / auto auto auto auto auto;
  gap: 10px;
  background-color: #f1e9dc;
  padding: 10px;
}
  
#episodes div {
  background-color: rgba(255, 255, 255, 0.6);
  text-align: center;
  padding: 10px 0;
  font-size: medium;
  box-shadow: 1px 1px 1px 1px;
}