apply common naming scheme to touchcontroloverlay

bitmovin · Dec 11, 2024 · 563add2 · 563add2
1 parent 70b519a
commit 563add2
Show file tree

Hide file tree

Showing 3 changed files with 8 additions and 19 deletions.
diff --git a/src/scss/skin-super-modern/_skin.scss b/src/scss/skin-super-modern/_skin.scss
@@ -47,7 +47,7 @@
   @import 'components/spacer';
   @import 'components/subtitlesettings/subtitlesettings';
   @import 'components/subtitlesettingspaneltogglebutton';
-  @import 'components/touch-control-overlay';
+  @import 'components/touchcontroloverlay';
   @import 'components/smallcenteredplaybacktogglebutton';
   @import 'components/loadingicon';
   @import 'skin-ads';

diff --git a/...rn/components/_touch-control-overlay.scss → ...dern/components/_touchcontroloverlay.scss b/...rn/components/_touch-control-overlay.scss → ...dern/components/_touchcontroloverlay.scss
@@ -1,12 +1,7 @@
 @import '../variables';
 @import '../mixins';
 
-// sass-lint:disable no-vendor-prefixes
 %opacity-transition {
-  -moz-transition: opacity .25s ease;
-  -ms-transition: opacity .25s ease;
-  -o-transition: opacity .25s ease;
-  -webkit-transition: opacity .25s ease;
   transition:  opacity .25s ease-out;
 }
 
@@ -23,15 +18,15 @@
 
 %seek-label {
   @extend %opacity-transition;
-  font-size: .4em;
-  font-weight: 600;
+  @include hidden-animated;
+  font-weight: 500;
   margin: 0;
   opacity: 1;
   position: absolute;
   text-shadow: $color-shadow-seek-label;
 }
 
-.#{$prefix}-ui-touchcontrol-overlay {
+.#{$prefix}-ui-touch-control-overlay {
   @extend %ui-container;
   @include layout-cover;
 
@@ -47,20 +42,14 @@
 
     .#{$prefix}-seek-forward-label {
       @extend %seek-label;
-      right: 15%;
 
-      &.#{$prefix}-hidden {
-        opacity: 0;
-      }
+      right: 10%;
     }
 
     .#{$prefix}-seek-backward-label {
       @extend %seek-label;
-      left: 15%;
 
-      &.#{$prefix}-hidden {
-        opacity: 0;
-      }
+      left: 10%;
     }
   }
 

diff --git a/src/ts/components/touchcontroloverlay.ts b/src/ts/components/touchcontroloverlay.ts
@@ -83,11 +83,11 @@ export class TouchControlOverlay extends Container<TouchControlOverlayConfig> {
     this.seekBackwardLabel = new Label({text: '', for: this.getConfig().id, cssClass: 'seek-backward-label', hidden: true});
 
     this.config = this.mergeConfig(config, {
-      cssClass: 'ui-touchcontrol-overlay',
+      cssClass: 'ui-touch-control-overlay',
       acceptsTouchWithUiHidden: true,
       seekTime: 10,
       seekDoubleTapMargin: 15,
-      components: [this.playbackToggleButton, this.seekForwardLabel, this.seekBackwardLabel],
+      components: [this.seekBackwardLabel, this.playbackToggleButton, this.seekForwardLabel],
     }, this.config);
   }