Difference between revisions of "MediaWiki:Common.css"

From SgWiki
Jump to: navigation, search
m
m
Line 6: Line 6:
 
.leftarrow {clip-path:polygon(95% 0%, 70% 50%, 95% 100%, 70% 100%, 45% 50%, 70% 0%, 55% 0%, 30% 50%, 55% 100%, 30% 100%, 5% 50%, 30% 0%);}
 
.leftarrow {clip-path:polygon(95% 0%, 70% 50%, 95% 100%, 70% 100%, 45% 50%, 70% 0%, 55% 0%, 30% 50%, 55% 100%, 30% 100%, 5% 50%, 30% 0%);}
 
.rightarrow {clip-path:polygon(5% 0%, 30% 50%, 5% 100%, 30% 100%, 55% 50%, 30% 0%, 45% 0%, 70% 50%, 45% 100%, 70% 100%, 95% 50%, 70% 0%);}
 
.rightarrow {clip-path:polygon(5% 0%, 30% 50%, 5% 100%, 30% 100%, 55% 50%, 30% 0%, 45% 0%, 70% 50%, 45% 100%, 70% 100%, 95% 50%, 70% 0%);}
 +
 +
.exc {color:#00F;}
 +
.exc:hover {text-decoration:underline;}
  
 
span.Advisory {display:block;}
 
span.Advisory {display:block;}

Revision as of 19:28, 7 June 2019

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

table:not(.infobox) {border-collapse:collapse;}

.triangle {display:inline-block;height:50px;width:50px;text-align:center;line-height:60px;font-size:150%;clip-path:polygon(50% 0%, 100% 100%, 0% 100%);}
.leftarrow {clip-path:polygon(95% 0%, 70% 50%, 95% 100%, 70% 100%, 45% 50%, 70% 0%, 55% 0%, 30% 50%, 55% 100%, 30% 100%, 5% 50%, 30% 0%);}
.rightarrow {clip-path:polygon(5% 0%, 30% 50%, 5% 100%, 30% 100%, 55% 50%, 30% 0%, 45% 0%, 70% 50%, 45% 100%, 70% 100%, 95% 50%, 70% 0%);}

.exc {color:#00F;}
.exc:hover {text-decoration:underline;}

span.Advisory {display:block;}
span.Advisory.event {font-size:120%;text-align:center;}

@media ( min-width: 900px ) {
	div.dual {display:inline-block;margin:0 1%;width:48%;vertical-align:top;}
	div.dual:nth-of-type(2n+1) {margin-right:0;}
	div.dual:nth-of-type(2n) {margin-left:0;}
}

span.stncode {display:inline-block;border:2px solid #FFFFFF;height:18px;width:45px;text-align:center;line-height:18px;}
span.stncode.only {border-radius:10px;}
span.stncode.left {border-right:none;border-radius:10px 0 0 10px;}
span.stncode.center {border-left:none;border-right:none;}
span.stncode.right {border-left:none;border-radius:0 10px 10px 0;}

small span.stncode {height:14px;width:37px;line-height:14px;}
small span.stncode.only {border-radius:8px;}
small span.stncode.left {border-radius:8px 0 0 8px;}
small span.stncode.right {border-radius:0 8px 8px 0;}

div.busbox {display:inline-block;height:18px;width:45px;text-align:center;line-height:18px;}

div.train {margin:0;padding:0;text-align:center;}
div.train>span.car {display:inline-block;border:1px solid #888888;width:50px;height:16px;line-height:16px;}
div.train>span.left {border-radius:8px 0 0 0;}
div.train>span.right {border-radius:0 8px 0 0;}

table.infobox {border:1px solid darkgray;float:right;text-align:left;background-color:#F9F9F9;margin-left:1em;max-width:25.5em;}

table.layout {border-top:1px solid #888888;border-bottom:1px solid #888888;width:100%;}
table.layout>tr,table.layout>*>tr {border-top:1px solid #888888;vertical-align:top;}
table.layout>tr.restricted>td,table.layout>*>tr.restricted>td {color:#888888;}
table.layout>tr.construction,table.layout>*>tr.construction {color:#888888;}
table.layout>tr>td.platform,table.layout>*>tr>td.platform {border:2px solid black;text-align:center;}
table.layout>tr>td.platform.bottom,table.layout>*>tr>td.platform.bottom {border-top:1px solid #888888;}
table.layout>tr>td.platform.top,table.layout>*>tr>td.platform.top {border-bottom:1px solid #888888;}
table.layout>tr.track,table.layout>*>tr.track {border-top:none;}
table.layout table td small {line-height:1.1;}
table.layout table.right tr:first-of-type td:first-of-type,table.layout table.right2 tr:first-of-type td:nth-of-type(2) {padding-right:15px;padding-left:5px;border-radius:5px;background:#000000;color:#FFF;clip-path:polygon(0 0,calc(100% - 12px) 0,100% 50%,calc(100% - 12px) 100%,0 100%);}
table.layout table.left tr:first-of-type td:last-of-type,table.layout table.left2 tr:first-of-type td:last-of-type {padding-left:15px;padding-right:5px;border-radius:5px;background:#000000;color:#FFF;clip-path:polygon(100% 0,12px 0,0 50%,12px 100%,100% 100%);}
@media ( min-width: 900px ) {
	table.layout {width:65%;min-width:650px;}
}

table.traintiming {border:1px solid #000000;background:#F9F9F9;}
table.traintiming>tr>th,table.traintiming>*>tr>th {background:#EFEFEF;border:1px solid #A9A9A9;}
table.traintiming>tr:nth-of-type(n+3)>th,table.traintiming>*>tr:nth-of-type(n+3)>th {text-align:left;}
table.traintiming>tr>td,table.traintiming>*>tr>td {border:1px solid #A9A9A9;text-align:center;}

/* Operator and Line Colours Scheme */
.NSL {background:#D42E12 !important;color:#FFFFFF !important;}
.EWL {background:#009645 !important;color:#FFFFFF !important;}
.NEL {background:#9900AB !important;color:#FFFFFF !important;}
.CCL {background:#FA9E0D !important;color:#000000 !important;}
.DTL {background:#005EC4 !important;color:#FFFFFF !important;}
.TEL {background:#784008 !important;color:#FFFFFF !important;}
.JRL {background:#1E888C !important;color:#FFFFFF !important;}
.CRL {background:#93D500 !important;color:#000000 !important;}
.BPLRT,.SKLRT,.PGLRT {background:#708270 !important;color:#FFFFFF !important;}
.SE {background:#F16D9F !important;color:#FFFFFF !important}

.SBST {background:#5D1E79 !important;color:#FFFFFF !important;}
.SMRT {background:#E3031E !important;color:#FFFFFF !important;}
.TTS {background:#009548 !important;color:#FFFFFF !important;}
.GAS {background:#FFCC33 !important;color:#FD1E23 !important;}
.LTA {background:#004250 !important;color:#FFFFFF !important;}
.BUS {background:#97D700 !important;color:#000000 !important;}
.PAST {background:#808080 !important;color:#FFFFFF !important;}

.NSLtext {color:#D42E12 !important;}
.EWLtext {color:#009645 !important;}
.NELtext {color:#9900AB !important;}
.CCLtext {color:#FA9E0D !important;}
.DTLtext {color:#005EC4 !important;}
.TELtext {color:#784008 !important;}
.JRLtext {color:#1E888C !important;}
.CRLtext {color:#93D500 !important;}
.BPLRTtext,.SKLRTtext,.PGLRTtext {color:#708270 !important;}
.SEtext {color:#F16D9F !important;}

.NSL a,.EWL a,.NEL a,.CCL a,.DTL a,.TEL a,.JRL a,.CRL a,.BPLRT a,.SKLRT a,.PGLRT a,.SE a,.SBST a,.SMRT a,.TTS a,.GAS a,.LTA a,.BUS a {color:inherit !important;}

/* Customised sgWiki Theme
.mw-wiki-logo {background-image:url('/images/1/13/SgWiki_Logo_CNY.png') !important;}
.mw-wiki-logo {background-image:url('/images/5/5e/SgWiki_Logo_Christmas.png') !important;}
*/

.mw-wiki-logo {background-image:url('/images/3/3b/SgWiki_Logo.png') !important;}

/*Christmas
@keyframes christmas {
    0% {transform:translate3d(0,0,0) rotate(0) scale(.9,.9);}
    100% {transform:translate3d(30px,1000px,0) rotate(360deg) scale(1.1,1.1);}
}
div#bodyContent #snowflakes {position:fixed;pointer-events:none;top:-96px;left:0;right:0;bottom:0;width:100%;text-align:center;z-index:10;}
div#bodyContent #snowflakes i {display:inline-block;height:16px;width:16px;border-radius:50%;animation:christmas 3s linear 2s infinite;background-image:linear-gradient(180deg,rgba(255,255,255,0) 40%,#FFFFFF 40%,#FFFFFF 60%,rgba(255,255,255,0) 60%),linear-gradient(90deg,rgba(255,255,255,0) 40%,#FFFFFF 40%,#FFFFFF 60%,rgba(255,255,255,0) 60%),linear-gradient(45deg,rgba(255,255,255,0) 43%,#FFFFFF 43%,#FFFFFF 57%,rgba(255,255,255,0) 57%),linear-gradient(135deg,rgba(255,255,255,0) 43%,#FFFFFF 43%,#FFFFFF 57%,rgba(255,255,255,0) 57%);}
div#bodyContent #snowflakes i:nth-of-type(4n) {height:30px;width:30px;animation-duration:5.3s;transform-origin:-10px -20px;}
div#bodyContent #snowflakes i:nth-of-type(4n+1) {height:24px;width:24px;animation-duration:3.1s;transform-origin:10px -20px;}
div#bodyContent #snowflakes i:nth-of-type(4n+2) {height:10px;width:10px;animation-duration:1.7s;transform-origin:right -20px;}
div#bodyContent #snowflakes i:nth-of-type(3n) {animation-delay:2.3s;}
div#bodyContent #snowflakes i:nth-of-type(3n+1) {animation-delay:1.5s;}
div#bodyContent #snowflakes i:nth-of-type(3n+2) {animation-delay:3.4s;}
div#bodyContent #snowflakes i:nth-of-type(5n) {animation-timing-function:ease-in-out;}
div#bodyContent #snowflakes i:nth-of-type(5n+1) {animation-timing-function:ease-out;}
div#bodyContent #snowflakes i:nth-of-type(5n+2) {animation-timing-function:ease}
div#bodyContent #snowflakes i:nth-of-type(5n+3) {animation-timing-function:ease-in;}
div#bodyContent #snowflakes i:nth-of-type(5n+4) {animation-timing-function:linear;}
div#bodyContent #snowflakes i:nth-of-type(11n) {animation-timing-function:cubic-bezier(.2,.3,.8,.9);}
div#bodyContent #snowflakes i:nth-of-type(7n) {opacity:0.5;}
div#bodyContent #snowflakes i:nth-of-type(7n+2) {opacity:0.3;}
div#bodyContent #snowflakes i:nth-of-type(7n+4) {opacity:0.7;}
div#bodyContent #snowflakes i:nth-of-type(7n+6) {opacity:0.6;animation-timing-function:ease-in;transform-origin:left 10px;}
div#bodyContent #snowflakes i:nth-of-type(7n+1) {opacity:0.8;}
*/