feat(BOOK-257): Added VideoPlayer component

Approved-by: Christel Westerberg Approved-by: Bianca Widstam
2025-12-02 07:35:38 +00:00
parent b1ccabb0b6
commit 84593438e6
13 changed files with 513 additions and 5 deletions
@@ -0,0 +1,48 @@
+.videoPlayer {
+  position: relative;
+  width: 100%;
+  aspect-ratio: auto;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+
+  &.inline {
+    border-radius: var(--Corner-radius-md);
+    overflow: hidden;
+  }
+
+  &.hero {
+    height: 100%;
+    .overlay {
+      display: contents;
+    }
+    .playButton {
+      position: absolute;
+      bottom: var(--Space-x2);
+      right: var(--Space-x2);
+    }
+  }
+}
+
+.video {
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
+}
+
+.playButton {
+  position: absolute;
+}
+
+.muteButton {
+  position: absolute;
+  top: var(--Space-x2);
+  right: var(--Space-x2);
+}
+
+@media screen and (min-width: 768px) {
+  .videoPlayer.hero .playButton {
+    bottom: var(--Space-x4);
+    right: var(--Space-x4);
+  }
+}