Moved form styles and inline clipboard from overrides to main

material/assets/manifest.json

@@ -5,14 +5,14 @@
   "assets/javascripts/vendor.js.map": "assets/javascripts/vendor.e32ed4d0.min.js.map",
   "assets/javascripts/worker/search.js": "assets/javascripts/worker/search.b9424174.min.js",
   "assets/javascripts/worker/search.js.map": "assets/javascripts/worker/search.b9424174.min.js.map",
-  "assets/stylesheets/main.css": "assets/stylesheets/main.a86e6725.min.css",
-  "assets/stylesheets/main.css.map": "assets/stylesheets/main.a86e6725.min.css.map",
+  "assets/stylesheets/main.css": "assets/stylesheets/main.c55d56a9.min.css",
+  "assets/stylesheets/main.css.map": "assets/stylesheets/main.c55d56a9.min.css.map",
   "assets/stylesheets/palette.css": "assets/stylesheets/palette.e70b70b6.min.css",
   "assets/stylesheets/palette.css.map": "assets/stylesheets/palette.e70b70b6.min.css.map",
   "overrides/assets/javascripts/bundle.js": "overrides/assets/javascripts/bundle.63116035.min.js",
   "overrides/assets/javascripts/bundle.js.map": "overrides/assets/javascripts/bundle.63116035.min.js.map",
   "overrides/assets/javascripts/vendor.js": "overrides/assets/javascripts/vendor.1aa446d9.min.js",
   "overrides/assets/javascripts/vendor.js.map": "overrides/assets/javascripts/vendor.1aa446d9.min.js.map",
-  "overrides/assets/stylesheets/main.css": "overrides/assets/stylesheets/main.8e98f424.min.css",
-  "overrides/assets/stylesheets/main.css.map": "overrides/assets/stylesheets/main.8e98f424.min.css.map"
+  "overrides/assets/stylesheets/main.css": "overrides/assets/stylesheets/main.d67efea2.min.css",
+  "overrides/assets/stylesheets/main.css.map": "overrides/assets/stylesheets/main.d67efea2.min.css.map"
 }

material/base.html

@@ -39,7 +39,7 @@
       {% endif %}
     {% endblock %}
     {% block styles %}
-      <link rel="stylesheet" href="{{ 'assets/stylesheets/main.a86e6725.min.css' | url }}">
+      <link rel="stylesheet" href="{{ 'assets/stylesheets/main.c55d56a9.min.css' | url }}">
       {% if config.theme.palette %}
         {% set palette = config.theme.palette %}
         <link rel="stylesheet" href="{{ 'assets/stylesheets/palette.e70b70b6.min.css' | url }}">

material/overrides/main.html

@@ -22,7 +22,7 @@
   <meta name="twitter:title" content="{{ title }}">
   <meta name="twitter:description" content="{{ config.site_description }}">
   <meta name="twitter:image" content="{{ image }}">
-  <link rel="stylesheet" href="{{ 'overrides/assets/stylesheets/main.8e98f424.min.css' | url }}">
+  <link rel="stylesheet" href="{{ 'overrides/assets/stylesheets/main.d67efea2.min.css' | url }}">
 {% endblock %}
 {% block announce %}
   <a href="https://twitter.com/squidfunk">

src/assets/javascripts/browser/worker/index.ts

@@ -89,8 +89,8 @@ export function watchWorker<T extends WorkerMessage>(
 
   /* Intercept messages from worker-like objects */
   const rx$ = fromEvent<MessageEvent>(worker, "message")
-    .pipe<T>(
-    map(({ data }) => data)
+    .pipe(
+      map(({ data }) => data as T)
     )
 
   /* Send and receive messages, return hot observable */

src/assets/stylesheets/main.scss

@@ -43,10 +43,10 @@
 
 @import "main/layout/base";
 @import "main/layout/announce";
-@import "main/layout/button";
 @import "main/layout/clipboard";
 @import "main/layout/content";
 @import "main/layout/dialog";
+@import "main/layout/form";
 @import "main/layout/header";
 @import "main/layout/footer";
 @import "main/layout/nav";

src/assets/stylesheets/main/layout/_clipboard.scss

@@ -79,4 +79,23 @@
     mask-size: contain;
     content: "";
   }
+
+  // Inline copy to clipboard
+  &--inline {
+    cursor: pointer;
+
+    // Code blocks
+    code {
+      transition:
+        color            250ms,
+        background-color 250ms;
+    }
+
+    // Code block on focus/hover
+    &:focus code,
+    &:hover code {
+      color: var(--md-accent-fg-color);
+      background-color: var(--md-accent-fg-color--transparent);
+    }
+  }
 }

src/assets/stylesheets/main/layout/_form.scss

@@ -55,4 +55,25 @@
       border-color: var(--md-accent-fg-color);
     }
   }
+
+  // Input
+  .md-input {
+    width: 100%;
+    height: px2rem(36px);
+    padding: 0 px2rem(12px);
+    font-size: px2rem(16px);
+    border-radius: px2rem(2px);
+    box-shadow:
+      0 px2rem(4px)   px2rem(10px) hsla(0, 0%, 0%, 0.1),
+      0 px2rem(0.5px) px2rem(1px)  hsla(0, 0%, 0%, 0.1);
+    transition: box-shadow 250ms;
+
+    // Input on focus/hover
+    &:focus,
+    &:hover {
+      box-shadow:
+        0 px2rem(8px)   px2rem(20px) hsla(0, 0%, 0%, 0.15),
+        0 px2rem(0.5px) px2rem(1px)  hsla(0, 0%, 0%, 0.15);
+    }
+  }
 }

src/overrides/assets/stylesheets/main/_shame.scss

@@ -23,44 +23,3 @@
 // ----------------------------------------------------------------------------
 // Nothing to see here, move along
 // ----------------------------------------------------------------------------
-
-// Scoped in typesetted content to match specificity of regular content
-.md-typeset {
-
-  // Input
-  .md-input {
-    @include z-depth(1);
-
-    width: 100%;
-    height: px2rem(36px);
-    padding: 0 px2rem(12px);
-    font-size: px2rem(16px);
-    border-radius: px2rem(2px);
-    box-shadow:
-      0 px2rem(4px)   px2rem(10px) hsla(0, 0%, 0%, 0.1),
-      0 px2rem(0.5px) px2rem(1px)  hsla(0, 0%, 0%, 0.1);
-    transition: box-shadow 250ms;
-
-    &:hover,
-    &:focus {
-      box-shadow:
-        0 px2rem(8px)   px2rem(20px) hsla(0, 0%, 0%, 0.15),
-        0 px2rem(0.5px) px2rem(1px)  hsla(0, 0%, 0%, 0.15);
-    }
-  }
-
-  .md-clipboard--inline {
-    cursor: pointer;
-    code {
-      transition:
-        color            250ms,
-        background-color 250ms;
-    }
-
-    &:focus code,
-    &:hover code {
-      color: var(--md-accent-fg-color);
-      background-color: var(--md-accent-fg-color--transparent);
-    }
-  }
-}