| /* |
| * Copyright (C) 2017 Apple Inc. All Rights Reserved. |
| * |
| * Redistribution and use in source and binary forms, with or without |
| * modification, are permitted provided that the following conditions |
| * are met: |
| * 1. Redistributions of source code must retain the above copyright |
| * notice, this list of conditions and the following disclaimer. |
| * 2. Redistributions in binary form must reproduce the above copyright |
| * notice, this list of conditions and the following disclaimer in the |
| * documentation and/or other materials provided with the distribution. |
| * |
| * THIS SOFTWARE IS PROVIDED BY APPLE INC. ``AS IS'' AND ANY |
| * EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE |
| * IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR |
| * PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL APPLE INC. OR |
| * CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, |
| * EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, |
| * PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR |
| * PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY |
| * OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT |
| * (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE |
| * OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE. |
| */ |
| |
| /* Controls bar */ |
| |
| .media-controls.inline > .controls-bar { |
| left: var(--inline-controls-inside-margin); |
| height: var(--inline-controls-bar-height); |
| } |
| |
| .media-controls.inline.uses-ltr-user-interface-layout-direction > .controls-bar.top-left, |
| .media-controls.inline:not(.uses-ltr-user-interface-layout-direction) > .controls-bar.top-right { |
| top: var(--inline-controls-inside-margin); |
| } |
| |
| .media-controls.inline.uses-ltr-user-interface-layout-direction > .controls-bar.top-right, |
| .media-controls.inline:not(.uses-ltr-user-interface-layout-direction) > .controls-bar.top-left { |
| left: auto; |
| right: var(--inline-controls-inside-margin); |
| top: var(--inline-controls-inside-margin); |
| } |
| |
| .media-controls.inline.audio > .controls-bar { |
| top: auto; |
| left: auto; |
| } |
| |
| .media-controls.inline > .controls-bar > * { |
| position: absolute; |
| } |
| |
| /* Controls placement */ |
| |
| .media-controls.inline > button.play-pause.corner { |
| left: var(--inline-controls-inside-margin) !important; |
| top: auto; |
| bottom: var(--inline-controls-inside-margin); |
| } |
| |
| .media-controls.inline.audio > button.play-pause.corner { |
| left: auto !important; |
| top: auto; |
| bottom: auto; |
| } |
| |
| .media-controls.inline > .controls-bar button { |
| height: 100% !important; |
| } |
| |
| .media-controls.inline button.start.center > picture, |
| .media-controls.inline button.play-pause.center.paused > picture { |
| left: 3px; |
| } |
| |
| .media-controls.inline button.start.small-center > picture, |
| .media-controls.inline button.play-pause.small-center.paused > picture { |
| left: 1px; |
| } |
| |
| /* Labels */ |
| |
| .media-controls.inline .time-control, |
| .media-controls.inline .status-label { |
| height: 100%; |
| display: flex; |
| align-items: center; |
| } |