Creepso/Wplace-Overlay-Pro
1
0
Fork 0
mirror of https://github.com/ShinkoNet/Wplace-Overlay-Pro.git synced 2026-04-20 02:32:07 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

v3.1.1 ui improvements

Browse source
This commit is contained in:
ShinkoNet 2025-08-12 18:09:35 +10:00
parent 1a563815b6
commit 85f724d5cc
3 changed files with 18 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/meta.js
View file

@ -1,7 +1,7 @@
// ==UserScript==
// @name Wplace Overlay Pro
// @namespace http://tampermonkey.net/
// @version 3.0.0
// @version 3.1.1
// @description Overlays tiles on wplace.live. Can also resize, and color-match your overlay to wplace's palette. Make sure to comply with the site's Terms of Service, and rules! This script is not affiliated with Wplace.live in any way, use at your own risk. This script is not affiliated with TamperMonkey. The author of this userscript is not responsible for any damages, issues, loss of data, or punishment that may occur as a result of using this script. This script is provided "as is" under GPLv3.
// @author shinkonet
// @match https://wplace.live/*

24
src/ui/panel.ts
View file

@ -67,23 +67,27 @@ export function createUI() {
<span class="op-title-text">Positioning</span>
</div>
<div class="op-title-right">
<span class="op-muted" id="op-offset-indicator">Offset X 0, Y 0</span>
<button class="op-chevron" id="op-collapse-positioning" title="Collapse/Expand">▾</button>
</div>
</div>
<div id="op-positioning-body">
<div class="op-row space">
<div>
<div class="op-row-col">
<div class="op-row space-between">
<span class="op-muted" id="op-place-label">Place overlay:</span>
<div class="op-small-text">Click a pixel on the canvas to set the anchor.</div>
<span class="op-muted" id="op-offset-indicator">Offset X 0, Y 0</span>
</div>
<button class="op-button" id="op-autocap-toggle" title="Capture next clicked pixel as anchor">Disabled</button>
</div>
<div class="op-nudge-row" style="text-align: right;">
<button class="op-icon-btn" id="op-nudge-left" title="Left">←</button>
<button class="op-icon-btn" id="op-nudge-down" title="Down">↓</button>
<button class="op-icon-btn" id="op-nudge-up" title="Up">↑</button>
<button class="op-icon-btn" id="op-nudge-right" title="Right">→</button>
<div class="op-row">
<button class="op-button" id="op-autocap-toggle" title="Capture next clicked pixel as anchor">Disabled</button>
<div class="op-nudge-row" style="margin-left:auto;">
<button class="op-icon-btn" id="op-nudge-left" title="Left">←</button>
<button class="op-icon-btn" id="op-nudge-down" title="Down">↓</button>
<button class="op-icon-btn" id="op-nudge-up" title="Up">↑</button>
<button class="op-icon-btn" id="op-nudge-right" title="Right">→</button>
</div>
</div>
<div class="op-row center">
<div class="op-small-text">Click a pixel on the canvas to set the anchor.</div>
</div>
</div>
</div>

3
src/ui/styles.ts
View file

@ -50,6 +50,9 @@ export function injectStyles() {
.op-row { display: flex; align-items: center; gap: 8px; }
.op-row.space { justify-content: space-between; }
.op-row.center { justify-content: center; text-align: center; }
.op-row-col { display: flex; flex-direction: column; gap: 4px; }
.space-between { justify-content: space-between; }
.op-small-text { font-size: 11px; color: var(--op-muted); }
.op-button { background: var(--op-btn); color: var(--op-text); border: 1px solid var(--op-btn-border); border-radius: 10px; padding: 6px 10px; cursor: pointer; }