mirror of
https://github.com/danbee/tube-status-server
synced 2025-03-04 08:39:12 +00:00
107 lines
2.7 KiB
SCSS
107 lines
2.7 KiB
SCSS
$header-color: rgb(0, 25, 168);
|
|
|
|
@import "bourbon/bourbon";
|
|
@import "julep/julep";
|
|
|
|
@import "iconfont";
|
|
|
|
a {
|
|
text-decoration: none;
|
|
}
|
|
|
|
header {
|
|
@include header($header-color);
|
|
}
|
|
|
|
#refresh {
|
|
position: absolute;
|
|
right: 1em;
|
|
top: 0.3em;
|
|
font-family: "fontawesome";
|
|
@include button(desaturate(lighten($header-color, 25%), 20%));
|
|
}
|
|
|
|
footer {
|
|
@include tabbar(2);
|
|
}
|
|
|
|
.html5 section[role="main"] {
|
|
@include content(header, tabbar);
|
|
}
|
|
|
|
ul#line-list {
|
|
@include list;
|
|
li {
|
|
.messages {
|
|
padding: 1em 1.5em 0.5em;
|
|
font-size: 0.8em;
|
|
background: #222;
|
|
color: white;
|
|
@include box-shadow(inset 0 2px 8px black);
|
|
p {
|
|
padding-bottom: 1em;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
li {
|
|
.name {
|
|
text-shadow: none;
|
|
padding: 0.2em 0.5em;
|
|
font-weight: normal;
|
|
border-radius: 3px;
|
|
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2), inset 0 0 3px rgba(255, 255, 255, 0.6);
|
|
border: 1px solid rgba(0, 0, 0, 0.1);
|
|
}
|
|
.status { float: right; text-transform: capitalize; font-size: 0.8em; font-weight: bold; padding-top: 0.1em; }
|
|
.message-count {
|
|
padding: 0 0.2em 0.4em;
|
|
text-shadow: none;
|
|
width: 1.6em;
|
|
height: 1.6em;
|
|
border: 2px solid white;
|
|
text-align: center;
|
|
margin-left: 0.5em;
|
|
font-weight: normal;
|
|
font-size: 0.9em;
|
|
float: right;
|
|
background: black;
|
|
color: white;
|
|
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
|
|
border-radius: 1em;
|
|
}
|
|
.good-service { color: green; }
|
|
.special-service { color: #000099; }
|
|
.part-suspended, .part-closure, .minor-delays { color: #CC9900; }
|
|
.major-delays { color: #CC0000; }
|
|
}
|
|
|
|
$bakerloo: #B36305;
|
|
$central: #E32017;
|
|
$circle: #FFD300;
|
|
$district: #00782A;
|
|
$hammersmithcity: #F3A9BB;
|
|
$jubilee: #A0A5A9;
|
|
$metropolitan: #9B0056;
|
|
$northern: #000000;
|
|
$piccadilly: #003688;
|
|
$victoria: #0098D4;
|
|
$waterloocity: #95CDBA;
|
|
$dlr: #00A4A7;
|
|
$overground: #EE7C0E;
|
|
$tramlink: #84B817;
|
|
|
|
#bakerloo .name { background: $bakerloo; color: white; border-width: 1px; }
|
|
#central .name { background: $central; color: white; }
|
|
#circle .name { background: $circle; color: rgb(17, 59, 146); }
|
|
#district .name { background: $district; color: white; }
|
|
#dlr .name { background: $dlr; color: white; }
|
|
#hammersmithcity .name { background: $hammersmithcity; color: rgb(17, 59, 146); }
|
|
#jubilee .name { background: $jubilee; color: white; }
|
|
#metropolitan .name { background: $metropolitan; color: white; }
|
|
#northern .name { background: $northern; color: white; }
|
|
#overground .name { background: $overground; color: white; }
|
|
#piccadilly .name { background: $piccadilly; color: white; }
|
|
#victoria .name { background: $victoria; color: white; }
|
|
#waterloocity .name { background: $waterloocity; color: rgb(17, 59, 146); }
|