mark/muzak
2
0
Fork 0
Code Issues Pull Requests Activity

template update for nominate

Browse Source
This commit is contained in:
Mark Hoekveen
2024-02-20 00:03:51 +01:00
parent 458402fb8b
commit fdbdebca2a
6 changed files with 80 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files
playlist/static/img/check.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 462 B

playlist/static/img/error.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 451 B

playlist/static/img/warning.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 458 B

playlist/static/style.css
+49 -1
View File
@@ -6,7 +6,7 @@ body {
margin: 0;
}
.window:not([role="tabpanel"]) {
#main-window {
position: fixed;
z-index:99;
min-height: 520px;
@@ -17,6 +17,53 @@ body {
display: flex;
flex-flow: column nowrap;
justify-content: space-between;
margin: 10px;
}
@media (max-width: 600px) {
#main-window {
margin: 0;
transform: none !important;
}
}
.hide {
display: none;
}
.window.popup {
position: fixed;
z-index: 100;
top: calc(50% - 75px);
left: calc(50% - 150px);
min-width: 300px;
}
.window.popup .window-body {
display: flex;
flex-flow: row nowrap;
}
.window.popup .window-body .text {
display: flex;
flex-flow: column nowrap;
justify-content: space-between;
}
.window.popup .window-body .icon {
width: 32px;
height: 32px;
padding: 16px;
background-position: center center;
background-attachment: fixed;
background-repeat: no-repeat;
background-image: url('img/check.png');
}
.window.popup .window-body .icon.error {
background-image: url('img/error.png');
}
.window.popup .window-body .icon.warning {
background-image: url('img/warning.png');
}
@media (max-width: 600px) {
@@ -29,6 +76,7 @@ body {
.window {
flex-grow: 1;
flex-shrink: 0;
max-width:calc(100% - 5px);
}
.window.hide {
playlist/templates/Base.html
+2 -2
View File
@@ -5,7 +5,7 @@
</head>
<body hx-headers='{"X-CSRFToken": "{{ csrf_token }}"}'>
<div class="window" id="main-window">
<div class="title-bar">
<div class="title-bar main-title-bar">
<div class="title-bar-text">
{% block window-title %}{% endblock %}
</div>
@@ -39,7 +39,7 @@
{% block clippy %}{% endblock %}
<script>
position.get_pos(); // Gets position from localStorage
interact('.title-bar').draggable({
interact('.main-title-bar').draggable({
listeners: {
move (event) {
position.x += event.dx
playlist/templates/Nominate.html
+29 -7
View File
@@ -5,16 +5,38 @@ Nomineren
{% endblock %}
{% block main-content %}
{% if warning %}
<div class="info warning">{{nominated}}: {{warning}}</div>
{% elif error %}
<div class="info error">{{nominated}}: {{error}}</div>
{% elif nominated %}
<div class="info">{{nominated}} Genomineerd!</div>
{% endif %}
<form method="post">
{% csrf_token %}
<input type="text" name="spotify_link" placeholder="Spotify-link">
<input type="submit" value="OK">
</form>
{% if nominated %}
<script>
function hidePopup() {
console.log("je moeder")
document.getElementById("info-window").classList.add("hide");
}
</script>
<div class="window popup" id="info-window">
<div class="title-bar">
<div class="title-bar-text">{{nominated}}</div>
<div class="title-bar-controls">
<button aria-label="Close" onclick="hidePopup()"></button>
</div>
</div>
<div class="window-body">
<div class="icon {% if warning %}warning{% elif error %}error{% endif %}"></div>
<div class="text">
<div>
{{warning}}
{{error}}
{% if not warning and not error %}Genomineerd!{% endif %}
</div>
<section class="field-row" style="justify-content: flex-end">
<button onclick="hidePopup()">Ok</button>
</section>
</div>
</div>
</div>
{% endif %}
{% endblock %}