From 5e68f8c8ddd11070a2b2ee11339be8c2c37ed8a5 Mon Sep 17 00:00:00 2001
From: Sam Potts <me@sampotts.me>
Date: Thu, 25 Jan 2018 22:41:30 +1100
Subject: Attempt to fix YouTube message error, added ads references, changes
 to bool

---
 demo/src/js/demo.js                   |  6 +-----
 demo/src/sass/bundles/demo.scss       |  5 +++++
 demo/src/sass/components/links.scss   |  4 ++++
 demo/src/sass/components/media.scss   | 10 ++++++++++
 demo/src/sass/utilities/color.scss    | 11 -----------
 demo/src/sass/utilities/cosmetic.scss |  7 +++++++
 demo/src/sass/utilities/hidden.scss   | 13 +++++++++++++
 7 files changed, 40 insertions(+), 16 deletions(-)
 create mode 100644 demo/src/sass/components/media.scss
 delete mode 100644 demo/src/sass/utilities/color.scss
 create mode 100644 demo/src/sass/utilities/cosmetic.scss

(limited to 'demo/src')

diff --git a/demo/src/js/demo.js b/demo/src/js/demo.js
index 164cfe7d..0fb06a11 100644
--- a/demo/src/js/demo.js
+++ b/demo/src/js/demo.js
@@ -52,11 +52,7 @@ document.addEventListener('DOMContentLoaded', () => {
             google: 'AIzaSyDrNwtN3nLH_8rjCmu5Wq3ZCm4MNAVdc0c',
         },
         ads: {
-            tag:
-                'https://go.aniview.com/api/adserver6/vast/?AV_PUBLISHERID=58c25bb0073ef448b1087ad6&AV_CHANNELID=5a0458dc28a06145e4519d21&AV_URL=127.0.0.1:3000&cb=1&AV_WIDTH=640&AV_HEIGHT=480',
-            // Test tags
-            // tag: 'https://pubads.g.doubleclick.net/gampad/ads?sz=640x480&iu=/124319096/external/single_ad_samples&ciu_szs=300x250&impl=s&gdfp_req=1&env=vp&output=vast&unviewed_position_start=1&cust_params=deployment%3Ddevsite%26sample_ct%3Dlinear&correlator=',
-            // tag: 'https://pubads.g.doubleclick.net/gampad/ads?sz=640x480&iu=/124319096/external/ad_rule_samples&ciu_szs=300x250&ad_rule=1&impl=s&gdfp_req=1&env=vp&output=vmap&unviewed_position_start=1&cust_params=deployment%3Ddevsite%26sample_ar%3Dpremidpost&cmsid=496&vid=short_onecue&correlator=',
+            enabled: true,
         },
     });
 
diff --git a/demo/src/sass/bundles/demo.scss b/demo/src/sass/bundles/demo.scss
index 96438483..2f89b858 100644
--- a/demo/src/sass/bundles/demo.scss
+++ b/demo/src/sass/bundles/demo.scss
@@ -34,8 +34,13 @@
 @import '../components/icons';
 @import '../components/links';
 @import '../components/lists';
+@import '../components/media';
 @import '../components/navigation';
 @import '../components/players';
 
 // Plyr
 @import '../../../../src/sass/plyr';
+
+// Utils
+@import '../utilities/cosmetic';
+@import '../utilities/hidden';
diff --git a/demo/src/sass/components/links.scss b/demo/src/sass/components/links.scss
index 25780b41..b2930862 100644
--- a/demo/src/sass/components/links.scss
+++ b/demo/src/sass/components/links.scss
@@ -42,4 +42,8 @@ a {
     &.tab-focus {
         @include tab-focus();
     }
+
+    &.no-border::after {
+        display: none;
+    }
 }
diff --git a/demo/src/sass/components/media.scss b/demo/src/sass/components/media.scss
new file mode 100644
index 00000000..c6744bcc
--- /dev/null
+++ b/demo/src/sass/components/media.scss
@@ -0,0 +1,10 @@
+// ==========================================================================
+// Basic media
+// ==========================================================================
+
+img,
+video,
+audio {
+    max-width: 100%;
+    vertical-align: middle;
+}
diff --git a/demo/src/sass/utilities/color.scss b/demo/src/sass/utilities/color.scss
deleted file mode 100644
index 786e6ccb..00000000
--- a/demo/src/sass/utilities/color.scss
+++ /dev/null
@@ -1,11 +0,0 @@
-// ==========================================================================
-// Color
-// ==========================================================================
-
-.color--vimeo {
-    color: $color-vimeo;
-}
-
-.color--youtube {
-    color: $color-youtube;
-}
diff --git a/demo/src/sass/utilities/cosmetic.scss b/demo/src/sass/utilities/cosmetic.scss
new file mode 100644
index 00000000..91374d9d
--- /dev/null
+++ b/demo/src/sass/utilities/cosmetic.scss
@@ -0,0 +1,7 @@
+// ==========================================================================
+// Misc cosmetic
+// ==========================================================================
+
+.no-border {
+    border: 0;
+}
diff --git a/demo/src/sass/utilities/hidden.scss b/demo/src/sass/utilities/hidden.scss
index a48b107a..665bfd76 100644
--- a/demo/src/sass/utilities/hidden.scss
+++ b/demo/src/sass/utilities/hidden.scss
@@ -5,3 +5,16 @@
 [hidden] {
     display: none;
 }
+
+// Hide only visually, but have it available for screen readers: h5bp.com/v
+.sr-only {
+    border: 0;
+    clip: rect(0 0 0 0);
+    height: 1px;
+    margin: -1px;
+    opacity: 0.001;
+    overflow: hidden;
+    padding: 0;
+    position: absolute;
+    width: 1px;
+}
-- 
cgit v1.2.3