mirror of
https://github.com/Grasscutters/GrassClipper.git
synced 2024-08-14 13:11:48 +08:00
fix positioning
This commit is contained in:
parent
d5736b490d
commit
c81c6b7a2d
@ -31,7 +31,7 @@
|
|||||||
"alwaysOnTop": false,
|
"alwaysOnTop": false,
|
||||||
"icon": "/resources/icons/appIcon.png",
|
"icon": "/resources/icons/appIcon.png",
|
||||||
"enableInspector": true,
|
"enableInspector": true,
|
||||||
"borderless": false,
|
"borderless": true,
|
||||||
"maximize": false,
|
"maximize": false,
|
||||||
"hidden": false,
|
"hidden": false,
|
||||||
"resizable": false,
|
"resizable": false,
|
||||||
|
@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "GrassClipper",
|
"name": "GrassClipper",
|
||||||
"version": "1.0.0",
|
"version": "0.2.0",
|
||||||
"repository": "https://github.com/Grasscutters/GrassClipper.git",
|
"repository": "https://github.com/Grasscutters/GrassClipper.git",
|
||||||
"author": "SpikeHD <spikegdofficial@gmail.com>",
|
"author": "SpikeHD <spikegdofficial@gmail.com>",
|
||||||
"license": "Apache-2.0",
|
"license": "Apache-2.0",
|
||||||
|
@ -3,10 +3,15 @@
|
|||||||
<head>
|
<head>
|
||||||
<link rel="stylesheet" type="text/css" href="style/index.css" />
|
<link rel="stylesheet" type="text/css" href="style/index.css" />
|
||||||
<script src="js/neutralino.js"></script>
|
<script src="js/neutralino.js"></script>
|
||||||
|
<script src="js/windowDrag.js"></script>
|
||||||
<script src="js/index.js"></script>
|
<script src="js/index.js"></script>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div id="controlBar">
|
<div id="controlBar">
|
||||||
|
<span id="titleSection">
|
||||||
|
GrassClipper
|
||||||
|
<span id="version">0.2.0</span>
|
||||||
|
</span>
|
||||||
<div id="minBtn" onclick="minimizeWin()">
|
<div id="minBtn" onclick="minimizeWin()">
|
||||||
<img src="icons/min.svg" alt="Minimize" />
|
<img src="icons/min.svg" alt="Minimize" />
|
||||||
</div>
|
</div>
|
||||||
|
@ -114,9 +114,11 @@ async function launchPrivate() {
|
|||||||
}
|
}
|
||||||
|
|
||||||
function minimizeWin() {
|
function minimizeWin() {
|
||||||
|
console.log('min')
|
||||||
Neutralino.window.minimize()
|
Neutralino.window.minimize()
|
||||||
}
|
}
|
||||||
|
|
||||||
function closeWin() {
|
function closeWin() {
|
||||||
|
console.log('close')
|
||||||
Neutralino.app.exit()
|
Neutralino.app.exit()
|
||||||
}
|
}
|
21
resources/js/windowDrag.js
Normal file
21
resources/js/windowDrag.js
Normal file
@ -0,0 +1,21 @@
|
|||||||
|
// https://stackoverflow.com/questions/67971689/positioning-the-borderless-window-in-neutralino-js
|
||||||
|
// had to use this since the in-built function breaks the close and minimize buttons
|
||||||
|
let dragging = false, posX, posY;
|
||||||
|
let draggable;
|
||||||
|
|
||||||
|
document.addEventListener('DOMContentLoaded', () => {
|
||||||
|
draggable = document.getElementById('controlBar');
|
||||||
|
|
||||||
|
draggable.onmousedown = function (e) {
|
||||||
|
posX = e.pageX, posY = e.pageY;
|
||||||
|
dragging = true;
|
||||||
|
}
|
||||||
|
|
||||||
|
draggable.onmouseup = function (e) {
|
||||||
|
dragging = false;
|
||||||
|
}
|
||||||
|
|
||||||
|
document.onmousemove = function (e) {
|
||||||
|
if (dragging) Neutralino.window.move(e.screenX - posX, e.screenY - posY);
|
||||||
|
}
|
||||||
|
})
|
@ -1,3 +1,5 @@
|
|||||||
|
html { user-select: none; }
|
||||||
|
|
||||||
body {
|
body {
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
height: 85vh;
|
height: 85vh;
|
||||||
@ -8,6 +10,7 @@ body {
|
|||||||
#controlBar {
|
#controlBar {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: row;
|
flex-direction: row;
|
||||||
|
align-items: center;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 0;
|
top: 0;
|
||||||
left: 0;
|
left: 0;
|
||||||
@ -20,11 +23,12 @@ body {
|
|||||||
#controlBar div {
|
#controlBar div {
|
||||||
color: #c3c3c3;
|
color: #c3c3c3;
|
||||||
width: 20px;
|
width: 20px;
|
||||||
|
height: 80%;
|
||||||
vertical-align: middle;
|
vertical-align: middle;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
padding: 0px 6px;
|
padding: 0px 6px;
|
||||||
margin: 0px 2px;
|
margin: 0px 2px;
|
||||||
padding-top: 4px;
|
padding-top: 6px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#controlBar div:hover {
|
#controlBar div:hover {
|
||||||
@ -32,10 +36,20 @@ body {
|
|||||||
background-color: #353535;
|
background-color: #353535;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#titleSection {
|
||||||
|
color: white;
|
||||||
|
padding-left: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#version {
|
||||||
|
display: inline-block;
|
||||||
|
color: #434343;
|
||||||
|
}
|
||||||
|
|
||||||
#controlBar div img {
|
#controlBar div img {
|
||||||
/* https://codepen.io/sosuke/pen/Pjoqqp */
|
/* https://codepen.io/sosuke/pen/Pjoqqp */
|
||||||
filter: invert(95%) sepia(0%) saturate(18%) hue-rotate(153deg) brightness(88%) contrast(81%);
|
filter: invert(95%) sepia(0%) saturate(18%) hue-rotate(153deg) brightness(88%) contrast(81%);
|
||||||
height: 70%;
|
height: 60%;
|
||||||
vertical-align: middle;
|
vertical-align: middle;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -132,7 +146,7 @@ body {
|
|||||||
/* Move the first official button to the position on the png */
|
/* Move the first official button to the position on the png */
|
||||||
#firstHalf button {
|
#firstHalf button {
|
||||||
position: relative;
|
position: relative;
|
||||||
transform: translate(115px, 480px);
|
transform: translate(140px, 500px);
|
||||||
width: 300px;
|
width: 300px;
|
||||||
height: 60px;
|
height: 60px;
|
||||||
}
|
}
|
||||||
@ -167,7 +181,7 @@ body {
|
|||||||
/* Move the second private button the near-bottom */
|
/* Move the second private button the near-bottom */
|
||||||
#secondControlContainer {
|
#secondControlContainer {
|
||||||
position: relative;
|
position: relative;
|
||||||
transform: translate(115px, 436px);
|
transform: translate(115px, 456px);
|
||||||
width: 300px;
|
width: 300px;
|
||||||
height: 60px;
|
height: 60px;
|
||||||
}
|
}
|
Loading…
x
Reference in New Issue
Block a user