diff options
author | Eugen Rochko <eugen@zeonfederated.com> | 2019-08-23 22:38:02 +0200 |
---|---|---|
committer | Thibaut Girka <thib@sitedethib.com> | 2019-08-29 17:32:22 +0200 |
commit | 3aeaf9b897a7fff8ebb08055b06717e78e5cf914 (patch) | |
tree | fbfac75f90910d1f6fa10523785d61d7f7c86962 /app/javascript/flavours/glitch/styles/components/media.scss | |
parent | 04de74c992b0b7b380fdda9b42f8c69a6a098a46 (diff) |
[Glitch] Add audio player
Port 4190e31626907059aebf32b1be66715dacb989a9 to glitch-soc Signed-off-by: Thibaut Girka <thib@sitedethib.com>
Diffstat (limited to 'app/javascript/flavours/glitch/styles/components/media.scss')
-rw-r--r-- | app/javascript/flavours/glitch/styles/components/media.scss | 35 |
1 files changed, 35 insertions, 0 deletions
diff --git a/app/javascript/flavours/glitch/styles/components/media.scss b/app/javascript/flavours/glitch/styles/components/media.scss index 39ffcae9d..e207562a5 100644 --- a/app/javascript/flavours/glitch/styles/components/media.scss +++ b/app/javascript/flavours/glitch/styles/components/media.scss @@ -333,15 +333,50 @@ } +.audio-player { + box-sizing: border-box; + position: relative; + background: darken($ui-base-color, 8%); + border-radius: 4px; + padding-bottom: 44px; + + &.editable { + border-radius: 0; + height: 100%; + } + + &__waveform { + padding: 15px 0; + } + + &__progress-placeholder { + background-color: rgba(lighten($ui-highlight-color, 8%), 0.5); + } + + &__wave-placeholder { + background-color: lighten($ui-base-color, 16%); + } + + .video-player__controls { + padding: 0 15px; + padding-top: 10px; + background: darken($ui-base-color, 8%); + border-top: 1px solid lighten($ui-base-color, 4%); + border-radius: 0 0 4px 4px; + } +} + .video-player { overflow: hidden; position: relative; background: $base-shadow-color; max-width: 100%; border-radius: 4px; + box-sizing: border-box; &.editable { border-radius: 0; + height: 100% !important; } &:focus { |