Fix video layout on touch enabled devices (#2501)

ui/v2.5/src/components/Changelog/Changelog.tsx

@@ -18,6 +18,7 @@ import V0120 from "./versions/v0120.md";
 import V0130 from "./versions/v0130.md";
 import V0131 from "./versions/v0131.md";
 import V0140 from "./versions/v0140.md";
+import V0150 from "./versions/v0150.md";
 import { MarkdownPage } from "../Shared/MarkdownPage";
 
 // to avoid use of explicit any
@@ -56,9 +57,9 @@ const Changelog: React.FC = () => {
   // after new release:
   // add entry to releases, using the current* fields
   // then update the current fields.
-  const currentVersion = stashVersion || "v0.14.0";
+  const currentVersion = stashVersion || "v0.15.0";
   const currentDate = buildDate;
-  const currentPage = V0140;
+  const currentPage = V0150;
 
   const releases: IStashRelease[] = [
     {
@@ -67,6 +68,11 @@ const Changelog: React.FC = () => {
       page: currentPage,
       defaultOpen: true,
     },
+    {
+      version: "v0.14.0",
+      date: "2022-04-11",
+      page: V0140,
+    },
     {
       version: "v0.13.1",
       date: "2022-03-16",

ui/v2.5/src/components/Changelog/versions/v0150.md

@@ -0,0 +1,2 @@
+### 🐛 Bug fixes
+* Fix incorrect video player positioning on touch-enabled devices. ([#2501](https://github.com/stashapp/stash/issues/2501))

ui/v2.5/src/components/ScenePlayer/styles.scss

@@ -57,10 +57,8 @@ $sceneTabWidth: 450px;
     }
   }
 
+  @media (pointer: coarse) {
     .vjs-touch-enabled {
-    margin: 0 -15px;
-    width: 100vw;
-
       &.vjs-has-started .vjs-big-button-group {
         display: flex;
         opacity: 1;
@@ -93,6 +91,7 @@ $sceneTabWidth: 450px;
         display: none;
       }
     }
+  }
 
   // make controls a little more compact on smaller screens
   @media (max-width: 576px) {
@@ -216,6 +215,11 @@ $sceneTabWidth: 450px;
   .scene-tabs {
     padding-right: 15px;
   }
+
+  .scene-player-container {
+    padding-left: 0;
+    padding-right: 0;
+  }
 }
 @media (min-width: 1200px) {
   .scene-tabs {