MediaWiki:Gadget-cosmostweaks.css: Difference between revisions
test |
Tag: Rollback |
||
| (106 intermediate revisions by 2 users not shown) | |||
| Line 1: | Line 1: | ||
@import url('https://fonts.googleapis.com/css2?family=Rubik:ital,wght@0,300..900;1,300..900&display=swap'); | @import url('https://fonts.googleapis.com/css2?family=Rubik:ital,wght@0,300..900;1,300..900&display=swap'); | ||
/*CS added thisvvv */ | |||
.portable-infobox { | |||
border:2px solid var(--button-color); | |||
margin-right:3px; | |||
border-radius:5px; | |||
} | |||
.portable-infobox .pi-navigation { | |||
text-shadow:1px 1px 0 var(--content-background-color),-1px 1px 0 var(--content-background-color),1px -1px 0 var(--content-background-color),-1px -1px 0 var(--content-background-color),0px 1px 0 var(--content-background-color),0px -1px 0 var(--content-background-color),-1px 0px 0 var(--content-background-color),1px 0px 0 var(--content-background-color),1px 1px 0 var(--content-background-color),-1px 1px 0 var(--content-background-color),1px -1px 0 var(--content-background-color),-1px -1px 0 var(--content-background-color),0px 1px 0 var(--content-background-color),0px -1px 0 var(--content-background-color),-1px 0px 0 var(--content-background-color),1px 0px 0 var(--content-background-color),1px 1px 0 var(--content-background-color),-1px 1px 0 var(--content-background-color),1px -1px 0 var(--content-background-color),-1px -1px 0 var(--content-background-color),1px 1px 0 var(--content-background-color),-1px 1px 0 var(--content-background-color),1px -1px 0 var(--content-background-color),-1px -1px 0 var(--content-background-color); | |||
} | |||
.portable-infobox .pi-item-spacing { | |||
border-radius:2px; | |||
} | |||
.pi-section-navigation .pi-section-tab.pi-section-active, .pi-section-navigation .pi-section-tab.current, .pi-media-collection .pi-tab-link.current { | |||
color: var(--banner-text-color); | |||
border-radius:2px; | |||
border-bottom: 1px solid var(--button-text-color); | |||
} | |||
.pi-image { | |||
border-bottom: 2px solid var(--button-color); | |||
} | |||
.charboxes { | |||
width: 138px; | |||
height: 138px; | |||
border: solid black; | |||
border-width: 2px 3px 4px; | |||
border-radius: 20px; | |||
overflow: hidden; | |||
padding: 0; | |||
display: flex; | |||
flex-direction:column; | |||
align-items:center; | |||
justify-content: center; | |||
box-shadow:4px 4px var(--button-color),-4px 4px var(--button-color),-4px -4px var(--button-color),4px -4px var(--button-color); | |||
margin:0 5px; | |||
} | |||
.charboxeslink { | |||
position: absolute; | |||
bottom: -45px; | |||
background: rgb(164, 137, 115); | |||
background: rgba(164, 137, 115, 0.8); | |||
display: flex; | |||
align-items: flex-end; | |||
justify-content: center; | |||
font-family: Cookie Run Bold, rubik, helvetica, arial, sans-serif; | |||
width: 140px; | |||
height: fit-content; | |||
color: white; | |||
text-shadow: 1px 1px 0 var(--footer-color),-1px 1px 0 var(--footer-color),1px -1px 0 var(--footer-color),-1px -1px 0 var(--footer-color),0px 1px 0 var(--footer-color),0px -1px 0 var(--footer-color),-1px 0px 0 var(--footer-color),1px 0px 0 var(--footer-color),1px 1px 0 var(--footer-color),-1px 1px 0 var(--footer-color),1px -1px 0 var(--footer-color),-1px -1px 0 var(--footer-color),0px 1px 0 var(--footer-color),0px -1px 0 var(--footer-color),-1px 0px 0 var(--footer-color),1px 0px 0 var(--footer-color),1px 1px 0 var(--footer-color),-1px 1px 0 var(--footer-color),1px -1px 0 var(--footer-color),-1px -1px 0 var(--footer-color),1px 1px 0 var(--footer-color),-1px 1px 0 var(--footer-color),1px -1px 0 var(--footer-color),-1px -1px 0 var(--footer-color); | |||
padding: 4px 7px 8px; | |||
font-size: 13px; | |||
border: solid white 1px; | |||
line-height: 1.1; | |||
box-shadow:2px 2px var(--button-text-color),-2px 2px var(--button-text-color),-2px -2px var(--button-text-color),2px -2px var(--button-text-color); | |||
margin: auto; | |||
overflow-wrap: break-word; | |||
hyphens: auto; | |||
-o-hyphens: auto; | |||
-ms-hyphens: auto; | |||
-webkit-hyphens: auto; | |||
text-align: center; | |||
transition: bottom .2s cubic-bezier(.45,.05,.55,.95); | |||
-webkit-transition: bottom .2s cubic-bezier(.45,.05,.55,.95); | |||
-moz-transition: bottom .2s cubic-bezier(.45,.05,.55,.95); | |||
-ms-transition: bottom .2s cubic-bezier(.45,.05,.55,.95); | |||
-o-transition: bottom .2s cubic-bezier(.45,.05,.55,.95); | |||
border-bottom:0; | |||
} | |||
.charboxes:hover .charboxeslink { | |||
bottom:2px; | |||
} | |||
.fluidimg100 img, .fluidimg img { | |||
max-width:100%; | |||
height:auto; | |||
} | |||
.CosmosRail .module h3 { | |||
border-bottom: 3px solid var(--pi-border-color); | |||
} | |||
.read-more-container-heading { | |||
color: var(--text-color); | |||
border-bottom: 0; | |||
padding-bottom: 0.5em; | |||
font-size: 0.8em; | |||
font-weight: normal; | |||
letter-spacing: 1px; | |||
text-transform: uppercase; | |||
} | |||
.cdx-card { | |||
/* background-color: var(--background-color-base, #fff); */ | |||
display: flex; | |||
align-items: flex-start; | |||
position: relative; | |||
border-radius: 2px; | |||
padding: 12px; | |||
background: var(--transparent-white); | |||
} | |||
.cdx-card__text__title { | |||
color: var(--text-color); | |||
} | |||
#catlinks { | |||
padding: 10px; | |||
padding-top: 1em; | |||
border: 1px solid color-mix(in srgb, var(--link-color) 30%, transparent); | |||
margin-top: 1em; | |||
margin-bottom: 1em; | |||
clear: both; | |||
color: #000; | |||
line-height: 1.8em; | |||
} | |||
.client-js .read-more-container { | |||
padding: 0 0 0; | |||
box-sizing: border-box; | |||
} | |||
.portable-infobox .pi-horizontal-group-item:nth-child(even) { | |||
background-color: color-mix(in srgb, var(--banner-text-color) 20%, transparent); | |||
} | |||
/* Navtab things */ | |||
.navtab a, .navtab .new { | |||
font-weight: bold; | |||
color: var(--banner-color); | |||
border: 1px solid var(--footer-color); | |||
border-radius: 12px 12px 0 0; | |||
text-align: center; | |||
padding: 8px; | |||
font-size: 18px; | |||
line-height: 1.3; | |||
overflow: hidden; | |||
width: 100%; | |||
height: 100%; | |||
display: -webkit-flexbox; | |||
display: -ms-flexbox; | |||
display: -webkit-flex; | |||
display: flex; | |||
-webkit-flex-align: center; | |||
-ms-flex-align: center; | |||
-webkit-align-items: center; | |||
align-items: center; | |||
justify-content: center; | |||
background-color: var(--banner-color); | |||
-webkit-transition: background-color .1s linear,border-right-color .1s linear,border-top-color .1s linear,border-left-color .1s linear,border-bottom-color .1s linear,text-shadow .1s linear; | |||
-moz-transition: background-color .1s linear,border-right-color .1s linear,border-top-color .1s linear,border-left-color .1s linear,border-bottom-color .1s linear,text-shadow .1s linear; | |||
-ms-transition: background-color .1s linear,border-right-color .1s linear,border-top-color .1s linear,border-left-color .1s linear,border-bottom-color .1s linear,text-shadow .1s linear; | |||
-o-transition: background-color .1s linear,border-right-color .1s linear,border-top-color .1s linear,border-left-color .1s linear,border-bottom-color .1s linear,text-shadow .1s linear; | |||
transition: background-color .1s linear,border-right-color .1s linear,border-top-color .1s linear,border-left-color .1s linear,border-bottom-color .1s linear,text-shadow .1s linear; | |||
border-bottom: 0; | |||
text-shadow: 1px 1px 0 var(--footer-color),-1px 1px 0 var(--footer-color),1px -1px 0 var(--footer-color),-1px -1px 0 var(--footer-color),0px 1px 0 var(--footer-color),0px -1px 0 var(--footer-color),-1px 0px 0 var(--footer-color),1px 0px 0 var(--footer-color),1px 1px 0 var(--footer-color),-1px 1px 0 var(--footer-color),1px -1px 0 var(--footer-color),-1px -1px 0 var(--footer-color),0px 1px 0 var(--footer-color),0px -1px 0 var(--footer-color),-1px 0px 0 var(--footer-color),1px 0px 0 var(--footer-color),1px 1px 0 var(--footer-color),-1px 1px 0 var(--footer-color),1px -1px 0 var(--footer-color),-1px -1px 0 var(--footer-color),1px 1px 0 var(--footer-color),-1px 1px 0 var(--footer-color),1px -1px 0 var(--footer-color),-1px -1px 0 var(--footer-color); | |||
} | |||
.navtab .new, .navtab a.new:hover { | |||
text-decoration:line-through 1pt var(--footer-color) !important; | |||
-webkit-text-decoration:line-through var(--footer-color) !important; | |||
} | |||
.navtab a:hover { | |||
color: color-mix(in srgb, var(--banner-color-hover), #fff 25%); | |||
text-decoration: none !important; | |||
-webkit-text-decoration: none !important; | |||
background-color: color-mix(in srgb, var(--banner-color-hover), var(--banner-text-color) 25%); | |||
-webkit-transition: background-color .1s linear,border-color .1s linear,color .15s linear,text-shadow .1s linear; | |||
-moz-transition: background-color .1s linear,border-color .1s linear,color .15s linear,text-shadow .1s linear; | |||
-ms-transition: background-color .1s linear,border-color .1s linear,color .15s linear,text-shadow .1s linear; | |||
-o-transition: background-color .1s linear,border-color .1s linear,color .15s linear,text-shadow .1s linear; | |||
transition: background-color .1s linear,border-color .1s linear,color .15s linear,text-shadow .1s linear; | |||
border-color: color-mix(in srgb, var(--banner-color-hover), var(--banner-text-color) 45%); | |||
} | |||
.navtab-bg div { | |||
position: relative; | |||
height: 100%; | |||
width: 100%; | |||
border-radius: 10px 10px 0 0; | |||
text-align: center; | |||
padding: 8px; | |||
line-height: 1.3; | |||
font-size: 18px; | |||
color: white; | |||
text-shadow: 1px 1px 0 var(--footer-color),-1px 1px 0 var(--footer-color),1px -1px 0 var(--footer-color),-1px -1px 0 var(--footer-color),0px 1px 0 var(--footer-color),0px -1px 0 var(--footer-color),-1px 0px 0 var(--footer-color),1px 0px 0 var(--footer-color),1px 1px 0 var(--footer-color),-1px 1px 0 var(--footer-color),1px -1px 0 var(--footer-color),-1px -1px 0 var(--footer-color),0px 1px 0 var(--footer-color),0px -1px 0 var(--footer-color),-1px 0px 0 var(--footer-color),1px 0px 0 var(--footer-color),1px 1px 0 var(--footer-color),-1px 1px 0 var(--footer-color),1px -1px 0 var(--footer-color),-1px -1px 0 var(--footer-color),1px 1px 0 var(--footer-color),-1px 1px 0 var(--footer-color),1px -1px 0 var(--footer-color),-1px -1px 0 var(--footer-color); | |||
overflow: hidden; | |||
display: -webkit-flexbox; | |||
display: -ms-flexbox; | |||
display: -webkit-flex; | |||
display: flex; | |||
-webkit-flex-align: center; | |||
-ms-flex-align: center; | |||
-webkit-align-items: center; | |||
align-items: center; | |||
justify-content: center; | |||
border: 1px solid var(--footer-color); | |||
border-bottom-width: 0; | |||
background-color: #624d43; | |||
background-image: url(https://nbittrpgwiki.pynappo.xyz/images/4/47/Placeholder.png); | |||
background-position: left; | |||
background-size: 2400px 502px; | |||
box-shadow: 3px 0px var(--button-color),-3px 0px var(--button-color),-3px -3px var(--button-color),3px -3px var(--button-color); | |||
margin: 0 3px; | |||
} | |||
/******************* | |||
* Navboxes | |||
*******************/ | |||
/* | |||
* CSS Vars | |||
* Note: The linter will throw an error. See [https://community.fandom.com/wiki/Help:Advanced_CSS_and_JS#Common_issues this page] for more info. | |||
*/ | |||
.mw-collapsible-toggle-default .mw-collapsible-text { | |||
color: var(--button-text-color); | |||
} | |||
.navbox { | |||
--navbox-bg-color: var(--content-background-color); | |||
--navbox-text-color: var(--text-color); | |||
--navbox-title-color: color-mix(in lch, var(--banner-color), var(--content-background-color) 10%); | |||
--navbox-header-color: color-mix(in hwb, var(--banner-color), 65% transparent); | |||
--navbox-alt-color: color-mix(in lch, var(--banner-color), var(--content-background-color) 90%); | |||
--navbox-border-color: var(--banner-color); | |||
} | |||
.navbox { | |||
width: 100%; | |||
background: var(--navbox-bg-color, white); | |||
color: var(--navbox-text-color, black); | |||
margin: 1em auto; | |||
font-size: 84%; | |||
text-align: center; | |||
clear: both; | |||
padding: 2px; | |||
border-spacing: 0; | |||
border: 1px solid var(--navbox-border-color, #AAA); | |||
} | |||
/* Merges navboxes that are directly under eachother */ | |||
.navbox + .navbox { | |||
margin-top: -11px; | |||
} | |||
.navbox .navbox-title { | |||
background: var(--navbox-title-color, #CCF); | |||
color: var(--navbox-text-color, black); | |||
font-weight: bold; | |||
text-align: center; | |||
} | |||
.navbox .navbox-vde { | |||
float: left; | |||
width: 65px; | |||
} | |||
.navbox .navbox-title th { | |||
padding: 2px 0; | |||
} | |||
.navbox .navbox-title th > div, | |||
.navbox th.navbox-header > div { | |||
padding: 0 4px; | |||
} | |||
.navbox .navbox-title th > .navbox-title-pad, | |||
.navbox th.navbox-header > .navbox-header-pad { | |||
padding: 0 65px; | |||
} | |||
.navbox .navbox-subgroup { | |||
border-spacing: 0; | |||
width: 100%; | |||
} | |||
.navbox .navbox-subgroup-with-title { | |||
text-align: center; | |||
} | |||
.navbox .navbox-gutter { | |||
height: 2px; | |||
} | |||
.navbox .navbox-section-row > td { | |||
padding: 0; | |||
height: 100%; | |||
} | |||
.navbox .navbox-section { | |||
width: 100%; | |||
border-spacing: 0; | |||
text-align: center; | |||
} | |||
.navbox .navbox-above, | |||
.navbox .navbox-below { | |||
background: var(--navbox-header-color, #DDF); | |||
text-align: center; | |||
} | |||
.navbox .navbox-above td, | |||
.navbox .navbox-below td { | |||
padding: 2px 4px; | |||
} | |||
.navbox .navbox-image { | |||
background: var(--navbox-bg-color, white); | |||
text-align: center; | |||
} | |||
.navbox .navbox-group, | |||
.navbox .navbox-header, | |||
.navbox .navbox-subgroup .navbox-title { | |||
background: var(--navbox-header-color, #DDF); | |||
color: var(--navbox-text-color, black); | |||
font-weight: bold; | |||
height: 100%; | |||
padding: 2px 0; | |||
} | |||
.navbox .navbox-header { | |||
text-align: center; | |||
} | |||
.navbox .navbox-group { | |||
text-align: right; | |||
padding-left: 1em; | |||
padding-right: 1em; | |||
word-wrap: normal; | |||
} | |||
.skin-fandomdesktop .navbox .navbox-group { | |||
white-space: nowrap; | |||
} | |||
.navbox .navbox-group, | |||
.navbox .navbox-image-left { | |||
border-right: 2px solid var(--navbox-bg-color, white); | |||
} | |||
.navbox .navbox-image-right { | |||
border-left: 2px solid var(--navbox-bg-color, white); | |||
} | |||
.navbox .navbox-list { | |||
text-align: center; | |||
} | |||
.navbox .navbox-group + .navbox-list, | |||
.navbox .navbox-group + .navbox-list > table:not(.navbox-subgroup-with-title) > tbody > tr > .navbox-list { | |||
text-align: left; | |||
} | |||
.navbox .navbox-list { | |||
background: var(--navbox-bg-color, white); | |||
color: var(--navbox-text-color, black); | |||
width: 100%; | |||
height: 100%; | |||
padding: 0; | |||
} | |||
.navbox .alt > .navbox-list { | |||
background: var(--navbox-alt-color, #F7F7F7); | |||
} | |||
.navbox .navbox-list > div { | |||
padding: 0px 4px; | |||
} | |||
.navbox .hlist dl, | |||
.navbox .hlist ol, | |||
.navbox .hlist ul { | |||
font-size: inherit; | |||
} | |||
.navbox .navbox-list.no-group { | |||
padding-top: 2px; | |||
padding-bottom: 2px; | |||
} | |||
.navbox .mw-collapsible-toggle { | |||
width: 65px; | |||
} | |||
/* hlist */ | |||
.hlist dl, | |||
.hlist ol, | |||
.hlist ul { | |||
margin: 0; | |||
padding: 0; | |||
} | |||
/* Display list items inline */ | |||
.hlist dd, | |||
.hlist dt, | |||
.hlist li { | |||
margin: 0; /* don't trust the note that says margin doesn't work with inline | |||
* removing margin: 0 makes dds have margins again */ | |||
display: inline; | |||
} | |||
/* Display nested lists inline */ | |||
.hlist.inline, | |||
.hlist.inline dl, | |||
.hlist.inline ol, | |||
.hlist.inline ul, | |||
.hlist dl dl, | |||
.hlist dl ol, | |||
.hlist dl ul, | |||
.hlist ol dl, | |||
.hlist ol ol, | |||
.hlist ol ul, | |||
.hlist ul dl, | |||
.hlist ul ol, | |||
.hlist ul ul { | |||
display: inline; | |||
} | |||
/* Hide empty list items */ | |||
.hlist .mw-empty-li { | |||
display: none; | |||
} | |||
/* Generate interpuncts */ | |||
.hlist dt:after { | |||
content: ": "; | |||
} | |||
.hlist dd:after, | |||
.hlist li:after { | |||
content: " · "; | |||
font-weight: bold; | |||
} | |||
.hlist dd:last-child:after, | |||
.hlist dt:last-child:after, | |||
.hlist li:last-child:after { | |||
content: none; | |||
} | |||
/* Add parentheses around nested lists */ | |||
.hlist dd dd:first-child:before, | |||
.hlist dd dt:first-child:before, | |||
.hlist dd li:first-child:before, | |||
.hlist dt dd:first-child:before, | |||
.hlist dt dt:first-child:before, | |||
.hlist dt li:first-child:before, | |||
.hlist li dd:first-child:before, | |||
.hlist li dt:first-child:before, | |||
.hlist li li:first-child:before { | |||
content: " ("; | |||
font-weight: normal; | |||
} | |||
.hlist dd dd:last-child:after, | |||
.hlist dd dt:last-child:after, | |||
.hlist dd li:last-child:after, | |||
.hlist dt dd:last-child:after, | |||
.hlist dt dt:last-child:after, | |||
.hlist dt li:last-child:after, | |||
.hlist li dd:last-child:after, | |||
.hlist li dt:last-child:after, | |||
.hlist li li:last-child:after { | |||
content: ")"; | |||
font-weight: normal; | |||
} | |||
/* Put ordinals in front of ordered list items */ | |||
.hlist ol { | |||
counter-reset: listitem; | |||
} | |||
.hlist ol > li { | |||
counter-increment: listitem; | |||
} | |||
.hlist ol > li:before { | |||
content: " " counter(listitem) "\a0"; | |||
} | |||
.hlist dd ol > li:first-child:before, | |||
.hlist dt ol > li:first-child:before, | |||
.hlist li ol > li:first-child:before { | |||
content: " (" counter(listitem) "\a0"; | |||
} | |||
.plainlist ol, | |||
.plainlist ul { | |||
line-height: inherit; | |||
list-style: none; | |||
margin: 0; | |||
padding: 0; /* Reset Minerva default */ | |||
} | |||
.plainlist ol li, | |||
.plainlist ul li { | |||
margin-bottom: 0; | |||
} | |||
/*CS added this^^^ */ | |||
/* | /* | ||
canada's cosmostweaks | canada's cosmostweaks | ||
| Line 14: | Line 506: | ||
/* ----------------- vvv replace this part for light mode colors vvv------------------------*/ | /* ----------------- vvv replace this part for light mode colors vvv------------------------*/ | ||
--main-background-color: rgb(26, 26, 26); | --main-background-color: rgb(26, 26, 26); | ||
--content-background-color: | --content-background-color: rgba(255, 252, 244, 1); | ||
--text-color: rgb( | --text-color: rgb(61, 44, 35, 1); | ||
--link-color: | --link-color: rgba(111, 74, 131, 1); | ||
--banner-color: | --banner-color: rgba(104, 65, 125, 1); | ||
--banner-text-color: rgb( | --banner-text-color: rgb(255, 255, 255); | ||
--header-color: | --header-color: rgba(54, 64, 118, 0); | ||
--header-text-color: rgb( | --header-text-color: rgb(255, 255, 255); | ||
--button-color: | --button-color: rgba(104, 83, 68, 1); | ||
--button-text-color: rgb( | --button-text-color: rgb(255, 255, 255); | ||
--footer-color: rgba( | --footer-color: rgba(138, 125, 112, 1); | ||
/* -----------------------^^^ replace this part ^^^ ------------------------------------------------*/ | /* -----------------------^^^ replace this part ^^^ ------------------------------------------------*/ | ||
| Line 35: | Line 527: | ||
/* --------------- vvv replace this part for dark mode colors vvv------------------------------*/ | /* --------------- vvv replace this part for dark mode colors vvv------------------------------*/ | ||
--main-background-color: #444; | --main-background-color: #444; | ||
--content-background-color: # | --content-background-color: #161420; | ||
--text-color: #ddd; | --text-color: #ddd; | ||
--link-color: # | --link-color: #DEA501; | ||
--banner-color: # | --banner-color: #37123c; | ||
--banner-text-color: # | --banner-text-color: #dcdbdb; | ||
--header-color: | --header-color: rgba(54, 64, 118, 0); | ||
--header-text-color: # | --header-text-color: #dcdbdb; | ||
--button-color: # | --button-color: #37123c; | ||
--button-text-color: # | --button-text-color: #dcdbdb; | ||
--footer-color: # | --footer-color: #100D18; | ||
/* ---------------------^^^ replace this part ^^^ ------------------------------------*/ | /* ---------------------^^^ replace this part ^^^ ------------------------------------*/ | ||
} | } | ||
| Line 93: | Line 583: | ||
/* -------------------------- general ------------------------- */ | /* -------------------------- general ------------------------- */ | ||
/* ----------[CS added this part]------*/ | |||
body { | .mw-body p { | ||
line-height: 1.6; | |||
margin: 0.5em 0 1em 0; | |||
} | } | ||
.imagedropshadow { | |||
filter:drop-shadow(0 3px 2px #290B18); | |||
} | } | ||
/* ----------[^^^CS added this part^^^]------*/ | |||
#mw-content, | #mw-content, | ||
.mw-prefs-buttons, | .mw-prefs-buttons, | ||
| Line 1,249: | Line 1,732: | ||
/* ------------------------------------------- rail hiding -------------------------------------- */ | /* ------------------------------------------- rail hiding -------------------------------------- */ | ||
#CosmosRailWrapper { | #CosmosRailWrapper { | ||
width:340px | width:240px; | ||
/*^^^CS changed the value from 340px to this*/ | |||
margin-right:-40px; | margin-right:-40px; | ||
transition: width 0.3s; | transition: width 0.3s; | ||
background-color:var(--transparent-grey) | background-color:var(--content-background-color); | ||
/*CS changed the background-color from var(--transparent-grey) to this*/ | |||
} | } | ||
#CosmosRail { | #CosmosRail { | ||
min-width:340px | min-width:240px; | ||
/*^^^CS changed the value from 340px to this*/ | |||
} | } | ||
.ct- | .cosmos-articleContainer:not(.ct-railshown) #CosmosRailWrapper { | ||
width: 20px; | width: 20px; | ||
} | } | ||
.ct- | .cosmos-articleContainer:not(.ct-railshown) #CosmosRail { | ||
display:none; | display:none; | ||
} | } | ||
| Line 1,266: | Line 1,752: | ||
transition: width 0.3s; | transition: width 0.3s; | ||
} | } | ||
.ct- | .cosmos-articleContainer:not(.ct-railshown) #cosmos-pageBody-content { | ||
width:100%; | width:100%; | ||
} | } | ||
| Line 1,285: | Line 1,771: | ||
box-shadow:0 3px 5px rgba(0,0,0,0.1); | box-shadow:0 3px 5px rgba(0,0,0,0.1); | ||
} | } | ||
.ct- | .cosmos-articleContainer:not(.ct-railshown) .ct-railtoggle { | ||
background-color:var(--content-background-color); | background-color:var(--content-background-color); | ||
} | } | ||
| Line 1,304: | Line 1,790: | ||
display:none; | display:none; | ||
} | } | ||
.ct- | |||
.cosmos-articleContainer:not(.ct-railshown) .ct-railtoggle::before { | |||
content: "Show rail"; | content: "Show rail"; | ||
} | } | ||
| Line 1,324: | Line 1,811: | ||
transition: transform 0.3s; | transition: transform 0.3s; | ||
} | } | ||
.ct- | .cosmos-articleContainer:not(.ct-railshown) .ct-railtoggle::after { | ||
transform: rotate(45deg) translate(3px, -3px); | transform: rotate(45deg) translate(3px, -3px); | ||
} | } | ||
| Line 1,357: | Line 1,844: | ||
} | } | ||
} | } | ||
/* ---------CS added this vvvvv------------- */ | |||
@media only screen and (min-width: 1084px) { | |||
#cosmos-pageBody-content { | |||
width: calc(100% - 220px); | |||
} | |||
} | |||
/* --------CS added this^^^----------- */ | |||
/* ------------------------------------------- toolbar dropups -------------------------------------- */ | /* ------------------------------------------- toolbar dropups -------------------------------------- */ | ||
.cosmos-tools-list > ul > li:not(:last-of-type) { | .cosmos-tools-list > ul > li:not(:last-of-type) { | ||