From fc499a7b98a57a452b33b1d1310482840bef8551 Mon Sep 17 00:00:00 2001 From: Daniel Friesel Date: Sun, 27 Jun 2021 09:50:23 +0200 Subject: switch to scss --- sass/app.scss | 128 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++ sass/dark.scss | 6 +++ sass/light.scss | 6 +++ 3 files changed, 140 insertions(+) create mode 100644 sass/app.scss create mode 100644 sass/dark.scss create mode 100644 sass/light.scss (limited to 'sass') diff --git a/sass/app.scss b/sass/app.scss new file mode 100644 index 0000000..39726d8 --- /dev/null +++ b/sass/app.scss @@ -0,0 +1,128 @@ +body { + margin: 0; + color: black; + background-color: white; +} + +html { + font-family: Sans-Serif; +} + +.container { + max-width: 60em; + margin-left: auto; + margin-right: auto; +} + +ul.departures { + position:relative; + width:100%; + + border-width:1px 2px; + margin-bottom: 5em; + + list-style-type:none; + margin:0; + padding:0; + + > li { + display: block; + height: 3em; + width: 100%; + position: relative; + cursor: pointer; + border-bottom: 1px solid grey; + background-color: white; + + &.cancelled { + background-color: #ffe7d0; + } + } + + .line { + position: absolute; + bottom: 2px; + left: 2px; + max-width: 6em; + max-height: 3ex; + max-width: 5em; + overflow: hidden; + font-size: 140%; + background-color: #eeeeee; + font-weight: bold; + padding-left: 0.1em; + padding-right: 0.1em; + } + + .tram { + background-color:#ffcccc; + } + + .suburban { + background-color:#aaffba; + border-radius: 30px; + } + + .subway { + background-color:#aac0ff; + } + + .bus { + background-color:#eeaaee; + border-radius: 10px; + } + + .dest { + position: absolute; + bottom: 0; + left: 5em; + width: 70%; + overflow: hidden; + background-color: transparent; + font-size: 150%; + color: black; + } + + .destsuffix { + position: absolute; + top: 1px; + left: 7.6em; + width: 70%; + height: 1.2em; + overflow: hidden; + } + + .time { + position: absolute; + right: 5px; + top: 1px; + background-color: transparent; + padding-left: 0.2em; + color: black; + + .delay { + padding-right: 1ex; + color: #ff0000; + } + } + + .platform { + position: absolute; + bottom: 0; + right: 5px; + overflow: hidden; + background-color: transparent; + font-size: 140%; + font-weight: bold; + color: black; + } +} + +@media only screen and (max-width: 600px) { + ul.departures > li { + font-size: 85%; + } +} + +@media only screen and (min-width: 600px) { +} diff --git a/sass/dark.scss b/sass/dark.scss new file mode 100644 index 0000000..96db6ba --- /dev/null +++ b/sass/dark.scss @@ -0,0 +1,6 @@ +/* + * Copyright (C) 2021 Daniel Friesel + * + * SPDX-License-Identifier: BSD-2-Clause + */ +@import 'app.scss'; diff --git a/sass/light.scss b/sass/light.scss new file mode 100644 index 0000000..96db6ba --- /dev/null +++ b/sass/light.scss @@ -0,0 +1,6 @@ +/* + * Copyright (C) 2021 Daniel Friesel + * + * SPDX-License-Identifier: BSD-2-Clause + */ +@import 'app.scss'; -- cgit v1.2.3