Merge pull request #191 from kognise/new-file-structure

[WIP] New File Structure + Version Picker

src/builds/dark-legacy.css

@@ -1,9 +0,0 @@
-/**
- * Dark-themed version for legacy browsers:
- * Loads the compiled, standalone version of the dark theme,
- * but overrides it with the compiled, standalone version of the light theme
- * if a system-wide theme preference is set on the user's device.
- */
-
-@import url('./dark-legacy.standalone.min.css');
-@import url('./light-legacy.standalone.min.css') (prefers-color-scheme: light);

src/builds/dark-legacy.standalone.css

@@ -1,8 +0,0 @@
-/**
- * Standalone dark-themed version for legacy browsers.
- * Includes dark variables and core, compiled at build time so the final output
- * will only include regular CSS, no variables.
- */
-
-@import '../variables-dark.css';
-@import '../parts/_core.css';

src/builds/dark.css

@@ -1,12 +1,6 @@
 /**
- * Dark-themed version:
- * uses dark theme by default but switches to light theme
- * if a system-wide theme preference is set on the user's device.
- *
- * Variables will remain uncompiled so the theme can update dynamically
- * at runtime in the browser.
+ * Forced dark theme version
  */
 
 @import '../variables-dark.css';
-@import '../variables-light.css' (prefers-color-scheme: light);
 @import '../parts/_core.css';

src/builds/dark.standalone.css

@@ -1,8 +0,0 @@
-/**
- * Standalone dark-themed version.
- * Includes dark variables and core, left as CSS variables
- * so the theming can be adjusted at runtime.
- */
-
-@import '../variables-dark.css';
-@import '../parts/_core.css';

src/builds/light-legacy.css

@@ -1,9 +0,0 @@
-/**
- * Light-themed version for legacy browsers:
- * Loads the compiled, standalone version of the light theme at runtime,
- * but overrides it with the compiled, standalone version of the dark theme
- * if a system-wide theme preference is set on the user's device.
- */
-
-@import url('./light-legacy.standalone.min.css');
-@import url('./dark-legacy.standalone.min.css') (prefers-color-scheme: dark);

src/builds/light-legacy.standalone.css

@@ -1,8 +0,0 @@
-/**
- * Standalone light-themed version for legacy browsers.
- * Includes light variables and core, compiled at build time so the final output
- * will only include regular CSS, no variables.
- */
-
-@import '../variables-light.css';
-@import '../parts/_core.css';

src/builds/light.css

@@ -1,12 +1,6 @@
 /**
- * Light-themed version:
- * uses light theme by default but switches to dark theme
- * if a system-wide theme preference is set on the user's device.
- *
- * Variables will remain uncompiled so the theme can update dynamically
- * at runtime in the browser.
+ * Forced light theme version
  */
 
 @import '../variables-light.css';
-@import '../variables-dark.css' (prefers-color-scheme: dark);
 @import '../parts/_core.css';

src/builds/light.standalone.css

@@ -1,8 +0,0 @@
-/**
- * Standalone light-themed version.
- * Includes light variables and core, left as CSS variables
- * so the theming can be adjusted at runtime.
- */
-
-@import '../variables-light.css';
-@import '../parts/_core.css';

src/builds/water.css

@@ -0,0 +1,9 @@
+/**
+ * Automatic version:
+ * Uses light theme by default but switches to dark theme
+ * if a system-wide theme preference is set on the user's device.
+ */
+
+@import '../variables-light.css';
+@import '../variables-dark.css' (prefers-color-scheme: dark);
+@import '../parts/_core.css';

src/parts/_forms.css

@@ -29,14 +29,24 @@ select {
   outline: none;
 }
 
-input,
-label {
+input[type='checkbox'],
+input[type='radio'] {
+  height: 1em;
+  width: 1em;
+}
+
+input[type='radio'] {
+  border-radius: 100%;
+}
+
+input {
   vertical-align: top;
 }
 
 label {
-  display: inline-block;
+  vertical-align: middle;
   margin-bottom: 4px;
+  display: inline-block;
 }
 
 input:not([type='checkbox']):not([type='radio']),