Fixing a11y, colors, UX, minor cleanup

3 files changed, 22 insertions, 25 deletions

diff --git a/layouts/partials/index/announcements.html b/layouts/partials/index/announcements.html
index a02045e..0be3835 100644
--- a/layouts/partials/index/announcements.html
+++ b/layouts/partials/index/announcements.html
@@ -2,13 +2,23 @@
 {{ $active := where $incidents "Params.resolved" "=" false }}
 
 {{ if $active }}
-  <div class="announcement-box">
+  <div class="announcement-box" style="border-bottom: 0">
     {{ range $active }}
       <div class="padding">
-        <p><strong class="bold">{{ .Title }}</strong></p>
+        <p>
+          <a href="{{ .Permalink }}"><strong class="bold">{{ .Title }} →</strong></a>
+        </p>
+
+        <p><small>
+          {{ range .Params.Affected }}
+            <a href="/affected/{{ . | urlize }}" class="tag no-underline">{{ . }}</a>
+          {{ end }}
+        </small></p>
+
         {{ .Content | safeHTML | truncate 500 "…" }}
-        <p><a href="{{ .Permalink }}">{{ T "continueReading" }}</a></p>
+        <p></p>
       </div>
-    {{ else }}{{ end }}
+      <hr class="clean announcement-box">
+    {{ end }}
   </div>
 {{ end }}
\ No newline at end of file
diff --git a/layouts/partials/index/components.html b/layouts/partials/index/components.html
index 9424cd0..128b887 100644
--- a/layouts/partials/index/components.html
+++ b/layouts/partials/index/components.html
@@ -31,13 +31,13 @@
 
         <span class="component-status">
           {{ if $thisIsDown }}
-            {{ T "thisIsDown" }}
+            <b>{{ T "thisIsDown" }}</b>
           {{ else }}
           {{ if $thisIsDisrupted }}
-            {{ T "thisIsDisrupted" }}
+            <b>{{ T "thisIsDisrupted" }}</b>
           {{ else }}
           {{ if $thisIsNotice }}
-            {{ T "thisIsNotice" }}
+            <b>{{ T "thisIsNotice" }}</b>
           {{ else }}
             {{ T "thisIsOk" }}
           {{ end }}{{ end }}{{ end }}
diff --git a/layouts/partials/meta.html b/layouts/partials/meta.html
index e2a5056..6544af8 100644
--- a/layouts/partials/meta.html
+++ b/layouts/partials/meta.html
@@ -23,23 +23,10 @@
     </script>
     <!-- Sources -->
     <style>
-    /**
-     * Color palette
-     *
-     * Defaults:
-     * white: #fff;
-     * whitesmoke: #f5f5f5;
-     * forestgreen: #228B22;
-     * crimson: #DC143C;
-     * darkorange: #EE7600;
-     * slategray: #708090;
-     *
-     */
-
     html, body {
       margin: 0;
       background: #fff;
-      color: #444;
+      color: #4d4d4d;
       font: 100%/1.5 BlinkMacSystemFont, -apple-system, "San Francisco Text", "Roboto", "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
       box-sizing: border-box;
       -webkit-tap-highlight-color: rgba(0,0,0, 0.25);
@@ -311,10 +298,10 @@
      */
 
     .component-status { float: right; }
-    .component[data-status="ok"] .component-status { color: #{{ .Site.Params.ok }};; }
-    .component[data-status="disrupted"] .component-status { color: #{{ .Site.Params.disrupted }};; }
-    .component[data-status="down"] .component-status { color: #{{ .Site.Params.down }};; }
-    .component[data-status="notice"] .component-status { color: #{{ .Site.Params.notice }};; }
+    .component[data-status="ok"] .component-status { color: #{{ .Site.Params.ok }}; }
+    .component[data-status="disrupted"] .component-status { color: #{{ .Site.Params.disrupted }}; }
+    .component[data-status="down"] .component-status { color: #{{ .Site.Params.down }}; }
+    .component[data-status="notice"] .component-status { color: #{{ .Site.Params.notice }}; }
 
     /**
      * Responsiveness