Updates
This commit is contained in:
@@ -17,16 +17,7 @@
|
|||||||
<body data-page="config">
|
<body data-page="config">
|
||||||
<div class="mobile-control-strip">
|
<div class="mobile-control-strip">
|
||||||
<div class="taskbar-shell">
|
<div class="taskbar-shell">
|
||||||
<div class="taskbar-program-list">
|
<div class="taskbar-program-list" data-role="taskbar-program-list"></div>
|
||||||
<button class="taskbar-program-btn" type="button" data-role="open-window" data-target="theme-tool-window" aria-label="Open theme picker">
|
|
||||||
<img class="taskbar-icon" src="/static/img/Windows Icons - PNG/main.cpl_14_109-1.png" alt="">
|
|
||||||
<span>ThemePicker.exe</span>
|
|
||||||
</button>
|
|
||||||
<button class="taskbar-program-btn" type="button" data-role="open-window" data-target="mode-tool-window" aria-label="Open display mode settings">
|
|
||||||
<img class="taskbar-icon" data-role="mode-icon" src="/static/img/Windows Icons - PNG/desk.cpl_14_40-0.png" alt="">
|
|
||||||
<span>DisplayMode.exe</span>
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@@ -186,7 +177,22 @@
|
|||||||
</section>
|
</section>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<section id="theme-tool-window" class="window ui-tool-window hidden" role="dialog" aria-modal="false" aria-labelledby="theme-tool-title">
|
<section
|
||||||
|
id="theme-tool-window"
|
||||||
|
class="window ui-tool-window hidden"
|
||||||
|
role="dialog"
|
||||||
|
aria-modal="false"
|
||||||
|
aria-labelledby="theme-tool-title"
|
||||||
|
data-ui-window
|
||||||
|
data-window-title="ThemePicker.exe"
|
||||||
|
data-window-rights="all"
|
||||||
|
data-window-order="10"
|
||||||
|
data-window-default-left="16"
|
||||||
|
data-window-default-top="88"
|
||||||
|
data-window-default-width="390"
|
||||||
|
data-window-default-height="250"
|
||||||
|
data-window-icons='{"win98":"/static/img/Windows Icons - PNG/main.cpl_14_109-1.png","modern":"/static/img/Windows Icons - PNG/msconfig.exe_14_128-0.png","none":"/static/img/Windows Icons - PNG/taskmgr.exe_14_118-1.png","default":"/static/img/Windows Icons - PNG/main.cpl_14_109-1.png"}'
|
||||||
|
>
|
||||||
<div class="title-bar ui-tool-title-bar" data-role="drag-handle">
|
<div class="title-bar ui-tool-title-bar" data-role="drag-handle">
|
||||||
<span id="theme-tool-title">ThemePicker.exe</span>
|
<span id="theme-tool-title">ThemePicker.exe</span>
|
||||||
<div class="title-bar-controls">
|
<div class="title-bar-controls">
|
||||||
@@ -212,7 +218,22 @@
|
|||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<section id="mode-tool-window" class="window ui-tool-window hidden" role="dialog" aria-modal="false" aria-labelledby="mode-tool-title">
|
<section
|
||||||
|
id="mode-tool-window"
|
||||||
|
class="window ui-tool-window hidden"
|
||||||
|
role="dialog"
|
||||||
|
aria-modal="false"
|
||||||
|
aria-labelledby="mode-tool-title"
|
||||||
|
data-ui-window
|
||||||
|
data-window-title="DisplayMode.exe"
|
||||||
|
data-window-rights="all"
|
||||||
|
data-window-order="20"
|
||||||
|
data-window-default-left="424"
|
||||||
|
data-window-default-top="88"
|
||||||
|
data-window-default-width="340"
|
||||||
|
data-window-default-height="190"
|
||||||
|
data-window-icons='{"win98":"/static/img/Windows Icons - PNG/desk.cpl_14_40-0.png","modern":"/static/img/Windows Icons - PNG/desk.cpl_14_100-0.png","none":"/static/img/Windows Icons - PNG/timedate.cpl_14_200-6.png","default":"/static/img/Windows Icons - PNG/desk.cpl_14_40-0.png"}'
|
||||||
|
>
|
||||||
<div class="title-bar ui-tool-title-bar" data-role="drag-handle">
|
<div class="title-bar ui-tool-title-bar" data-role="drag-handle">
|
||||||
<span id="mode-tool-title">DisplayMode.exe</span>
|
<span id="mode-tool-title">DisplayMode.exe</span>
|
||||||
<div class="title-bar-controls">
|
<div class="title-bar-controls">
|
||||||
@@ -231,16 +252,7 @@
|
|||||||
|
|
||||||
<footer class="taskbar desktop-taskbar" aria-label="Desktop taskbar">
|
<footer class="taskbar desktop-taskbar" aria-label="Desktop taskbar">
|
||||||
<div class="taskbar-shell">
|
<div class="taskbar-shell">
|
||||||
<div class="taskbar-program-list">
|
<div class="taskbar-program-list" data-role="taskbar-program-list"></div>
|
||||||
<button class="taskbar-program-btn" type="button" data-role="open-window" data-target="theme-tool-window" aria-label="Open theme picker">
|
|
||||||
<img class="taskbar-icon" src="/static/img/Windows Icons - PNG/main.cpl_14_109-1.png" alt="">
|
|
||||||
<span>ThemePicker.exe</span>
|
|
||||||
</button>
|
|
||||||
<button class="taskbar-program-btn" type="button" data-role="open-window" data-target="mode-tool-window" aria-label="Open display mode settings">
|
|
||||||
<img class="taskbar-icon" data-role="mode-icon" src="/static/img/Windows Icons - PNG/desk.cpl_14_40-0.png" alt="">
|
|
||||||
<span>DisplayMode.exe</span>
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</footer>
|
</footer>
|
||||||
|
|
||||||
|
|||||||
@@ -616,6 +616,28 @@ body.is-dragging-window .ui-tool-title-bar {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@media (max-width: 899px) {
|
||||||
|
.ui-tool-window {
|
||||||
|
top: 2.85rem !important;
|
||||||
|
left: 0 !important;
|
||||||
|
right: 0 !important;
|
||||||
|
bottom: 0 !important;
|
||||||
|
width: 100vw !important;
|
||||||
|
height: calc(100dvh - 2.85rem) !important;
|
||||||
|
min-width: 0;
|
||||||
|
min-height: 0;
|
||||||
|
max-width: 100vw;
|
||||||
|
max-height: calc(100dvh - 2.85rem);
|
||||||
|
resize: none;
|
||||||
|
overflow: auto;
|
||||||
|
transform: none !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ui-tool-title-bar {
|
||||||
|
cursor: default;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
@media (min-width: 2560px), (min-resolution: 2dppx) {
|
@media (min-width: 2560px), (min-resolution: 2dppx) {
|
||||||
:root {
|
:root {
|
||||||
--ui-scale: 1.24;
|
--ui-scale: 1.24;
|
||||||
|
|||||||
@@ -12,6 +12,10 @@
|
|||||||
let floatingWindowZ = 80;
|
let floatingWindowZ = 80;
|
||||||
let windowLayouts = {};
|
let windowLayouts = {};
|
||||||
|
|
||||||
|
function isMobileViewport() {
|
||||||
|
return window.matchMedia('(max-width: 899px)').matches;
|
||||||
|
}
|
||||||
|
|
||||||
function applyTheme(theme) {
|
function applyTheme(theme) {
|
||||||
const normalized = theme || DEFAULT_THEME;
|
const normalized = theme || DEFAULT_THEME;
|
||||||
document.documentElement.setAttribute('data-ui-theme', normalized);
|
document.documentElement.setAttribute('data-ui-theme', normalized);
|
||||||
@@ -164,6 +168,12 @@
|
|||||||
if (!id) {
|
if (!id) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
if (isMobileViewport()) {
|
||||||
|
windowEl.style.right = 'auto';
|
||||||
|
windowEl.style.bottom = 'auto';
|
||||||
|
windowEl.style.transform = 'none';
|
||||||
|
return;
|
||||||
|
}
|
||||||
const defaults = DEFAULT_WINDOW_LAYOUTS[id];
|
const defaults = DEFAULT_WINDOW_LAYOUTS[id];
|
||||||
const saved = windowLayouts[id];
|
const saved = windowLayouts[id];
|
||||||
const normalized = normalizeLayout(saved, defaults);
|
const normalized = normalizeLayout(saved, defaults);
|
||||||
@@ -208,6 +218,9 @@
|
|||||||
if (!windowEl || windowEl.classList.contains('hidden')) {
|
if (!windowEl || windowEl.classList.contains('hidden')) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
if (isMobileViewport()) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
bringWindowToFront(windowEl);
|
bringWindowToFront(windowEl);
|
||||||
const rect = windowEl.getBoundingClientRect();
|
const rect = windowEl.getBoundingClientRect();
|
||||||
@@ -269,6 +282,9 @@
|
|||||||
if (windowEl.classList.contains('hidden')) {
|
if (windowEl.classList.contains('hidden')) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
if (isMobileViewport()) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
persistWindowLayout(windowEl);
|
persistWindowLayout(windowEl);
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
@@ -285,6 +301,9 @@
|
|||||||
});
|
});
|
||||||
|
|
||||||
window.addEventListener('resize', () => {
|
window.addEventListener('resize', () => {
|
||||||
|
if (isMobileViewport()) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
document.querySelectorAll('.ui-tool-window').forEach((windowEl) => {
|
document.querySelectorAll('.ui-tool-window').forEach((windowEl) => {
|
||||||
const id = windowEl.id;
|
const id = windowEl.id;
|
||||||
if (!id) {
|
if (!id) {
|
||||||
|
|||||||
Reference in New Issue
Block a user