This repository has been archived on 2023-10-27. You can view files and clone it, but cannot push or open issues or pull requests.
scoresaber-reloaded/public/assets/theme/ssr.css

223 lines
7.0 KiB
CSS
Raw Normal View History

2023-10-17 20:42:37 +00:00
:root {
2023-10-17 22:38:18 +00:00
--background: #222;
2023-10-18 03:39:49 +00:00
--foreground: #2e2e2e;
2023-10-17 22:38:18 +00:00
--textColor: #eee;
--ppColour: #8992e8;
--alternate: #72a8ff;
--selected: #3273dc;
--hover: #333;
--highlight: #484848;
--decrease: #f94022;
--increase: #42b129;
--dimmed: #3e3e3e;
--faded: #666;
--color-ahead: rgb(0, 128, 0);
--color-behind: rgb(128, 0, 0);
--color-highlight: darkgreen;
--error: red;
2023-10-18 03:39:49 +00:00
--transparency: 0.95;
2023-10-17 20:42:37 +00:00
}
html {
2023-10-17 22:38:18 +00:00
height: --webkit-fill-available;
2023-10-17 20:42:37 +00:00
}
body {
2023-10-17 22:38:18 +00:00
color: var(--textColor);
margin: 0 auto;
padding: 0 1rem;
min-height: 100vh;
min-height: -webkit-fill-available;
2023-10-17 20:42:37 +00:00
}
select {
2023-10-17 22:38:18 +00:00
color: var(--textColor);
background-color: var(--foreground);
outline: none;
2023-10-17 20:42:37 +00:00
}
2023-10-18 03:39:49 +00:00
.main-background {
position: fixed;
display: block;
background: var(--background-image) !important;
filter: blur(4px) brightness(0.8);
background-size: cover !important;
}
2023-10-17 20:42:37 +00:00
.ssr-page-container {
2023-10-17 22:38:18 +00:00
width: 100%;
max-width: 1200px;
margin: 0 auto;
2023-10-18 03:39:49 +00:00
2023-10-18 05:05:52 +00:00
border-radius: 6px;
2023-10-18 03:39:49 +00:00
position: relative;
opacity: var(--transparency);
2023-10-17 20:42:37 +00:00
}
.box {
2023-10-17 22:38:18 +00:00
padding: 1rem;
2023-10-17 20:42:37 +00:00
}
.inc {
2023-10-17 22:38:18 +00:00
color: var(--increase);
2023-10-17 20:42:37 +00:00
}
.dec {
2023-10-17 22:38:18 +00:00
color: var(--decrease);
2023-10-17 20:42:37 +00:00
}
2023-10-17 22:38:18 +00:00
*[title]:not([title=""]):not(.clickable) {
cursor: help;
}
2023-10-17 20:42:37 +00:00
.scoresaber-icon {
2023-10-17 22:38:18 +00:00
width: 100%;
height: 100%;
background-size: cover;
background-repeat: no-repeat;
2023-10-18 04:23:58 +00:00
background-image: url("/assets/scoresaber-logo.svg");
2023-10-17 20:42:37 +00:00
}
.beatsavior-icon {
2023-10-17 22:38:18 +00:00
width: 100%;
height: 100%;
background-size: cover;
background-repeat: no-repeat;
background-image: url("data:image/svg+xml,%3Csvg xmlns:dc='http://purl.org/dc/elements/1.1/' xmlns:cc='http://creativecommons.org/ns%23' xmlns:rdf='http://www.w3.org/1999/02/22-rdf-syntax-ns%23' xmlns:svg='http://www.w3.org/2000/svg' xmlns='http://www.w3.org/2000/svg' xmlns:sodipodi='http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd' xmlns:inkscape='http://www.inkscape.org/namespaces/inkscape' width='72.723976mm' height='63.291668mm' viewBox='0 0 72.723976 63.291668' version='1.1' id='svg3827' sodipodi:docname='bsicon_ter.svg' inkscape:version='0.92.4 (5da689c313, 2019-01-14)'%3E%3Cdefs id='defs3821' /%3E%3Csodipodi:namedview id='base' pagecolor='%23ffffff' bordercolor='%23666666' borderopacity='1.0' inkscape:pageopacity='0.0' inkscape:pageshadow='2' inkscape:zoom='1.4' inkscape:cx='40.905424' inkscape:cy='61.353566' inkscape:document-units='mm' inkscape:current-layer='layer1' showgrid='false' inkscape:window-width='1920' inkscape:window-height='1017' inkscape:window-x='-8' inkscape:window-y='-8' inkscape:window-maximized='1' /%3E%3Cmetadata id='metadata3824'%3E%3Crdf:RDF%3E%3Ccc:Work rdf:about=''%3E%3Cdc:format%3Eimage/svg+xml%3C/dc:format%3E%3Cdc:type rdf:resource='http://purl.org/dc/dcmitype/StillImage' /%3E%3Cdc:title%3E%3C/dc:title%3E%3C/cc:Work%3E%3C/rdf:RDF%3E%3C/metadata%3E%3Cg inkscape:label='Calque 1' inkscape:groupmode='layer' id='layer1' style='opacity:1' transform='translate(-0.72553574,-0.71711111)'%3E%3Crect style='fill:%23000200;fill-opacity:1;stroke:%23000000;stroke-width:1.98928511;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:normal' id='rect4531' width='63.5' height='10.583332' x='5.4550524' y='10.242103' inkscape:export-xdpi='81.844757' inkscape:export-ydpi='81.844757' /%3E%3Crect style='fill:%23ffffff;fill-opacity:1;stroke:none;stroke-width:3.35483217;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:normal' id='rect4533' width='6.6145835' height='6.6145835' x='25.298788' y='11.565023' inkscape:export-xdpi='81.844757' inkscape:export-ydpi='81.844757' /%3E%3Crect style='fill:%23ffffff;fill-opacity:1;stroke:none;stroke-width:3.92078424;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:normal' id='rect4533-5' width='6.6145835' height='6.6145835' x='42.496708' y='11.565023' inkscape:export-xdpi='81.844757' inkscape:export-ydpi='81.844757' /%3E%3Cg id='g4614' transform='rotate(-23.417079,-23.695385,307.31208)' inkscape:export-xdpi='81.844757' inkscape:export-ydpi='81.844757'%3E%3Crect y='86.127083' x='125.67709' height='1.3229166' width='50.270832' id='rect4610' style='fill:%230000ff;fill-opacity:1;stroke:%230000ff;stroke-width:2.64583325;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1' /%3E%3Crect y='85.333328' x='109.80208' height='2.6458333' width='15.875' id='rect4605' style='fill:%23000000;fill-opacity:1;stroke:%23000000;stroke-width:2.64583325;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1' /%3E%3C/g%3E%3Cg transform='rotate(-156.98422,82.908484,73.919009)' id='g4614-3' inkscape:export-xdpi='81.844757' inkscape:export-ydpi='81.844757'%3E%3Crect y='86.127083' x='125.67709' height='1.3229166' width='50.270832' id='rect4610-6' style='fill:%23ff0000;fill-opacity:1;stroke:%23ff0000;stroke-width:2.64583325;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1' /%3E%3Crect y='85.333328' x='109.80208' height='2.6458333' width='15.875' id='rect4605-7' style='fill:%23000000;fill-opacity:1;stroke:%23000000;stroke-width:2.64583325;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1' /%3E%3C/g%3E%3C/g%3E%3C/svg%3E%0A");
2023-10-17 20:42:37 +00:00
}
.accsaber-icon {
2023-10-17 22:38:18 +00:00
width: 100%;
height: 100%;
background-size: cover;
background-repeat: no-repeat;
2023-10-18 04:23:58 +00:00
background-image: url("/assets/accsaber-logo.png");
2023-10-17 20:42:37 +00:00
}
.grid-transition-helper {
2023-10-17 22:38:18 +00:00
display: grid;
grid-template-columns: 1fr;
grid-template-rows: 1fr;
2023-10-17 20:42:37 +00:00
}
.grid-transition-helper > * {
2023-10-17 22:38:18 +00:00
grid-column: 1/1;
2023-10-17 20:42:37 +00:00
}
.grid-transition-helper > .row-0 {
2023-10-17 22:38:18 +00:00
grid-row: 1/1;
2023-10-17 20:42:37 +00:00
}
.grid-transition-helper > .row-1 {
2023-10-17 22:38:18 +00:00
grid-row: 2/2;
2023-10-17 20:42:37 +00:00
}
.grid-transition-helper > .row-2 {
2023-10-17 22:38:18 +00:00
grid-row: 3/3;
2023-10-17 20:42:37 +00:00
}
.grid-transition-helper > .row-3 {
2023-10-17 22:38:18 +00:00
grid-row: 4/4;
2023-10-17 20:42:37 +00:00
}
.grid-transition-helper > .row-4 {
2023-10-17 22:38:18 +00:00
grid-row: 5/5;
2023-10-17 20:42:37 +00:00
}
.grid-transition-helper > .row-5 {
2023-10-17 22:38:18 +00:00
grid-row: 6/6;
2023-10-17 20:42:37 +00:00
}
.grid-transition-helper > .row-6 {
2023-10-17 22:38:18 +00:00
grid-row: 7/7;
2023-10-17 20:42:37 +00:00
}
.grid-transition-helper > .row-7 {
2023-10-17 22:38:18 +00:00
grid-row: 8/8;
2023-10-17 20:42:37 +00:00
}
.grid-transition-helper > .row-8 {
2023-10-17 22:38:18 +00:00
grid-row: 9/9;
2023-10-17 20:42:37 +00:00
}
.grid-transition-helper > .row-9 {
2023-10-17 22:38:18 +00:00
grid-row: 10/10;
2023-10-17 20:42:37 +00:00
}
.grid-transition-helper > .row-10 {
2023-10-17 22:38:18 +00:00
grid-row: 11/11;
2023-10-17 20:42:37 +00:00
}
.grid-transition-helper > .row-11 {
2023-10-17 22:38:18 +00:00
grid-row: 12/12;
2023-10-17 20:42:37 +00:00
}
.has-pointer-events {
2023-10-17 22:38:18 +00:00
pointer-events: fill;
2023-10-17 20:42:37 +00:00
}
.mobile-only {
2023-10-17 22:38:18 +00:00
display: none;
2023-10-17 20:42:37 +00:00
}
.tablet-only {
2023-10-17 22:38:18 +00:00
display: none;
2023-10-17 20:42:37 +00:00
}
.up-to-tablet {
2023-10-17 22:38:18 +00:00
display: none;
2023-10-17 20:42:37 +00:00
}
@media screen and (max-width: 767px) {
2023-10-17 22:38:18 +00:00
.mobile-only {
display: block;
}
2023-10-17 20:42:37 +00:00
2023-10-17 22:38:18 +00:00
.tablet-and-up {
display: none !important;
}
2023-10-17 20:42:37 +00:00
}
@media screen and (max-width: 768px) {
2023-10-17 22:38:18 +00:00
.above-tablet {
display: none;
}
2023-10-17 20:42:37 +00:00
}
2023-10-17 22:38:18 +00:00
@media screen and (min-width: 768px) and (max-width: 1023px) {
.tablet-only {
display: block;
}
2023-10-17 20:42:37 +00:00
}
@media screen and (max-width: 1023px) {
2023-10-17 22:38:18 +00:00
.up-to-tablet {
display: block;
}
2023-10-17 20:42:37 +00:00
2023-10-17 22:38:18 +00:00
.desktop-and-up {
display: none !important;
}
2023-10-17 20:42:37 +00:00
}
@media screen and (min-width: 1750px) {
2023-10-17 22:38:18 +00:00
body:not(.slim) .ssr-page-container {
max-width: 1750px !important;
}
2023-10-17 20:42:37 +00:00
}
@media screen and (max-width: 360px) {
2023-10-17 22:38:18 +00:00
body {
padding: 0;
}
2023-10-17 20:42:37 +00:00
}
@media screen and (max-width: 320px) {
2023-10-17 22:38:18 +00:00
html {
font-size: 15px;
}
}