mirror of https://github.com/dirtbags/moth.git
Add merged scoreboard.css
This commit is contained in:
parent
34e51848be
commit
b293a9f0e9
|
@ -5,6 +5,116 @@
|
|||
}
|
||||
}
|
||||
|
||||
#rankings span {
|
||||
font-size: 75%;
|
||||
display: inline-block;
|
||||
overflow: hidden;
|
||||
height: 1.7em;
|
||||
}
|
||||
#rankings span.teamname {
|
||||
font-size: inherit;
|
||||
color: white;
|
||||
text-shadow: 0 0 3px black;
|
||||
opacity: 0.8;
|
||||
position: absolute;
|
||||
right: 0.2em;
|
||||
background-color: #292929;
|
||||
background-blend-mode: darken;
|
||||
padding: 0em 0.2em;
|
||||
border-top-left-radius: 0.5em;
|
||||
border-bottom-left-radius: 0.5em;
|
||||
margin:0em;
|
||||
height: 1.5em;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
transition-property: max-width;
|
||||
transition-duration: 2s;
|
||||
transition-delay: 0s;
|
||||
}
|
||||
|
||||
#rankings span.teamname:hover {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
#rankings span.teampoints {
|
||||
font-size:100%;
|
||||
height:1.2em;
|
||||
margin:0em;
|
||||
padding:0em;
|
||||
width:99%;
|
||||
}
|
||||
|
||||
/* Responsive design */
|
||||
/* Defaults */
|
||||
#rankings span.teampoints {
|
||||
max-width:89%;
|
||||
}
|
||||
#rankings span.teamname {
|
||||
max-width:10%;
|
||||
}
|
||||
|
||||
|
||||
/* Monitors with large enough screens to do side by side */
|
||||
@media only screen and (min-width: 170em) {
|
||||
#chart, #rankings {
|
||||
width: 49%;
|
||||
display:inline-block;
|
||||
vertical-align:middle;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
/* Monitor
|
||||
@media only screen and (max-width: 130em) {
|
||||
#chart, #rankings {
|
||||
width: 49%;
|
||||
display:inline-block;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
#rankings span.teampoints {
|
||||
max-width:89%;
|
||||
}
|
||||
#rankings span.teamname {
|
||||
max-width:10%;
|
||||
}
|
||||
}
|
||||
|
||||
/* Laptop size screen */
|
||||
@media only screen and (max-width: 100em) {
|
||||
#rankings span.teampoints {
|
||||
max-width:84%;
|
||||
}
|
||||
#rankings span.teamname {
|
||||
max-width:15%;
|
||||
}
|
||||
}
|
||||
|
||||
/* Roughly Tablet size */
|
||||
@media only screen and (max-width: 70em) {
|
||||
#rankings span.teampoints {
|
||||
max-width:79%;
|
||||
}
|
||||
#rankings span.teamname {
|
||||
max-width:20%;
|
||||
}
|
||||
}
|
||||
|
||||
/* Small screens phone size */
|
||||
@media only screen and (max-width: 40em) {
|
||||
#rankings span.teampoints {
|
||||
max-width:65%;
|
||||
}
|
||||
#rankings span.teamname {
|
||||
max-width:34%;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
#chart {
|
||||
background-color: rgba(0, 0, 0, 0.8);
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue