diff options
| author | Sam Potts <sam@potts.es> | 2017-11-18 19:30:26 +1100 |
|---|---|---|
| committer | Sam Potts <sam@potts.es> | 2017-11-18 19:30:26 +1100 |
| commit | 6984d6fb1606a71edd35ac043ac1116b6de8e98b (patch) | |
| tree | 1dc18a90bb2870b3c4665e40a3dcaeb75f3bb831 /src/less/components/menus.less | |
| parent | d7a1c4428138d2dd5af09e41e998d1e08dafe76e (diff) | |
| download | plyr-6984d6fb1606a71edd35ac043ac1116b6de8e98b.tar.lz plyr-6984d6fb1606a71edd35ac043ac1116b6de8e98b.tar.xz plyr-6984d6fb1606a71edd35ac043ac1116b6de8e98b.zip | |
Controls cleanup, work on captions bug, click to invert time
Diffstat (limited to 'src/less/components/menus.less')
| -rw-r--r-- | src/less/components/menus.less | 38 |
1 files changed, 36 insertions, 2 deletions
diff --git a/src/less/components/menus.less b/src/less/components/menus.less index a679e69b..f96393e0 100644 --- a/src/less/components/menus.less +++ b/src/less/components/menus.less @@ -129,11 +129,45 @@ } label.plyr__control { - padding-left: ceil(@plyr-control-padding * 2.5); + padding-left: @plyr-control-padding; - input[type='radio'] { + /*input[type='radio'] { position: relative; left: -@plyr-control-padding; + }*/ + + input[type='radio'] + span { + position: relative; + display: block; + height: 14px; + width: 14px; + border-radius: 100%; + background: fade(#000, 10%); + margin-right: @plyr-control-spacing; + box-shadow: inset 0 1px 1px fade(#000, 15%); + + &::after { + content: ''; + position: absolute; + height: 6px; + width: 6px; + top: 4px; + left: 4px; + transform: scale(0); + opacity: 0; + background: #fff; + border-radius: 100%; + transition: transform 0.3s ease, opacity 0.3s ease; + } + } + + input[type='radio']:checked + span { + background: @plyr-color-main; + + &::after { + transform: scale(1); + opacity: 1; + } } } |