@npo/player 1.29.0 → 2.0.0-beta.0

package/src/style/components/audio/_metadata.scss

@@ -1,60 +0,0 @@
-.bmpui-metadata {
-  padding: 0 !important;
-  display: block !important;
-
-  .bmpui-container-wrapper {
-    aspect-ratio: unset;
-    display: block;
-    padding: 7.5px 0;
-    display: flex;
-    flex-direction: column;
-    justify-content: center;
-    height: 120px;
-  }
-
-  .bmpui-label-metadata-title {
-    padding: 0 40px 0 $player-spacing-left;
-    text-shadow: none;
-    font-size: 16px;
-    line-height: 20.83px;
-    margin-left: 79px;
-    width: 100%;
-    @include max-lines(2)
-  }
-
-  .bmpui-label-metadata-description {
-    opacity: 1;
-    text-shadow: none;
-    color: currentColor;
-    padding-left: 160px;
-    margin-left: 79px;
-    @include max-lines(2)
-  }
-
-  .bmpui-nicam {
-    display: none;
-  }
-}
-
-&.bmpui-layout-max-width-400 {
-  .bmpui-metadata .bmpui-container-wrapper {
-    margin-top: 12px;
-    padding-left: 12px;
-    height: 65px;
-  }
-
-  .bmpui-label-metadata-title {
-    padding: 0 0 0 125px;
-    margin: 0;
-    font-size: 14px;
-    line-height: 1.2;
-  }
-
-  .bmpui-label-metadata-description {
-    font-size: 14px;
-    line-height: 1.2;
-    margin: 0;
-    padding: 0 0 0 125px;
-    @include max-lines(1)
-  }
-}

package/src/style/components/audio/_playbutton.scss

@@ -1,54 +0,0 @@
-.bmpui-ui-playbacktogglebutton {
-  width: 64px;
-  height: 64px;
-  position: absolute;
-  top: $player-spacing;
-  margin-top: $player-spacing-inner;
-  left: $player-spacing-left;
-  mask-image: none;
-  border-radius: 50%;
-  padding: 0;
-  background: var(--npo-player-iconcolor);
-  z-index: z-index(hugeplayback-toggle-button);
-
-  &::before {
-    content: '';
-    position: absolute;
-    background-color: var(--npo-audio-player-background-color);
-    width: 100%;
-    height: 100%;
-    top: 0;
-    left: 0;
-    mask-image: var(--npo-player-icon-play);
-    mask-size: 36px;
-    mask-position: 50% 50%;
-    mask-repeat: no-repeat;
-  }
-
-  .bmpui-label {
-    display: none;
-  }
-
-  &.bmpui-on::before {
-    mask-image: var(--npo-player-icon-pause);
-}
-}
-
-&.bmpui-layout-max-width-400 {
-  .bmpui-ui-playbacktogglebutton {
-    width: 36px;
-    height: 36px;
-    left: 90px;
-    margin-top: 7px;
-
-    &::before {
-      mask-size: 24px;
-    }
-  }
-}
-
-&.bmpui-player-state-finished {
-  .bmpui-ui-playbacktogglebutton::before {
-    mask-image: var(--npo-player-icon-replay);
-  }
-}

package/src/style/components/audio/_poster.scss

@@ -1,19 +0,0 @@
-.bitmovinplayer-poster {
-  top: $player-spacing;
-  left: $player-spacing;
-  height: 120px;
-  width: 120px;
-  width: auto;
-  right: auto;
-  bottom: auto;
-  aspect-ratio: 1 / 1;
-  border-radius: var(--npo-audio-player-poster-border-radius);
-  background-color: var(--npo-audio-player-poster-background);
-  display: block !important;
-  z-index: 1;
-
-  @container (max-width: 400px) {
-    width: 50px;
-    height: 50px;
-  }
-}

package/src/style/components/audio/_replay.scss

@@ -1,28 +0,0 @@
-&.bmpui-player-state-finished {
-  .bmpui-ui-playbacktoggle-overlay {
-
-    .bmpui-ui-hugeplaybacktogglebutton {
-      background: var(--npo-player-primarycolor);
-      border-radius: 50%;
-    }
-    
-    .bmpui-image,
-    .bmpui-image:hover {
-      &::after {
-        background-color: var(--npo-audio-player-background-color);
-        mask-size: 32px;
-      }
-    }
-  }
-}
-
-&.bmpui-layout-max-width-400 {
-  .bmpui-ui-playbacktoggle-overlay {
-    .bmpui-image,
-    .bmpui-image:hover {
-      &::after {
-        mask-size: 24px;
-      }
-    }
-  }
-}

package/src/style/components/audio/_seekbar.scss

@@ -1,28 +0,0 @@
-.bmpui-ui-playbacktimelabel {
-  font-weight: normal;
-  font-family: var(--fontRegular);
-}
-
-.bmpui-ui-seekbar-label {
-  display: none;
-}
-
-.bmpui-ui-seekbar {
-  display: block;
-
-  .bmpui-seekbar {
-    .bmpui-seekbar-playbackposition-marker {
-      background-color: var(--npo-player-primarycolor);
-      border-color: var(--npo-player-primarycolor);
-
-      &::after {
-        display: none;
-      }
-    }
-
-    .bmpui-seekbar-backdrop {
-      opacity: 1;
-      background-color: var(--npo-player-seekbar-background);
-    }
-  }
-}

package/src/style/components/audio/_topbar.scss

@@ -1,35 +0,0 @@
-.bmpui-ui-controlbar-top,
-.bmpui-ui-titlebar {
-  background: none;
-  height: auto;
-  padding-left: $player-spacing-left;
-
-  &::before {
-    display: none;
-  }
-
-  &.bmpui-hidden {
-    button {
-      pointer-events: none;
-    }
-  }
-}
-
-.bmpui-container-wrapper {
-  color: var(--npo-audio-player-text-color);
-}
-
-&.bmpui-player-state-prepared {
-  .bmpui-metadata .bmpui-label-metadata-title {
-    opacity: 1;
-  }
-
-  &.bmpui-controls-shown {
-    .bmpui-ui-titlebar,
-    .bmpui-ui-controlbar {
-      display: block;
-      opacity: 1;
-      visibility: visible;
-    }
-  }
-}

package/src/style/components/audio/_vars.scss

@@ -1,5 +0,0 @@
-$player-height: 160px;
-$player-height-small: 120px;
-$player-spacing: 20px;
-$player-spacing-inner: 15px;
-$player-spacing-left: 160px;

package/src/style/components/audio/_volumeslider.scss

@@ -1,41 +0,0 @@
-.bmpui-ui-volumeslider.bmpui-vertical {
-  top: auto;
-  right: 4px;
-  left: auto;
-  bottom: 20px;
-  position: absolute;
-  transition: none;
-  width: 20px;
-
-  .bmpui-seekbar-playbackposition-marker {
-    display: block;
-  }
-}
-
-.bmpui-ui-volumetogglebutton {
-  width: 24px;
-  height: 24px;
-  padding: 0;
-
-  .bmpui-label {
-    height: 24px;
-    width: 24px;
-  }
-}
-
-&.bmpui-player-state-playing,
-&.bmpui-player-state-paused,
-&.bmpui-player-state-idle,
-&.bmpui-player-state-prepared,
-&.bmpui-player-state-finished {
-  .bmpui-ui-volumetogglebutton {
-    display: block;
-  }
-}
-
-&.bmpui-layout-max-width-400,
-&.bmpui-layout-max-width-600 {
-  .bmpui-ui-volumetogglebutton {
-    margin: 0;
-  }
-}

package/src/style/components/vertical-video/_bottombar.scss

@@ -1,60 +0,0 @@
-.bmpui-ui-controlbar-bottom {
-  padding: 16px 8px !important;
-  display: flex;
-  width: 100%;
-  height: 100%;
-  align-items: flex-end;
-  pointer-events: none;
-
-  .bmpui-container-wrapper {
-    width: 100%;
-    pointer-events: all;
-    position: relative;
-    z-index: 1;
-  }
-
-  > .bmpui-container-wrapper {
-    display: flex;
-    flex-direction: column;
-  }
-}
-
-&.bmpui-controls-shown,
-&.bmpui-player-state-finished {
-  .bmpui-ui-controlbar-bottom {
-    opacity: 1;
-
-    &::before,
-    &::after {
-      content: '';
-      position: absolute;
-      width: 100%;
-      left: 0;
-      opacity: 0.7;
-    }
-
-    &::before {
-      height: 28%;
-      top: 0;
-      background: var(--npo-player-topcolor);
-    }
-
-    &::after {
-      bottom: 0;
-      height: 28%;
-      background: var(--npo-player-bottomcolor);
-    }
-  }
-}
-
-&:not(.bmpui-player-state-prepared):not(.bmpui-player-state-playing):not(.bmpui-player-state-paused) {
-  .bmpui-ui-controlbar-bottom .bmpui-container-wrapper {
-    display: none;
-  }
-}
-
-&.bmpui-player-state-finished {
-  .bmpui-ui-controlbar-bottom {
-    background: var(--npo-player-vertical-video-overlay-color);
-  }
-}

package/src/style/components/vertical-video/_buttons.scss

@@ -1,25 +0,0 @@
-.bmpui-vertical-video-controlbar-buttons .bmpui-container-wrapper {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-}
-
-.bmpui-ui-settingstogglebutton,
-.bmpui-ui-volumetogglebutton,
-.bmpui-ui-rewindbutton,
-.bmpui-ui-playbacktogglebutton,
-.bmpui-ui-forwardbutton,
-.bmpui-ui-fullscreentogglebutton {
-  width: 48px;
-  height: 48px;
-  padding: 0;
-  margin: 0 8px;
-
-  .bmpui-label {
-    width: 32px;
-    height: 32px;
-    margin: 8px;
-    max-width: 32px;
-    overflow: hidden;
-  }
-}

package/src/style/components/vertical-video/_hugeplaybacktogglebutton.scss

@@ -1,34 +0,0 @@
-&:not(.bmpui-player-state-prepared):not(.bmpui-player-state-playing):not(.bmpui-player-state-paused) {
-  .bmpui-ui-playbacktoggle-overlay {
-    display: none;
-    opacity: 0;
-    visibility: hidden;
-  }
-}
-
-&.bmpui-layout-max-width-400,
-&.bmpui-layout-max-width-600 {
-  &.bmpui-player-state-playing,
-  &.bmpui-player-state-paused,
-  &.bmpui-player-state-prepared {
-    .bmpui-ui-playbacktoggle-overlay {
-      display: block;
-    }
-  }
-}
-
-.bmpui-ui-hugeplaybacktogglebutton .bmpui-image {
-  &::after,
-  &:before {
-    z-index: z-index(hugeplayback-toggle-button);
-  }
-}
-
-&.bmpui-player-state-finished {
-  .bmpui-ui-playbacktoggle-overlay {
-    display: block !important;
-    opacity: 1 !important;
-    visibility: visible !important;
-    z-index: 3;
-  }
-}

package/src/style/components/vertical-video/_seekbar.scss

@@ -1,19 +0,0 @@
-.bmpui-controlbar-seekbar {
-  .bmpui-container-wrapper {
-    margin: 8px 0;
-
-    .bmpui-ui-playbacktimelabel {
-      font-family: var(--fontRegular);
-
-      &.bmpui-total-time {
-        opacity: 0.65;
-        font-weight: 400;
-      }
-    }
-  }
-
-  // hide scrubbing thumbnail
-  .bmpui-ui-seekbar-label {
-    display: none;
-  }
-}

package/src/style/components/vertical-video/_settingsbutton.scss

@@ -1,7 +0,0 @@
-.bmpui-vertical-video-controlbar-settings {
-  > .bmpui-container-wrapper {
-    margin: 8px 0;
-    display: flex;
-    justify-content: flex-end;
-  }
-}

package/src/style/components/vertical-video/_settingspanel.scss

@@ -1,31 +0,0 @@
-.bmpui-ui-settings-panel {
-  position: absolute;
-  bottom: 0;
-  left: 0;
-  width: 100%;
-  border-bottom-left-radius: 0;
-  border-bottom-right-radius: 0;
-
-  > .bmpui-container-wrapper {
-    margin: 0;
-  }
-
-  .bmpui-ui-settings-panel-page > .bmpui-container-wrapper {
-    padding-top: 48px;
-  }
-}
-
-.bmpui-ui-settingstogglebutton {
-  width: 32px;
-  height: 32px;
-  align-self: flex-end;
-  margin: 0;
-
-  .bmpui-label {
-    margin: 0;
-  }
-}
-
-.bmpui-ui-controlbar .bmpui-ui-settingstogglebutton {
-  margin: 16px 8px;
-}

package/src/style/components/vertical-video/_shortvideo.scss

@@ -1,14 +0,0 @@
-&.vertical-short-video {
-  .bmpui-ui-rewindbutton,
-  .bmpui-ui-forwardbutton {
-    display: none;
-  }
-
-  .bmpui-ui-playbacktimelabel {
-    display: none;
-  }
-
-  .bmpui-seekbar-playbackposition-marker {
-    display: none;
-  }
-}

package/src/style/components/vertical-video/_subtitles.scss

@@ -1,3 +0,0 @@
-&.bmpui-controls-shown .bmpui-ui-subtitle-overlay .bmpui-subtitle-region-container .bmpui-ui-subtitle-label {
-  bottom: 76px !important;
-}

package/src/style/components/vertical-video/_topbar.scss

@@ -1,58 +0,0 @@
-.bmpui-ui-titlebar {
-  z-index: z-index(title-bar);
-
-  .bmpui-container-wrapper {
-    padding: 16px;
-    display: flex;
-    flex-direction: column;
-  }
-
-  .bmpui-nicam {
-    order: 0;
-    justify-content: flex-end;
-    margin-bottom: 4px;
-    min-height: 32px;
-    height: 10%;
-
-    &:empty {
-      display: none;
-    }
-
-    .nicam-icon {
-      height: 100%;
-      margin-top: 0;
-    }
-  }
-
-  .bmpui-label-metadata-description {
-    @include max-lines(4)
-  }
-}
-
-&.bmpui-npo-player.bmpui-controls-shown,
-&.bmpui-npo-player.bmpui-controls-shown.bmpui-layout-max-width-400,
-&.bmpui-npo-player.bmpui-controls-shown.bmpui-layout-max-width-600 {
-  .bmpui-metadata,
-  .bmpui-label-metadata-title,
-  .bmpui-label-metadata-description {
-    display: block;
-    color: #fff;
-    opacity: 1;
-    margin: 4px 0;
-    order: 1;
-  }
-
-  .bmpui-label-metadata-description {
-    display: -webkit-box;
-  }
-}
-
-&.bmpui-show-nicam .bmpui-metadata {
-  display: none;
-}
-
-&.bmpui-player-state-finished.bmpui-controls-shown {
-  .bmpui-metadata {
-    display: none !important;
-  }
-}

package/src/style/components/vertical-video/_volumeslider.scss

@@ -1,9 +0,0 @@
-.bmpui-ui-volumeslider.bmpui-vertical {
-  bottom: 48px;
-  top: auto;
-  right: auto;
-
-  &::before {
-    opacity: 1;
-  }
-}