incubator/netclock
1
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

Style created countdowns
All checks were successful
continuous-integration/drone/push Build is passing
Details

Browse source
This commit is contained in:
Armin Friedl 2020-09-13 22:24:58 +02:00
parent 142ff73e01
commit cec8811dfc
Signed by: armin
GPG key ID: 48C726EEE7FBCBC8
4 changed files with 84 additions and 19 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

34
countdown/templates/countdown/created.html
View file

@ -3,26 +3,28 @@
{% block body %}
<div id="created-countdowns">
{% for countdown in countdowns %}
<div class="created-countdown" countdown-id="{{ countdown }}">
<div class="created-countdown-header">
<h1>Countdown {{ loop.index }}</h1>
<div class="created-countdown-time"></div>
<div class="created-countdown-info"></div>
<div class="created-countdown-link">
<a href="{{ countdown }}">Link</a>
<div class="center">
<div id="created-countdowns">
{% for countdown in countdowns %}
<div class="created-countdown" countdown-id="{{ countdown }}">
<div class="created-countdown-header">
<h1>Countdown {{ loop.index }}</h1>
<div class="created-countdown-time">00:00:00</div>
<div class="created-countdown-info">Loading...</div>
<div class="created-countdown-link">
<a href="{{ countdown }}" target="_blank">Share</a>
</div>
</div>
<div class="created-countdown-controls">
<button class="created-countdown-start" type="button" name="start" value="{{ countdown }}">Start</button>
<button class="created-countdown-stop" type="button" name="stop" value="{{ countdown }}">Stop</button>
<button class="created-countdown-reset" type="button" name="reset" value="{{ countdown }}">Reset</button>
</div>
</div>
<div class="created-countdown-controls">
<button class="created-countdown-start" type="button" name="start" value="{{ countdown }}">Start</button>
<button class="created-countdown-stop" type="button" name="stop" value="{{ countdown }}">Stop</button>
<button class="created-countdown-reset" type="button" name="reset" value="{{ countdown }}">Reset</button>
</div>
{% endfor %}
</div>
{% endfor %}
</div>
</div>
{% endblock body %}
{% block scripts %}

4
countdown/templates/countdown/created.js
View file

@ -25,8 +25,8 @@ let formatTime = (h, m, s) => {
let mtext = padTime(m);
let stext = padTime(s);
htext = htext !== "00" ? htext + ":" : "";
mtext = mtext !== "00" || htext !== "00" ? mtext + ":" : "";
htext = htext + ":";
mtext = mtext + ":";
return htext + mtext + stext;
};

63
countdown/templates/countdown/created.scss
View file

@ -0,0 +1,63 @@
#created-countdowns {
display: flex;
flex-wrap: wrap;
justify-content: center;
}
.created-countdown {
border: 0;
box-shadow: 0 .25rem 1rem rgba(48,55,66,.15);
padding: 1rem;
padding-bottom: 0.3rem;
margin: 1rem;
}
.created-countdown-controls {
margin-top: 0.5rem;
padding-top: 0.5rem;
border-top: solid;
border-top-width: 1px;
button {
display: block;
width: 100%;
margin-bottom: 0.5rem;
padding: 0.2rem;
background-color: white;
border-style: solid;
border-width: 1px;
border-top-color: #F0F0F0;
border-left-color: #F0F0F0;
border-bottom-color: #E3E3E3;
border-right-color: #E3E3E3;
font-size: 1.3em;
cursor: pointer;
}
}
.created-countdown-header {
h1 {
color: lightgrey;
font-variant: all-petite-caps;
font-size: 1em;
text-align: right;
margin-top: -0.5rem;
}
.created-countdown-time {
font-size: 3em;
text-align: right;
margin-top: 1.5rem;
margin-bottom: 1.5rem;
}
.created-countdown-info {
font-size: 1em;
display: inline;
}
.created-countdown-link {
font-size: 1em;
float: right;
}
}

2
countdown/templates/countdown/view.js
View file

@ -77,7 +77,7 @@ let updateCountdown = () => {
sleep(time.milliseconds)
.then(() => {
$("#countdown").text(text);
$("#subtext").text();
$("#subtext").text("");
});
};