From eeedb40bdc0510dec0e2ddca149e82bff7495d0a Mon Sep 17 00:00:00 2001 From: Daniel Friesel Date: Mon, 20 Apr 2020 20:20:52 +0200 Subject: switch to a proper dark theme using javascript and sass The dark=1 option is still supported, but no longer visible in the UI. --- public/static/css/app.css | 869 ---------------------------------------------- 1 file changed, 869 deletions(-) delete mode 100644 public/static/css/app.css (limited to 'public/static/css/app.css') diff --git a/public/static/css/app.css b/public/static/css/app.css deleted file mode 100644 index 5ea9767..0000000 --- a/public/static/css/app.css +++ /dev/null @@ -1,869 +0,0 @@ -body { - margin: 0; -} - -html { - font-family: Sans-Serif; -} - -a { - color: #000099; - text-decoration: none; -} - -p, -div.about, -div.input-field, -div.notes { - max-width: 94%; - margin-left: auto; - margin-right: auto; -} - -p { - text-align: justify; -} - -div.content { - width: 100%; - margin: 0; -} - -.wagonorder { - position: relative; - width: 100%; - height: 100ex; -} - -.wagonorder .section { - position: absolute; - left: 1em; - width: 2em; - text-align: center; -} - -.wagonorder .wagon { - position: absolute; - left: 3em; - min-width: 6em; - border: 1px solid #999999; - padding-left: 0.2em; - padding-right: 0.2em; -} - -.wagonorder .wagon ~ .wagon { - border-top: none; -} - -.wagonorder .wagon .material-icons { - color: #666666; -} - -.wagonorder .wagon .direction { - position: absolute; - left: 0.2em; - bottom: 0; - right: 0; - text-align: center; - color: #666666; -} - -.wagonorder .nondestwagon { - border-style: dashed; -} - -.wagonorder .details { - position: absolute; - padding-top: 0.5ex; - left: 10em; - right: 0em; -} - -.wagonorder .details .type { - display: inline-block; - width: 5em; - color: #666666; -} - -.wagonorder .details .uicunknown { - color: #999999; -} - -.wagonorder .details .uicexchange { - margin-right: 0.2em; - color: #999999; -} - -.wagonorder .details .uiccountry { - margin-right: 0.2em; - color: #999999; -} - -.wagonorder .details .uic5 { - margin-right: 0.2em; - color: #999999; -} - -.wagonorder .details .uic56 { - color: #666666; - font-weight: bold; -} - -.wagonorder .details .uic78 { - margin-right: 0.2em; - color: #666666; - font-weight: bold; -} - -.wagonorder .details .uic78::before { - content: "-"; -} - -.wagonorder .details .uictype { - margin-right: 0.2em; - color: #666666; - font-weight: bold; -} - -.wagonorder .details .uicno { - color: #666666; -} - -.wagonorder .details .uiccheck { - color: #999999; -} - -.wagonorder .details .uiccheck::before { - content: "-"; -} - -div.app { - border-width:1px 2px; - width:100%; - margin-bottom: 5em; -} - -div.app > ul { - position:relative; - width:100%; - - list-style-type:none; - margin:0; - padding:0; -} - -div.app > ul > li { - min-height:7em; - display:block; - width:100%; - position:relative; - cursor: pointer; -} - -div.appdark > ul > li { - border-bottom: 1px solid #999999; - background-color: #000000; -} - -div.applight > ul > li { - border-bottom: 1px solid #999999; - background-color: #ffffff; -} - -div.app li .line { - font-size: 2.7em; - position:absolute; - bottom:5px; - left:2px; - max-width: 6em; - max-height: 3ex; - overflow: hidden; -} - -div.app li .line .trainsubtype { - font-weight: normal; - font-size: 70%; - position: relative; - vertical-align: baseline; - top: -0.6ex; - left: -0.5ex; -} - -div.app li .line .trainno { - font-weight: normal; -} - -div.app li .line .trainno_sub { - font-weight: normal; - font-size: 0.6em; - text-align: center; - margin-top: -0.2em; -} - -div.app li .sbahn .trainno_sub { - font-weight: normal; - font-size: 0.5em; - text-align: center; - margin-top: -0.25em; -} - -div.app li .lineinfo { - color:#000000; - font-size: 2em; - position:absolute; - top:0px; - left:2px; -} - -div.app .replacement { - color: #006600; -} - -div.app .replaced { - color: #660000; -} - -div.app .sbahn { - font-weight:bold; - border-radius: 30px; - padding:3px 6px 2px 6px; -} - -div.applight .sbahn { - background-color:#95d79f; -} - -div.appdark .sbahn { - background-color:#115511; -} - -div.app .bahn, -div.app .fern, -div.app .ext { - font-weight:bold; - border-radius: 5px; - padding:3px 5px 2px 5px; -} - -div.applight .bahn { - background-color: #eeeeee; -} - -div.appdark .bahn { - background-color: #333333; -} - -div.applight .fern { - background-color: #ffdddd; -} - -div.appdark .fern { - background-color: #551111; -} - -div.applight .ext { - background-color: #ffdddd; - border: 2px solid #ff6666; -} - -div.appdark .ext { - background-color: #551111; - border: 2px solid #993333; -} - -div.app li .route { - background-color: transparent; - font-size:2.1em; - position:absolute; - top:1px; - left:7.7em; - height: 1.2em; - width: 70%; - overflow: hidden; -} - -div.applight li .route { - color:#444444; -} - -div.appdark li .route { - color:#bbbbbb; -} - -div.app li .info { - color:#ff0000; - background-color: transparent; - font-size:2.1em; - position:absolute; - top:1px; - left:7.7em; - height: 1.2em; - width: 70%; - overflow: hidden; -} - -div.app .moreinfo { - font-size:2.1em; - position:fixed; - left:0; - right:0; - bottom:0em; - z-index: 5; - overflow: auto; - cursor: default; -} - -div.app .moreinfo .mheader, -div.app .moreinfo .mfooter { - max-width: 50em; - margin-left: auto; - margin-right: auto; -} - -div.applight .moreinfo { - background-color: #ffffff; -} - -div.appdark .moreinfo { - background-color: #000000; -} - -div.app .collapsed-moreinfo { - display: none; -} - -div.app .expanded-moreinfo { - display: block; -} - -div.app .moreinfo .mheader { - text-align: center; - font-size: 120%; - padding-top: 0.5em; - padding-bottom: 0.5em; - padding-left: 1em; - padding-right: 1em; - border-bottom: 0.1em dashed #cccccc; -} - -div.app .moreinfo .mfooter { - padding-top: 1em; - padding-left: 1em; - padding-right: 1em; -} - -div.app .moreinfo .loading { - text-align: center; - width: 100%; - color: #888888; -} - -div.app .moreinfo .reason, -div.app .moreinfo .minfo { - color: #ff0000; -} - -div.app .moreinfo .verbose { - margin-bottom: 0.6em; -} - -div.app .moreinfo .timeinfo { - margin-bottom: 0.6em; -} - -div.applight .moreinfo .mroute .important-stop { - color: #000000; -} - -div.appdark .moreinfo .mroute .important-stop { - color: #ffffff; -} - -div.applight .moreinfo .mroute .generic-stop { - color: #555555; -} - -div.appdark .moreinfo .mroute .generic-stop { - color: #999999; -} - -div.applight .moreinfo .mroute .additional-stop { - color: #009900; -} - -div.appdark .moreinfo .mroute .additional-stop { - color: #009900; -} - -div.applight .moreinfo .mroute .cancelled-stop { - color: #cc0000; -} - -div.appdark .moreinfo .mroute .cancelled-stop { - color: #cc0000; -} - -div.app li .dest { - background-color: transparent; - font-size:4em; - position:absolute; - top:0.62em; - left:4em; - bottom:0px; - width: 70%; - overflow: hidden; -} - -div.applight li .dest { - color:#000000; -} - -div.appdark li .dest { - color:#ffffff; -} - -div.applight li.cancelled { - background-color: #ffe7d0; -} - -div.appdark li.cancelled { - background-color: #512f00; -} - -div.app li .countdown { - background-color: transparent; - font-size: 3em; - position: absolute; - right: 5px; - bottom: 2px; - padding-left: 0.2em; -} - -div.applight li .countdown { - color: #000000; -} - -div.appdark li .countdown { - color: #ffffff; -} - -div.app li .header { - color:#000000; - font-size:2em; - font-weight:bold; - padding-top:8px; - border-width-top:0; - display:block; - text-align:center; -} - -div.app li .head { - border-bottom-width:0; -} - -div.app li .countdown .delay { - font-size:1em; - color:#FF0000; - background-color: transparent; - padding-right:7px; -} - -div.app li .countdown .undelay { - font-size:1em; - color:#006600; - padding-right:7px; -} - -div.app li .countdown .delaynorm { - font-size:0.9em; - color:#BB3333; - padding-right:7px; -} - -div.app li .countdown .undelaynorm { - font-size:0.9em; - color:#338833; - padding-right:7px; -} - -div.app li .countdown .platform { - font-weight: bold; -} - -div.app li .countdown .changed-platform { - color:#ff0000; -} - -div.app li .time { - background-color: transparent; - font-size:2.3em; - position:absolute; - right:5px; - top:4px; - padding-left: 0.2em; -} - -div.applight li .time { - color:#000000; -} - -div.appdark li .time { - color:#ffffff; -} - -div.app span.delayed { - color: #ff0000; - background-color: transparent; -} - -ul.ui-autocomplete { - max-height: 20em; - overflow-x: hidden; - overflow-y: auto; -} - -div.geolocation { - text-align: center; -} - -div.candidatestatus { - text-align: center; - color: #999999; -} - -div.candidatelist a { - display: block; - text-decoration: none; - font-size: 1.4em; - padding-top: 0.3em; - text-align: center; - border-bottom: 1px solid #999999; -} - -div.candidatelist a .distance:after { - content: " km"; -} - -div.candidatelist a .distance { - font-size: 0.6em; - color: #999999; - padding-top: 0.2em; - padding-bottom: 0.3em; -} - -div.about { - margin-top: 2em; - font-family: Sans-Serif; - color: #666666; -} - -div.about a { - color: #000066; - text-decoration: none; -} - -.notice { - padding: 15px; - margin-bottom: 20px; - border: 1px solid #bce8f1; - border-radius: 4px; - color: #31708f; - background-color: #d9edf7; - margin-left: auto; - margin-right: auto; -} - -.warning { - padding: 15px; - margin-bottom: 20px; - border: 1px solid #faebcc; - border-radius: 4px; - color: #8a6d3b; - background-color: #fcf8e3; - margin-left: auto; - margin-right: auto; -} - -.error { - padding: 15px; - margin-bottom: 20px; - border: 1px solid #ebccd1; - border-radius: 4px; - color: #a94442; - background-color: #f2dede; - margin-left: auto; - margin-right: auto; -} - -.error .errcode { - font-family: Monospace; - margin-top: 2em; - font-size: 100%; - color: #aaaaaa; -} - -.container { - max-width: 60em; - margin-left: auto; - margin-right: auto; -} - -pre { - margin-bottom: 2em; -} - -span.optional, -span.notes { - color: #666666; -} - -.moresettings-header { - cursor: pointer; -} - -.moresettings-header-collapsed:before { - content: "▹ " -} - -.moresettings-header-expanded:before { - content: "▿ " -} - -.moresettings-collapsed { - display: none; -} - -.moresettings-expanded { - display: block; -} - -.developers-header { - cursor: pointer; -} - -.developers-header-collapsed:before { - content: "▹ " -} - -.developers-header-expanded:before { - content: "▿ " -} - -.developers-collapsed { - display: none; -} - -.developers-expanded { - display: block; -} - -div.break { - height: 1em; -} - -div.field { - margin-top: 0.3em; - margin-bottom: 0.6em; -} - -input, select, .button { - display: inline-block; - width: 60em; - max-width: 100%; - min-height: 1.8em; - border-radius: 4px; - color: #000; - background-color: #fff; - border: 1px solid #ccc; - box-shadow: inset 0 1px 1px rgba(0,0,0,.075); - font-size: 90%; - text-align: center; - vertical-align: middle; -} - -input[type="text"] { - width: 59em; - padding-left: 0.5em; - padding-right: 0.5em; - text-align: left; - box-sizing: border-box; -} - -select { - min-height: 2em; -} - -input[type="checkbox"] { - width: 1.5em; - box-shadow: none; -} - -input[type="submit"], .button { - color: #fff; - background-color: #337ab7; - border-color: #2e6da4; - cursor: pointer; - box-shadow: none; - padding-top: 0.9ex; - padding-bottom: 0.9ex; -} - -.button { - padding-top: 1.1ex; - padding-bottom: 0; -} - -input[type="submit"]:active, -input[type="submit"]:focus, -input[type="submit"]:hover, -.button:active, -.button:focus, -.button:hover { - color: #fff; - background-color: #286090; - border-color: #204d74; -} - -input[type="submit"]:active, -.button.active { - box-shadow: inset 0 3px 5px rgba(0,0,0,.125); -} - -.button-light { - color: #333; - background-color: #fff; - border-color: #ccc; -} - -.button-light:active, -.button-light:focus, -.button-light:hover -{ - color: #333; - background-color: #e6e6e6; - border-color: #adadad; -} - -div.notes { - margin-top: 2em; -} - -div.notes ul { - margin-top: 1em; -} -div.app { - max-width: 60em; - margin-left: auto; - margin-right: auto; -} - -.navbar-fixed { - position: relative; - z-index: 997; -} - -.navbar-fixed nav { - position: fixed; -} - -nav { - box-shadow: 0 2px 2px 0 rgba(0,0,0,.14), 0 3px 1px -2px rgba(0,0,0,.12), 0 1px 5px 0 rgba(0,0,0,.2); -} - -nav { - width: 100%; - overflow: hidden; -} - -nav .nav-wrapper { - position: relative; - height: 100%; -} - -nav i, nav i.material-icons { - display: block; - font-size: 24px; -} - -nav .brand-logo { - position: absolute; - display: inline-block; - padding-left: 0.5rem; - z-index: -1; -} - -nav ul { - margin: 0; - padding-left: 0; - list-style-type: none; -} - -nav ul li { - transition: background-color .3s; - float: left; - padding: 0; - list-style-type: none; - background-color: #00838f; -} - -nav ul a { - transition: background-color .3s; - font-size: 1rem; - color: #fff; - display: block; - padding: 0 15px; - cursor: pointer; -} - -@media only screen and (max-width: 600px) { - div.app > ul > li { - font-size: 35%; - } - div.navbar-fixed { - height: 56px; - } - .moreinfo { - top: 56px; - } - nav { - height: 56px; - line-height: 56px; - } - nav .brand-logo { - font-size: 1.5rem; - } - nav .nav-wrapper i { - height: 56px; - line-height: 56px; - } -} - -@media only screen and (min-width: 600px) { - div.app > ul > li { - font-size: 40%; - } - div.navbar-fixed { - height: 64px; - } - .moreinfo { - top: 64px; - } - nav { - height: 64px; - line-height: 64px; - } - nav .brand-logo { - font-size: 2.1rem; - } - nav .nav-wrapper i { - height: 64px; - line-height: 64px; - } -} - -div.app .moreinfo { - font-size: 100%; -} - -.content { -} -- cgit v1.2.3