diff options
author | Daniel Friesel <derf@finalrewind.org> | 2019-08-11 20:14:55 +0200 |
---|---|---|
committer | Daniel Friesel <derf@finalrewind.org> | 2019-08-11 20:14:55 +0200 |
commit | 75d5a9234353d50d90f853175bf9af5b41d42044 (patch) | |
tree | d0c252cb8ca989e39717e01770911f4944298175 /public/static/css | |
parent | 661f3d079c7643acac16ffa372c20d80ee42244b (diff) |
use asset versioning
Diffstat (limited to 'public/static/css')
-rw-r--r-- | public/static/css/display.css | 47 | ||||
-rw-r--r-- | public/static/css/infoscreen.css | 258 | ||||
-rw-r--r-- | public/static/css/main.css | 120 | ||||
-rw-r--r-- | public/static/css/mobile.css | 24 |
4 files changed, 449 insertions, 0 deletions
diff --git a/public/static/css/display.css b/public/static/css/display.css new file mode 100644 index 0000000..76280c5 --- /dev/null +++ b/public/static/css/display.css @@ -0,0 +1,47 @@ +@font-face { + font-family: VRRR; + src: url('/static/v1/fonts/VRRR.ttf'); +} + +body { + font-family: VRRR; + background-color: #000000; +} + +div.outer { + width: 12em; + margin-left: auto; + margin-right: auto; +} + +div.row { + position: relative; + margin-bottom: 0; + margin-top: 0; + padding-bottom: 0; + padding-top: 0; + width: 12em; + height: 0.68em; +} + +div.row div { + overflow: hidden; + position: absolute; + height: 100%; +} + +div.line { + left: 0; + width: 13%; +} + +div.dest { + left: 14%; + width: 67%; +} + +div.time { + right: 0; + width: 19%; + text-align: right; +} diff --git a/public/static/css/infoscreen.css b/public/static/css/infoscreen.css new file mode 100644 index 0000000..c2415be --- /dev/null +++ b/public/static/css/infoscreen.css @@ -0,0 +1,258 @@ +html { + font-family: Sans-Serif; +} + +div.displayclean { + background-color:#F8F8F8; + position:absolute; + top: 0; + left: 0; + border-width:1px 2px; + width:100%; +} + +div.displayclean > ul { + position:absolute; + width:100%; + + background-color: inherit; + + list-style-type:none; + margin:0; + padding:0; +} + +div.displayclean > ul > li { + height: 7em; + display:block; + border-bottom: 1px solid #999999; + width:100%; + position:relative; + background-color: inherit; +} + +div.displayclean li .line { + background-color: #eeeeee; + border-radius: 5px; + font-weight:bold; + font-size: 2.9em; + padding:3px 8px 2px 5px; + position:absolute; + bottom:5px; + left:2px; +} + +div.displayclean li .tram { + background-color:#ffcccc; +} + +div.displayclean li .sbahn { + background-color:#aaffba; + -webkit-border-radius: 30px; + -moz-border-radius: 30px; + border-radius: 30px; +} + +div.displayclean li .ubahn { + background-color:#aac0ff; +} + +div.displayclean li .bus { + background-color:#eeaaee; + -webkit-border-radius: 10px; + -moz-border-radius: 10px; + border-radius: 10px; +} + +div.displayclean li .route { + color:#444444; + font-size:2.1em; + position:absolute; + top:5px; + left:4.8em; + height:1em; + width: 70%; + overflow: hidden; +} + +div.displayclean li .dest { + color:#000000; + font-size:4em; + position:absolute; + top:0.65em; + left:2.5em; + bottom:-0.1em; + width: 70%; + overflow: hidden; +} + +div.displayclean li.cancelled { + background-color: #ffe7d0; +} + +div.displayclean li .countdown { + color:#000000; + background-color: inherit; + font-size:3em; + position:absolute; + right:5px; + bottom:2px; + padding-left: 0.2em; +} + +div.displayclean li .header { + color:#000000; + font-size:2em; + font-weight:bold; + padding-top:8px; + border-width-top:0; + display:block; + text-align:center; +} + +div.displayclean li .head { + border-bottom-width:0; +} + +div.displayclean li .countdown .delay { + font-size: 1em; + color:#FF0000; + background-color: inherit; + padding-right:7px; +} + +div.displayclean li > .time { + color:#444444; + background-color: inherit; + font-size: 2.4em; + position:absolute; + right:5px; + top:5px; + padding-left: 0.2em; +} + +div.displayclean li > .time > .platform { + color: black; + margin-left: 0.2em; +} + +div.displayclean li .moreinfo { + color:#000000; + font-size:2.1em; + position:fixed; + top:0em; + left:0em; + right:0em; + bottom:0em; + background-color: white; + z-index: 5; + display: none; + overflow: auto; +} + +div.displayclean li .collapsed-moreinfo { + display: none; +} + +div.displayclean li .expanded-moreinfo { + display: block; +} + +div.displayclean li .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.displayclean li .moreinfo .mfooter { + padding-top: 1em; + padding-left: 1em; + padding-right: 1em; +} + +div.displayclean li .moreinfo tr.routepre { + background-color: #dddddd; +} +div.displayclean li .moreinfo tr.routenow { + background-color: #eeeeee; +} +div.displayclean li .moreinfo tr.routepost { +} + +div.displayclean li .moreinfo td.time { + text-align: center; + margin-right: 0.5em; +} + +div.displayclean li .moreinfo .mroute { + margin-bottom: 0.6em +} + +div.displayclean li .moreinfo .mroute .separator { + color: #999999; +} + +div.displayclean li .moreinfo .mroute .important-stop { + color: #000000; +} + +div.displayclean li .moreinfo .mroute .generic-stop { + color: #555555; +} + +div.about { + font-family: Sans-Serif; + color: #666666; +} + +div.about a { + color: #000066; + text-decoration: none; +} + +div.error { + font-size: 150%; + font-weight: bold; + color: #ee0000; +} + +pre { + margin-bottom: 2em; +} + +span.optional, +span.notes { + color: #666666; +} + +div.break { + height: 1em; +} + +div.field { + width: 100%; + clear: both; +} + +div.field div.desc { + float: left; + width: 14em; + text-align: right; + padding-right: 0.5em; +} + +input, select { + border: 1px solid black; +} + +div.notes { + margin-top: 4em; +} + +div.notes ul { + margin-top: 1em; +} diff --git a/public/static/css/main.css b/public/static/css/main.css new file mode 100644 index 0000000..7eee1f3 --- /dev/null +++ b/public/static/css/main.css @@ -0,0 +1,120 @@ +body { + font-family: Sans-Serif; +} + +iframe { + border: none; +} + +div.about { + margin-top: 2em; + color: #666666; +} + +div.about a { + color: #000066; + text-decoration: none; +} + +div.error { + padding: 15px; + margin-bottom: 20px; + border: 1px solid #ebccd1; + border-radius: 4px; + color: #a94442; + background-color: #f2dede; + margin-left: auto; + margin-right: auto; +} + +pre { + margin-bottom: 2em; +} + +span.optional, +span.notes { + color: #666666; +} + +div.break { + height: 1em; +} + +div.field { + margin-top: 0.3em; + margin-bottom: 0.6em; +} + +.container { + max-width: 40em; + margin-left: auto; + margin-right: auto; +} + +#display { + display: block; + margin-left: auto; + margin-right: auto; +} + +input, select, .button { + display: inline-block; + width: 50em; + 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"], +input[type="number"] { + width: 49em; + padding-left: 0.5em; + padding-right: 0.5em; + text-align: left; + box-sizing: border-box; +} + +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 { + box-shadow: inset 0 3px 5px rgba(0,0,0,.125); +} + +div.notes { + margin-top: 4em; +} + +div.notes ul { + margin-top: 1em; +} diff --git a/public/static/css/mobile.css b/public/static/css/mobile.css new file mode 100644 index 0000000..efa6023 --- /dev/null +++ b/public/static/css/mobile.css @@ -0,0 +1,24 @@ +body { + margin: 0; +} + +div.displayclean > ul > li { + font-size: 35%; +} + +div.displayclean li .moreinfo { + font-size: 2.6em; +} + +p, +div.input-field, +div.notes { + max-width: 94%; + margin-left: auto; + margin-right: auto; +} + +p { + text-align: justify; +} + |