summaryrefslogtreecommitdiff
path: root/animism-align/frontend/app/views/viewer/nav
diff options
context:
space:
mode:
authorJules Laplace <julescarbon@gmail.com>2020-11-24 14:29:13 +0100
committerJules Laplace <julescarbon@gmail.com>2020-11-24 14:29:13 +0100
commit2189b9a950cd662e8b1a59c0a9e9a7ea43add587 (patch)
tree9034e14e80fc64b51e0d811855be95fda97addb5 /animism-align/frontend/app/views/viewer/nav
parent7baa798a1d523239752cf36cf22547683c7971a6 (diff)
fix pausing, ff/sf percentage bar, copy link
Diffstat (limited to 'animism-align/frontend/app/views/viewer/nav')
-rw-r--r--animism-align/frontend/app/views/viewer/nav/eflux.chrome.js1
-rw-r--r--animism-align/frontend/app/views/viewer/nav/nav.css23
2 files changed, 18 insertions, 6 deletions
diff --git a/animism-align/frontend/app/views/viewer/nav/eflux.chrome.js b/animism-align/frontend/app/views/viewer/nav/eflux.chrome.js
index 36393df..d365c9c 100644
--- a/animism-align/frontend/app/views/viewer/nav/eflux.chrome.js
+++ b/animism-align/frontend/app/views/viewer/nav/eflux.chrome.js
@@ -144,6 +144,7 @@ class EfluxChrome extends Component {
onMouseLeave={() => this.handleMouseLeave('close')}
onClick={() => {
actions.viewer.toggleFullscreenVisible(false)
+ actions.audio.pause()
this.handleMouseLeave('close')
}}
>
diff --git a/animism-align/frontend/app/views/viewer/nav/nav.css b/animism-align/frontend/app/views/viewer/nav/nav.css
index dfbb093..1636b4d 100644
--- a/animism-align/frontend/app/views/viewer/nav/nav.css
+++ b/animism-align/frontend/app/views/viewer/nav/nav.css
@@ -161,22 +161,33 @@
.nav-progress-percentage {
position: absolute;
- bottom: 0;
left: 0;
- height: 3rem;
+ height: 4px;
+ bottom: calc(3rem - 4px);
pointer-events: none;
- backdrop-filter: invert(0%);
- transition: opacity 0.2s, backdrop-filter 0.2s, width 0.25s linear;
opacity: 0;
+ transition: opacity 0.2s;
+ background: #fff;
}
.nav-open .nav-progress-percentage,
.viewer-nav.hovering-nav .nav-progress-percentage {
- backdrop-filter: invert(100%);
opacity: 1;
}
-.nav-open .nav-progress-percentage {
+
+.chrome .nav-progress-percentage {
+ bottom: 0;
+ height: 3rem;
+ backdrop-filter: invert(0%);
+ transition: opacity 0.2s, backdrop-filter 0.2s, width 0.25s linear;
+}
+.chrome .nav-open .nav-progress-percentage {
height: calc(3rem - 1px);
}
+.chrome .nav-open .nav-progress-percentage,
+.chrome .viewer-nav.hovering-nav .nav-progress-percentage {
+ backdrop-filter: invert(100%);
+}
+
/* Arrows */