Fix overlay positioning

This commit is contained in:
Tamius Han 2024-12-27 04:40:30 +01:00
parent 35ca030dfb
commit 5d7d249fff
6 changed files with 19 additions and 15 deletions

View File

@ -1,6 +1,6 @@
<template> <template>
<div <div
class="context-spawn debug-1" class="context-spawn"
style="z-index: 1000;" style="z-index: 1000;"
v-if="!triggerZoneEditorVisible" v-if="!triggerZoneEditorVisible"
> >
@ -169,7 +169,7 @@
<div <div
v-if="triggerZoneEditorVisible" v-if="triggerZoneEditorVisible"
class="context-spawn" class="context-spawn"
style="z-index: 1000; border: 2px dashed red" style="z-index: 1000; border: 2px dashed red; overflow: hidden;"
> >
<TriggerZoneEditor <TriggerZoneEditor
class="uw-clickable" class="uw-clickable"
@ -573,7 +573,7 @@ export default {
} }
.uw-window { .uw-window {
position: absolute; position: fixed;
top: 10%; top: 10%;
left: 10%; left: 10%;
@ -608,9 +608,15 @@ export default {
.context-spawn { .context-spawn {
position: absolute; position: absolute;
top: 50%; top: 0;
left: 0; left: 0;
transform: translateY(-50%);
width: 100dvw;
height: 100dvh;
box-sizing: border-box;
overflow: hidden;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
align-content: center; align-content: center;
@ -618,8 +624,6 @@ export default {
// width: 100%; // width: 100%;
// height: 100%; // height: 100%;
padding: 2rem;
color: #fff; color: #fff;
// .context-item { // .context-item {

View File

@ -1,5 +1,5 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en"; style="position: relative">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="color-scheme" content="light dark"> <meta name="color-scheme" content="light dark">

View File

@ -1,12 +1,12 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en" style="position: relative">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="color-scheme" content="dark"> <meta name="color-scheme" content="dark">
<title>Ultrawidify - Content Script User Interface (in-player overlay)</title> <title>Ultrawidify - Content Script User Interface (in-player overlay)</title>
<!-- <link rel="stylesheet" href="csui.css"> --> <!-- <link rel="stylesheet" href="csui.css"> -->
</head> </head>
<body class="uw-ultrawidify-container-root" style="background-color: transparent"> <body class="uw-ultrawidify-container-root" style="background-color: transparent;">
<div id="app"></div> <div id="app"></div>
<script src="csui.js"></script> <script src="csui.js"></script>
</body> </body>

View File

@ -1,12 +1,12 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en" style="position: relative">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="color-scheme" content="light"> <meta name="color-scheme" content="light">
<title>Ultrawidify - Content Script User Interface (in-player overlay)</title> <title>Ultrawidify - Content Script User Interface (in-player overlay)</title>
<!-- <link rel="stylesheet" href="csui.css"> --> <!-- <link rel="stylesheet" href="csui.css"> -->
</head> </head>
<body class="uw-ultrawidify-container-root" style="background-color: transparent"> <body class="uw-ultrawidify-container-root" style="background-color: transparent;">
<div id="app"></div> <div id="app"></div>
<script src="csui.js"></script> <script src="csui.js"></script>
</body> </body>

View File

@ -1,11 +1,11 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en" style="position: relative">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Ultrawidify - Content Script User Interface (in-player overlay)</title> <title>Ultrawidify - Content Script User Interface (in-player overlay)</title>
<!-- <link rel="stylesheet" href="csui.css"> --> <!-- <link rel="stylesheet" href="csui.css"> -->
</head> </head>
<body class="uw-ultrawidify-container-root" style="background-color: transparent"> <body class="uw-ultrawidify-container-root" style="background-color: transparent;">
<div id="app"></div> <div id="app"></div>
<script src="csui.js"></script> <script src="csui.js"></script>
</body> </body>

View File

@ -1,5 +1,5 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en" style="position: relative">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Title</title> <title>Title</title>