MediaWiki:Gadget-ms-Navbox.css: Difference between revisions

From Tardis Wiki, the free Doctor Who reference
Hopefully this will give us the old blue look; if it's not properly working, I'll just revert my edit
(Making this look more consistent, so navbox subchildren get the white line in either case (whether you have the list and then the subchild, or the "outside" list inside the subchild).)
(Hopefully this will give us the old blue look; if it's not properly working, I'll just revert my edit)
Tag: Reverted
Line 12: Line 12:
     from the English Wikipedia.
     from the English Wikipedia.
     ================== */
     ================== */
   
/* The 2022 navbox design
was created by [[user:SOTO]],
with inspiration from the initial
2018 project started by [[user:CzechOut]].
(It draws on both our light and dark themes,
so that it fits organically into either context.)
Jan 2022: Navboxes are currently
operational (and lookin' good). */


/*  ++++++++++++++++
/*  ++++++++++++++++
Line 60: Line 48:
}
}
div.NavPic {
div.NavPic {
    background-color: #D5D4f0;
     margin: 0px;
     margin: 0px;
     padding: 5px;
     padding: 5px;
     float: left;
     float: left;
 
}
}
div.NavFrame div.NavHead {
div.NavFrame div.NavHead {
Line 113: Line 103:
     text-align: right;
     text-align: right;
     width: auto;
     width: auto;
}
.table-wide-inner {
    width: 99%;
}
}


/*  +++++++++++++++
/*  +++++++++++++++
 
     DEFAULT SKIN
     NEW TARDIS SKIN
     FOR NAVBOXES
     FOR BASIC NAVBOXES.
     +++++++++++++++
   
    (based on a classic)
   
     +++++++++++++++++++
   
   
     =-=-=-=-=-=-=-=
     =-=-=-=-=-=-=-=
Line 133: Line 115:


table.navbox {     
table.navbox {     
     border:1px solid #ddd1bb; /*#e5c076 #9ec3f7*/
     border:none;
       -moz-box-shadow: inset 0 0 0 5px #9ca1af ;
    -webkit-border-radius: 10px 0px 0px 10px;
     -webkit-box-shadow: inset 0 0 0 5px #9ca1af;
      -moz-border-radius: 10px 0px 0px 10px;
         -ms-box-shadow: inset 0 0 0 5px #9ca1af;
        -ms-border-radius: 10px 0px 0px 10px;
         -o-box-shadow: inset 0 0 0 5px #9ca1af;  
        -o-border-radius: 10px 0px 0px 10px;
             box-shadow: inset 0 0 0 5px #9ca1af; /*#b19565 #5579ab #8b8780 */
            border-radius: 10px 0px 0px 10px;
     border-radius: 15px 8px 15px 8px;
       -moz-box-shadow: inset -0px 0px 25px 4px #D5D4F0;
    background: #343246;
     -webkit-box-shadow: inset -0px 0px 25px 4px #D5D4F0;
     color:#000;
         -ms-box-shadow: inset -0px 0px 25px 4px #D5D4F0;
         -o-box-shadow: inset -0px 0px 25px 4px #D5D4F0;
             box-shadow: inset -0px 0px 25px 4px #D5D4F0;
     background-color:transparent;
     color:#1F1E38;
     padding:5px;
     padding:5px;
     font-family: "Rubik";
     font-family: 'Lucida Grande', 'Trebuchet MS', 'Gill Sans', Verdana, 'URW Gothic L','Nimbus Sans L',sans-serif;
     text-align:left;
     text-align:left;
     line-height:120%;
     line-height:120%;
Line 149: Line 135:
     margin-left:auto;
     margin-left:auto;
     width:97%;
     width:97%;
    max-width: 658px;
    min-width: 530px;
}
.theme-fandomdesktop-light table.navbox {
    border: 1.5px solid #484662;
}
table.navbox a:link,
table.navbox a:visited {
    color: white;
}
}


/*  =-=-=-=-=-=-=-=
/*  =-=-=-=-=-=-=-=
Line 179: Line 154:
.navbox-abovebelow,  
.navbox-abovebelow,  
table.navbox th {
table.navbox th {
/*
    -webkit-border-radius: 10px 0px 0px 10px;
      -moz-border-radius: 10px 0px 0px 10px;
        -ms-border-radius: 10px 0px 0px 10px;
        -o-border-radius: 10px 0px 0px 10px;
            border-radius: 10px 0px 0px 10px;
      -moz-box-shadow: inset -0px 0px 25px 4px #D5D4F0;
    -webkit-box-shadow: inset -0px 0px 25px 4px #D5D4F0;
        -ms-box-shadow: inset -0px 0px 25px 4px #D5D4F0;
        -o-box-shadow: inset -0px 0px 25px 4px #D5D4F0;
            box-shadow: inset -0px 0px 25px #D5D4F0 4px;
*/
     text-align:center;
     text-align:center;
     color:#012c57;
     color:#012c57;
     font-family: "Rubik";
     font-family: 'Lucida Grande', 'Trebuchet MS', 'Gill Sans', Verdana, 'URW Gothic L','Nimbus Sans L',sans-serif;
     padding:3px;
     padding:3px;
     font-weight:normal;
     font-weight:normal;
Line 189: Line 176:
     padding-left:1em;
     padding-left:1em;
     padding-right:1em;
     padding-right:1em;
}
.navbox-title a:link, table.navbox th a:link,
.navbox-title a:visited, table.navbox th a:visited {
    color: #ede0c7;
    font-weight: bold;
}
/* Currently disabled: this detects italics combined with a second link, and turns off bold for both.
.navbox-title i + a:link, table.navbox th i + a:link,
.navbox-title i a:link, table.navbox th i a:link,
.navbox-title i + a:visited, table.navbox th i + a:visited,
.navbox-title i a:visited, table.navbox th i a:visited {
    font-weight: normal;
}*/
.navbox-subgroup .navbox-title a:link, .navbox-subgroup table.navbox th a:link, .navbox-subgroup .navbox-title a:visited, .navbox-subgroup table.navbox th a:visited {
    font-weight: normal; /* Removing bold from subsections, at least for now */
}
}


Line 225: Line 195:
}
}


/*  =-=--=-=-=-=-=-
    Main list style
    =-=-=-=-=-=-=-= */
   
.navbox-list {  
.navbox-list {  
     border-left:2px solid #fdfdfd;
     border-left:2px solid #fdfdfd;
}
}


.navbox-even {
    background: #dce0ee;
}
.navbox-odd {
    background: #ccd3e5;
}
/*  =-=--=-=-=-=-=-
    Titles and headings
    (and notes)
    =-=-=-=-=-=-=-= */
   
.navbox-title,  
.navbox-title,  
table.navbox th {
table.navbox th {    
     color:#e7e7e7;
    -webkit-border-radius: 10px 0px 0px 10px;
      -moz-border-radius: 10px 0px 0px 10px;
        -ms-border-radius: 10px 0px 0px 10px;
        -o-border-radius: 10px 0px 0px 10px;
            border-radius: 10px 0px 0px 10px;
      -moz-box-shadow: inset -0px 0px 25px 4px #D5D4F0;
    -webkit-box-shadow: inset -0px 0px 25px 4px #D5D4F0;
        -ms-box-shadow: inset -0px 0px 25px 4px #D5D4F0;
        -o-box-shadow: inset -0px 0px 25px 4px #D5D4F0;
            box-shadow: inset -0px 0px 25px 4px #DFD4F0;
     color:#1F1E38;
     padding:5px;
     padding:5px;
     font-family: "Rubik";
     font-family: 'Lucida Grande', 'Trebuchet MS', 'Gill Sans', Verdana, 'URW Gothic L','Nimbus Sans L',sans-serif;
     text-align:left;
     text-align:left;
     line-height:120%;
     line-height:120%;
Line 263: Line 227:
}
}
   
   
/*  =-=--=-=-=-=-=-
.navbox-subgroup .navbox-title {
      COLLAPSIBLES
    -webkit-border-radius: 10px 0px 0px 10px;
     =-=-=-=-=-=-=-= */
      -moz-border-radius: 10px 0px 0px 10px;
   
        -ms-border-radius: 10px 0px 0px 10px;
.navbox-subgroup .navbox-title {
        -o-border-radius: 10px 0px 0px 10px;
     color:#000;
            border-radius: 10px 0px 0px 10px;
      -moz-box-shadow: inset -0px 0px 25px 4px #D5D4F0;
     -webkit-box-shadow: inset -0px 0px 25px 4px #D5D4F0;
        -ms-box-shadow: inset -0px 0px 25px 4px #D5D4F0;
        -o-box-shadow: inset -0px 0px 25px 4px #D5D4F0;
            box-shadow: inset -0px 0px 25px 4px #D5D4F0;
     color:#1F1E38;
     padding:5px;
     padding:5px;
     font-family: "Rubik";
     font-family: 'Lucida Grande', 'Trebuchet MS', 'Gill Sans', Verdana, 'URW Gothic L','Nimbus Sans L',sans-serif;
     text-align:left;
     text-align:left;
     line-height:120%;
     line-height:120%;
Line 276: Line 246:
     margin-right:auto;
     margin-right:auto;
     margin-top:5px;
     margin-top:5px;
    background: #f1f2fb;
}
.collapsible .collapsed .navbox-title {
    background: #eff0fb; /* Introducing colour variation (greys) for collapsible navboxes.
    Do not touch colour choices, or nth-childs. */
}
.collapsible tr:nth-child(3n) .collapsible .navbox-title {
background: #dadbed;
}
.collapsible tr:nth-child(3n) .collapsed .navbox-title,
.collapsible tr:nth-child(14n+7) .collapsed .navbox-title,
.collapsible tr:nth-child(14n+29) .collapsed .navbox-title {
    background: #d8d9eb;
}
.collapsible tr:nth-child(5n+4) .collapsible .navbox-title,
.collapsible tr:nth-child(14n+27) .collapsible .navbox-title, /*These aren't duplicates*/
.collapsible tr:nth-child(14n+17) .collapsible .navbox-title,
.collapsible tr:nth-child(14n+13) .collapsible .navbox-title {
    background: none;
}
.collapsible tr:nth-child(5n+12) .collapsible .navbox-title {
    background: white;
}
.collapsible tr:nth-child(14n+27) .collapsed .navbox-title,
.collapsible tr:nth-child(14n+17) .collapsed .navbox-title,
.collapsible tr:nth-child(14n+13) .collapsed .navbox-title {
    background: #fdfdff;
}
}


.navbox-subgroup .navbox-group,  
.navbox-subgroup .navbox-group,  
.navbox-subgroup .navbox-abovebelow {  
.navbox-subgroup .navbox-abovebelow {  
     background: #e6e6ff;
     background:#e6e6ff;
}
}


.navbox-list .navbox {
.navbox-even {  
width: 100%;
     background:#f7f7f7;
    margin: 0;
     color:#012c57;
     background: none;
     border: none;
    box-shadow: none;
    padding: 0;
}
.navbox-subgroup .navbox .navbox-list {
    border-left-width: 0;
}
.navbox-subgroup > tbody > tr > .navbox-list > div {
    padding: 0!important;
}
}


.navbox-abovebelow, .navbox-group {
.navbox-odd {  
     /* background: #817ca9; */
     background:#012c57;
    background: #464076;      /* THink this one needs to be removed? */
     color:white;
}
 
.collapsible .navbox-group + td .navbox-subgroup .navbox-subgroup .navbox-group {
    background: #99a6cd;
}
 
.navbox-subgroup .navbox-group, .navbox-subgroup .navbox-abovebelow {
    background: #8b85b9;
}
 
.collapsible .navbox-subgroup .navbox-group {
    background: #8b85b9 ; /* #9d97c9 #464076 */
}
.collapsible .navbox-subgroup .navbox-subgroup .navbox-subgroup .navbox-group {
    background: #9d97c9; /* #bdb3cf #99a6cd */
}
.collapsible .navbox-subgroup .navbox-group a:link,
.collapsible .navbox-subgroup .navbox-group a:visited {
color: white;
}
.collapsible .navbox-subgroup .navbox-abovebelow {
background: #827cb3;
}
.collapsible .navbox-subgroup .navbox-abovebelow a:link,
.collapsible .navbox-subgroup .navbox-abovebelow a:visited {
     color: white; /* ffefcf */
}
 
 
/*  =-=--=-=-=-=-=-
    COLUMNS
    =-=-=-=-=-=-=-= */
   
.navbox-columns-table td {
    background: #eff0fb;
}
.navbox-columns-table td:nth-child(3n) {
background: #dadbed;
}
.navbox-columns-table td:nth-child(3n) {
    background: #d8d9eb;
}
.navbox-columns-table td:nth-child(5n+4),
.navbox-columns-table td:nth-child(14n+17),
.navbox-columns-table td:nth-child(14n+13),
.navbox-columns-table td:nth-child(5n+12) {
    background: #edeffffb;
}
 
 
/*  =-=--=-=-=-=-=-
      Various exceptions
    =-=-=-=-=-=-=-= */
   
table.navbox .navbox-list a:link,
table.navbox .navbox-list a:visited {
color: #1d1746;
}
 
.navbox-abovebelow {
    background: #32588d;
    background: #5579ab;
    background: #99a6cd;
}
 
.table-wide .navbox > tbody > tr > td {
    box-shadow: inset 0 -13px #596a9f;
    border-bottom-left-radius:15px;
    border-bottom-right-radius:15px;
}
.table-wide .navbox .navbox > tbody > tr > td {
    box-shadow: none;
    border-radius: 0;
}
 
table.navbox .navbox-list a.new {
    color: #ac0109;
}
 
 
/*  =-=--=-=-=-=-=-
      BUTTONS (needs to stay near bottom)
    =-=-=-=-=-=-=-= */
 
.navbox-title .collapseButton,
table.navbox th .plainlinks a:link,
table.navbox th .plainlinks a:visited {
    color: #cfd1d9; /* #e7eaf3 */
}
table.navbox th .plainlinks a {
font-weight: bold;
}
table.navbox th .plainlinks a:nth-child(1):link,
table.navbox th .plainlinks a:nth-child(1):visited {
color: #e7e7e7;
}
.collapsible .collapsible .navbox-title .collapseButton,
.collapsible .collapsible table.navbox th .plainlinks a:link,
.collapsible .collapsible table.navbox th .plainlinks a:visited {
    color: #222331;
}
 
/*  =-=--=-=-=-=-=-
      Additional modifications
    for light mode (greater contrast)
    =-=-=-=-=-=-=-= */
 
 
.theme-fandomdesktop-light .mw-parser-output > .navbox > tbody > tr > td > .collapsed > tbody > tr > .navbox-title,
.theme-fandomdesktop-light .mw-parser-output > .navbox > tbody > tr > td > .collapsed > tbody > tr > th {
    background: #524f72;
}
}


.theme-fandomdesktop-light .mw-parser-output >  table.navbox > tbody > tr > td > .collapsible > tbody > tr > .navbox-title,
.navbox-list .navbox-even a:link,
.theme-fandomdesktop-light .mw-parser-output >  table.navbox > tbody > tr > td > .collapsible > tbody > tr > th {
.navbox-even a:visited,
     background: #484662;
.navbox-even a:link {
     color:#012c57
}
}


/* EXCEPTIONS */
.navbox-odd a:visited,
.page-content .navbox-list > div > p {
.navbox-odd a:link,
    line-height: inherit;
.navbox-list .navbox-odd a:visited {
    margin-bottom: 0;
     color:#fff;
    padding-top: 0.25px;
    padding-bottom: 0.25px;
    border-bottom: solid 2px white;
}
.navbox-subgroup > tbody > tr:last-of-type > .navbox-list {
     padding-bottom: 1.5px!important;
}
}
   
   
@media print { .navbox { display: none; } }
@media print { .navbox { display: none; } }
Tech, emailconfirmed, Administrators
81,877

edits

Cookies help us deliver our services. By using our services, you agree to our use of cookies.