Fixes to mobile video setting passthrough issues

This commit is contained in:
WardPearce
2025-05-29 15:45:19 +12:00
parent bc50964521
commit 3e7d798faf
5 changed files with 81 additions and 22 deletions
+2 -2
View File
@@ -1,12 +1,12 @@
{
"name": "Materialious",
"version": "1.8.3",
"version": "1.8.4",
"lockfileVersion": 3,
"requires": true,
"packages": {
"": {
"name": "Materialious",
"version": "1.8.3",
"version": "1.8.4",
"license": "MIT",
"dependencies": {
"@capacitor-community/electron": "^5.0.0",
@@ -116,7 +116,7 @@
onclick={() => (playerElement.currentTime = cue.startTime)}
class:secondary-container={currentTime >= cue.startTime && currentTime <= cue.endTime}
>
<p class="chip no-margin">{videoLength(cue.startTime)}</p>
<p class="chip no-margin no-padding">{videoLength(cue.startTime)}</p>
<p class="transcript-text">{decodeHtmlCharCodes(cue.text.replace(/<[^>]+>/g, ''))}</p>
</div>
{/each}
@@ -145,8 +145,4 @@
.transcript-text {
margin-left: 1em;
}
.transcript-line .chip {
padding: 0 1.5em;
}
</style>
+1 -6
View File
@@ -17,10 +17,6 @@ main.root {
overflow-y: auto;
}
article, dialog {
border-radius: .25rem !important;
}
.row {
padding: 1em !important;
}
@@ -79,6 +75,5 @@ button.row:hover {
position: fixed !important;
top: 20% !important;
width: 100% !important;
background-color: var(--surface-variant) !important;
}
}
}
@@ -123,7 +123,8 @@
transition: none !important;
opacity: 1 !important;
visibility: visible !important;
z-index: 9999 !important;
z-index: 99999999 !important;
pointer-events: auto !important;
pointer-events: auto !important;
}
@@ -157,10 +158,18 @@
padding-left: 0.3125rem; /* 5px */
}
.shaka-overflow-menu * {
z-index: 99999999 !important;
pointer-events: auto !important;
}
.youtube-theme .shaka-overflow-menu button,
.youtube-theme .shaka-settings-menu button {
padding: 0;
margin-bottom: 0.5em;
visibility: visible !important;
z-index: 99999999 !important;
pointer-events: auto !important;
}
.youtube-theme .shaka-overflow-menu button i {
@@ -174,6 +183,10 @@
outline: none;
height: 2.5rem; /* 40px */
flex: 0 0 100%;
visibility: visible !important;
z-index: 99999999 !important;
pointer-events: auto !important;
pointer-events: auto !important;
}
.shaka-settings-menu {
@@ -264,11 +277,65 @@
@media screen and (max-width: 650px) {
.youtube-theme .shaka-overflow-menu,
.youtube-theme .shaka-settings-menu {
min-width: 100%;
position: fixed;
top: 75%;
left: 50%;
height: 50vh;
transform: translate(-50%, -50%);
width: 100% !important;
min-width: 100% !important;
position: fixed !important;
top: 100% !important;
left: 50% !important;
height: 50vh !important;
transform: translate(-50%, -50%) !important;
pointer-events: all !important;
z-index: 99999999 !important;
pointer-events: auto !important;
opacity: 1 !important;
visibility: visible !important;
padding: 1rem !important;
box-shadow: var(--elevate2);
background-color: var(--surface-container);
z-index: 11;
inset: auto auto 0 0;
inline-size: 100%;
max-block-size: 50vh;
max-inline-size: none !important;
overflow-x: hidden;
overflow-y: auto;
font-size: 0.875rem;
font-weight: 400;
text-transform: none;
color: var(--on-surface);
line-height: normal;
text-align: start;
border-radius: 0.25rem;
transition:
all var(--speed2),
0s background-color;
}
.youtube-theme .shaka-overflow-menu::before,
.youtube-theme .shaka-settings-menu::before {
content: '' !important;
position: fixed !important;
top: 0 !important;
left: 0 !important;
width: 100vw !important;
height: 100vh !important;
background: transparent !important;
z-index: 99999998 !important;
pointer-events: auto !important;
}
.youtube-theme .shaka-overflow-menu:hover,
.youtube-theme .shaka-settings-menu:hover {
z-index: 99999998 !important;
pointer-events: auto !important;
opacity: 1 !important;
visibility: visible !important;
}
#shaka-container {
z-index: 99999998 !important;
pointer-events: auto !important;
opacity: 1 !important;
visibility: visible !important;
}
}
@@ -238,10 +238,11 @@
if (playerElement) {
playerElement.addEventListener('timeupdate', () => {
if (!playerElement) return;
playerCurrentTime = playerElement.currentTime;
});
playerElement.addEventListener('end', async () => {
playerElement.addEventListener('ended', async () => {
if (playlistVideos.length === 0) {
if ($playerAutoplayNextByDefaultStore) {
goto(`/watch/${data.video.recommendedVideos[0].videoId}`);
@@ -504,7 +505,7 @@
<i>width_wide</i>
<div class="tooltip">{$_('player.theatreMode')}</div>
</button>
{#if data.video.lengthSeconds > 60 && !data.video.hlsUrl}
{#if data.video.lengthSeconds > 360 && !data.video.hlsUrl}
<button
onclick={() => {
if (pauseTimeout) {