magnus/smon
1
0
Fork 0
Code Issues 1 Pull requests Projects Releases 6 Packages Wiki Activity

Refactored time selecting

Browse source
This commit is contained in:
Magnus Åhall 2024-06-29 20:50:57 +02:00
parent 02794e9629
commit cd8765e0f2
12 changed files with 122 additions and 56 deletions
Download patch file Download diff file Expand all files Collapse all files

22
static/css/default_light/datapoints.css
View file

@ -85,8 +85,8 @@
}
.value-selector button {
width: 100px;
align-self: end;
justify-self: end;
margin-top: 16px;
}
.graph {
width: 99%;
@ -98,9 +98,23 @@
}
.time-offset {
display: grid;
grid-template-columns: repeat(3, min-content);
gap: 6px 12px;
grid-template-columns: min-content repeat(3, min-content);
grid-gap: 16px;
margin-top: 16px;
align-items: center;
justify-items: center;
margin-top: 8px;
}
.time-offset .header-1 {
font-weight: bold;
justify-self: start;
}
.time-offset .header-2 {
font-weight: bold;
justify-self: start;
grid-column: 2 / -1;
}
.time-offset .preset {
white-space: nowrap;
justify-self: start;
padding-right: 32px;
}

2
static/css/default_light/notifications.css
View file

@ -2,8 +2,6 @@
display: grid;
grid-template-columns: min-content min-content;
grid-gap: 6px 16px;
padding: 16px;
border: 1px solid #7bb8eb;
width: min-content;
border-radius: 6px;
}

22
static/css/gruvbox/datapoints.css
View file

@ -85,8 +85,8 @@
}
.value-selector button {
width: 100px;
align-self: end;
justify-self: end;
margin-top: 16px;
}
.graph {
width: 99%;
@ -98,9 +98,23 @@
}
.time-offset {
display: grid;
grid-template-columns: repeat(3, min-content);
gap: 6px 12px;
grid-template-columns: min-content repeat(3, min-content);
grid-gap: 16px;
margin-top: 16px;
align-items: center;
justify-items: center;
margin-top: 8px;
}
.time-offset .header-1 {
font-weight: bold;
justify-self: start;
}
.time-offset .header-2 {
font-weight: bold;
justify-self: start;
grid-column: 2 / -1;
}
.time-offset .preset {
white-space: nowrap;
justify-self: start;
padding-right: 32px;
}

2
static/css/gruvbox/notifications.css
View file

@ -2,8 +2,6 @@
display: grid;
grid-template-columns: min-content min-content;
grid-gap: 6px 16px;
padding: 16px;
border: 1px solid #777;
width: min-content;
border-radius: 6px;
}

12
static/js/datapoint_values.js
View file

@ -1,7 +1,13 @@
function preset(hours) {
const inputPreset = document.querySelector('input[name="preset"]')
inputPreset.value = hours
inputPreset.form.submit()
}
function offsetTime(seconds) {
const el = document.getElementById('offset-time')
el.value = seconds
el.form.submit()
const inputPreset = document.querySelector('input[name="offset-time"]')
inputPreset.value = seconds
inputPreset.form.submit()
}
class Graph {

26
static/less/datapoints.less
View file

@ -102,8 +102,8 @@
button {
width: 100px;
align-self: end;
justify-self: end;
margin-top: 16px;
}
}
@ -119,9 +119,27 @@
.time-offset {
display: grid;
grid-template-columns: repeat(3, min-content);
gap: 6px 12px;
grid-template-columns: min-content repeat(3, min-content);
grid-gap: 16px;
margin-top: 16px;
align-items: center;
justify-items: center;
margin-top: 8px;
.header-1 {
font-weight: bold;
justify-self: start;
}
.header-2 {
font-weight: bold;
justify-self: start;
grid-column: ~"2 / -1";
}
.preset {
white-space: nowrap;
justify-self: start;
padding-right: 32px;
}
}

3
static/less/notifications.less
View file

@ -5,13 +5,10 @@
grid-template-columns: min-content min-content;
grid-gap: 6px 16px;
padding: 16px;
border: 1px solid @text3;
width: min-content;
border-radius: 6px;
button {
//grid-column: ~"1 / -1";
width: 100px;
margin-top: 12px;
justify-self: end;