From 90c5735904354f5fde0dcdae9f8894fe9088739c Mon Sep 17 00:00:00 2001 From: Sam Potts Date: Mon, 28 May 2018 10:19:07 +1000 Subject: WIP --- src/sass/components/control.scss | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) (limited to 'src/sass/components/control.scss') diff --git a/src/sass/components/control.scss b/src/sass/components/control.scss index 52716805..cfef1b3a 100644 --- a/src/sass/components/control.scss +++ b/src/sass/components/control.scss @@ -34,10 +34,10 @@ } // Change icons on state change -.plyr__control[aria-pressed='false'] .icon--pressed, -.plyr__control[aria-pressed='true'] .icon--not-pressed, -.plyr__control[aria-pressed='false'] .label--pressed, -.plyr__control[aria-pressed='true'] .label--not-pressed { +.plyr__control:not(.plyr__control--pressed) .icon--pressed, +.plyr__control.plyr__control--pressed .icon--not-pressed, +.plyr__control:not(.plyr__control--pressed) .label--pressed, +.plyr__control.plyr__control--pressed .label--not-pressed { display: none; } -- cgit v1.2.3 From 56a485bac63ebc211c3502be81caf3b7efa718ac Mon Sep 17 00:00:00 2001 From: Sam Potts Date: Wed, 1 Aug 2018 00:37:55 +1000 Subject: Fix Firefox spacebar issue --- src/sass/components/control.scss | 17 ++++++++++++++++- 1 file changed, 16 insertions(+), 1 deletion(-) (limited to 'src/sass/components/control.scss') diff --git a/src/sass/components/control.scss b/src/sass/components/control.scss index cfef1b3a..2b681465 100644 --- a/src/sass/components/control.scss +++ b/src/sass/components/control.scss @@ -41,7 +41,7 @@ display: none; } -// Audio styles +// Audio control .plyr--audio .plyr__control { &.plyr__tab-focus, &:hover, @@ -51,6 +51,21 @@ } } +// Video control +.plyr--video .plyr__control { + svg { + filter: drop-shadow(0 1px 1px rgba(#000, 0.15)); + } + + // Hover and tab focus + &.plyr__tab-focus, + &:hover, + &[aria-expanded='true'] { + background: $plyr-video-control-bg-hover; + color: $plyr-video-control-color-hover; + } +} + // Large play button (video only) .plyr__control--overlaid { background: rgba($plyr-video-control-bg-hover, 0.8); -- cgit v1.2.3 From 62d80e6b7698d200d3b97c6084f059e2ba780efe Mon Sep 17 00:00:00 2001 From: Sam Potts Date: Tue, 25 Sep 2018 20:43:09 +1000 Subject: Fix touch vs click issue --- src/sass/components/control.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'src/sass/components/control.scss') diff --git a/src/sass/components/control.scss b/src/sass/components/control.scss index 2b681465..655a5af1 100644 --- a/src/sass/components/control.scss +++ b/src/sass/components/control.scss @@ -94,7 +94,7 @@ } } -.plyr--playing .plyr__control--overlaid { +.plyr--hide-controls .plyr__control--overlaid { opacity: 0; visibility: hidden; } -- cgit v1.2.3 From f80b568e6747475798b394464f9299530baf285e Mon Sep 17 00:00:00 2001 From: Sam Potts Date: Tue, 25 Sep 2018 23:07:48 +1000 Subject: Reverted large pause button --- src/sass/components/control.scss | 7 +++---- 1 file changed, 3 insertions(+), 4 deletions(-) (limited to 'src/sass/components/control.scss') diff --git a/src/sass/components/control.scss b/src/sass/components/control.scss index 655a5af1..8578668b 100644 --- a/src/sass/components/control.scss +++ b/src/sass/components/control.scss @@ -81,11 +81,10 @@ transform: translate(-50%, -50%); z-index: 2; + // Offset icon to make the play button look right svg { - height: $plyr-control-icon-size-large; - left: 2px; // Offset to make the play button look right + left: 2px; position: relative; - width: $plyr-control-icon-size-large; } &:hover, @@ -94,7 +93,7 @@ } } -.plyr--hide-controls .plyr__control--overlaid { +.plyr--playing .plyr__control--overlaid { opacity: 0; visibility: hidden; } -- cgit v1.2.3 From df8f0407954cc8a23755eb203dfca5f4939a632e Mon Sep 17 00:00:00 2001 From: Sam Potts Date: Fri, 28 Sep 2018 00:29:59 +1000 Subject: Remove link styles from anchor controls --- src/sass/components/control.scss | 10 ++++++++++ 1 file changed, 10 insertions(+) (limited to 'src/sass/components/control.scss') diff --git a/src/sass/components/control.scss b/src/sass/components/control.scss index 8578668b..1c9aab2b 100644 --- a/src/sass/components/control.scss +++ b/src/sass/components/control.scss @@ -33,6 +33,16 @@ } } +// Remove any link styling +a.plyr__control { + text-decoration: none; + + &::after, + &::before { + display: none; + } +} + // Change icons on state change .plyr__control:not(.plyr__control--pressed) .icon--pressed, .plyr__control.plyr__control--pressed .icon--not-pressed, -- cgit v1.2.3