@eluvio/elv-player-js 1.0.126 → 1.0.127

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@eluvio/elv-player-js",
-  "version": "1.0.126",
+  "version": "1.0.127",
   "description": "![Eluvio Logo](src/static/images/Logo.png \"Eluvio Logo\")",
   "main": "src/index.js",
   "license": "MIT",

package/src/PlayerControls.js

@@ -63,8 +63,11 @@ export const CreateElement = ({parent, type="div", label, options={}, classes=[]
   return element;
 };
 
-const CreateImageButton = ({parent, svg, label, options={}, classes=[], prepend=false}) => {
-  classes.unshift("eluvio-player__controls__button");
+const CreateImageButton = ({parent, svg, label, options={}, classes=[], noDefaultClass, prepend=false}) => {
+  if(!noDefaultClass) {
+    classes.unshift("eluvio-player__controls__button");
+  }
+
   const button = CreateElement({parent, type: "button", label, options, classes, prepend});
   button.innerHTML = svg;
 
@@ -938,7 +941,8 @@ class PlayerControls {
       parent: this.settingsMenu,
       svg: CloseIcon,
       type: "button",
-      classes: ["eluvio-player__controls__settings-menu__close"]
+      classes: ["eluvio-player__controls__settings-menu__close"],
+      noDefaultClass: true
     });
 
     closeButton.addEventListener("click", () => this.HideSettingsMenu());

package/src/static/stylesheets/player.scss

@@ -448,10 +448,14 @@ $button-height: 35px;
       }
 
       &__close {
+        align-items: center;
         display: none;
+        height: 20px;
+        justify-content: center;
         position: absolute;
         right: 20px;
         top: 20px;
+        width: 20px;
 
         * {
           color: $button-color;
@@ -889,13 +893,12 @@ $button-height: 35px;
         text-align: center;
 
         &-back {
-          font-size: 24px;
           margin-bottom: 20px;
         }
       }
 
       &__close {
-        display: unset;
+        display: flex;
         z-index: 100;
       }
     }
@@ -911,17 +914,35 @@ $button-height: 35px;
           text-align: center;
 
           &-back {
-            font-size: 24px;
             margin-bottom: 20px;
           }
         }
 
         &__close {
-          display: unset;
+          display: flex;
         }
       }
     }
 
+    .eluvio-player__hls-options-form {
+      padding: 10px;
+
+      &__title {
+        font-size: 12px;
+        margin-bottom: 5px;
+      }
+
+      &__input {
+        font-size: 12px;
+      }
+
+      &__action {
+        font-size: 12px;
+        height: 20px;
+        width: 60px;
+      }
+    }
+
     .eluvio-player__hotspot-overlay {
       .eluvio-player__hotspot-overlay__target {
         .eluvio-player__hotspot-overlay__target__title {