dvorakmortonxd/dvorakmortonxd.dev
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

added ability to drag apps wherever on desktop theme

Browse source
This commit is contained in:
Martin Dvořák 2026-09-23 23:55:30 +02:00
commit cd1766619d
3 changed files with 566 additions and 83 deletions
Download patch file Download diff file Expand all files Collapse all files

51
src/app/skeuo.css
View file

@ -93,6 +93,18 @@ html[data-device="phone"] .skeuo-mobile-root { display: block; }
cursor: default;
text-shadow: 0 1px 3px rgba(0, 0, 0, 0.95);
transition: background-color 0.12s ease, border-color 0.12s ease;
/* Icons are dragged by our own pointer handlers. Without this, the browser's
native image/link drag hijacks the gesture (it fires pointercancel), which
broke dragging for icons whose glyph is an <img> - the friend shortcuts. */
-webkit-user-drag: none;
user-select: none;
}
.win-icon img,
.win-icon-glyph img,
.win-icon-label {
-webkit-user-drag: none;
user-drag: none;
pointer-events: none;
}
.win-icon:hover,
.win-icon.selected {
@ -151,6 +163,45 @@ a.win-icon {
opacity: 0.92;
}
/* The three default stacks are laid out once so the grid columns can be read
off them. They stay in the DOM (keeping the same metrics) but must never be
seen or clicked - the visible icons all come from .win-icon-layer. */
.win-icons.win-measure {
visibility: hidden;
pointer-events: none;
z-index: 0;
}
/* Icon grid layer: every icon is absolutely positioned on the grid. The layer
itself is click-through so empty-desktop clicks still reach the desktop
(closing the launcher / clearing the selection). */
.win-icon-layer {
position: absolute;
inset: 0;
pointer-events: none;
z-index: 1;
}
.win-icon-layer .win-icon {
position: absolute;
pointer-events: auto;
}
/* Translucent copy of the icon that follows the cursor while dragging. */
.win-icon-ghost {
position: fixed;
z-index: 9999;
margin: 0;
pointer-events: none;
cursor: grabbing;
transform-origin: top left;
opacity: 0.9;
border-color: rgba(61, 174, 233, 0.9) !important;
background: rgba(61, 174, 233, 0.22) !important;
box-shadow: 0 12px 26px rgba(0, 0, 0, 0.55);
filter: drop-shadow(0 6px 12px rgba(0, 0, 0, 0.45));
will-change: transform;
}
/* Window layer */
.win-layer {
position: absolute;