add bit of styles to time-slider

Author: Vincent van der Wal

src/components/TimeSlider.ts renamed to src/components/time-slider.ts

@@ -44,8 +44,8 @@ export function createTimeSlider({ container, initialDate, onChange }: TimeSlide
 		<input
 			type="date"
 			id="date_picker"
+			class="date-time-selection"
 			value="${formatDateInputValue(currentDate)}"
-			style="margin-top: 0.5em;"
 		/>
 	`;
 

src/main.ts

@@ -6,7 +6,7 @@ import { getValueFromLatLong } from './om-protocol';
 import { pad } from './utils/pad';
 import { domains, domainGroups } from './utils/domains';
 import { variables } from './utils/variables';
-import { createTimeSlider } from './components/TimeSlider';
+import { createTimeSlider } from './components/time-slider';
 
 import './style.css';
 

src/style.css

@@ -93,3 +93,22 @@ body {
 	margin-top: 5px;
 	margin-bottom: 5px;
 }
+
+#time_slider_container button {
+	background-color: white;
+	color: black;
+	padding: 5px;
+	border-radius: 5px;
+	font-size: 15px;
+	padding: 0.5rem 0.75rem;
+	font-weight: bold;
+}
+
+#slider_time_label {
+	margin: 0 0.3rem;
+}
+
+.date-time-selection {
+	margin-top: 0.5rem;
+	border-width: 1px;
+}