switch to scss

3 files changed, 140 insertions, 0 deletions

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';