MediaWiki:Common.css: Difference between revisions

From Drama Chaser
No edit summary
No edit summary
 
(46 intermediate revisions by 2 users not shown)
Line 33: Line 33:
}
}


/* this place looks incredibly sterile and this is an attempt at adding some aesthetics. any aesthetics, at this point. */
 
/* 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 */
/* body of the article—VECTOR SPECIFIC */
Line 43: Line 81:
}
}


/* body background. this is all so hacky that i'm embarrassed of it, but it works, so whatever; i'll consider making this graceful at some other point*/
/* body background. hacky as hell. whatever. */


.mw-page-container {
.mw-page-container {
Line 57: Line 95:
     background-repeat: no-repeat;
     background-repeat: no-repeat;
     background-position: 50% 50%;  
     background-position: 50% 50%;  
     height: 230px;
     height: 230px;  
}
}


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


a:link {
a:visited { color: #732e1c !important; }
    color: #06560e !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 */


a:visited {
#episodes {
    color: #732e1c !important;
display: grid;
  grid: auto / auto auto auto auto auto;
  gap: 10px;
  background-color: #f1e9dc;
  padding: 10px;
}
}
 
 
a:hover {
#episodes div {
    text-decoration: underline !important;
  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;
}