updates calendar webpage flex container

This commit is contained in:
2020-08-26 13:44:01 +02:00
parent 2e81d53f9d
commit a83c28f873
2 changed files with 9 additions and 7 deletions

View File

@ -4,12 +4,14 @@
<div class="container">
<div style="width: 4rem;margin:1rem;"></div>
<div style="width: 10rem; margin: 1rem; font-weight: bold">Calendar</div>
<div style="width: 5rem; margin: 1rem; padding-right: 1rem;font-weight: bold">Show on device</div>
<div style="width: 2rem; margin: 1rem;font-weight: bold">Color</div>
<div style="display: inline-flex">
<div style="width: 5rem; margin: 1rem; padding-right: 1rem;font-weight: bold">Show on device</div>
<div style="width: 2rem; margin: 1rem;font-weight: bold">Color</div>
</div>
</div>
{% for item in calendars %}
<div class="container">
<div class="container" style="margin-top: 1.5rem">
<!--action button-->
{% if "ical" == item.calType %}
<div style="width: 4rem; margin: 1rem;">
@ -22,10 +24,10 @@
<div style="width: 4rem; margin: 1rem;"></div>
{% endif %}
<!--Name-->
<div style="width: 10rem; margin: 1rem;">{{ item.name }}</div>
<div style="width: 10rem; margin-left: 1rem; margin-right: 1rem; margin-top: 0.5rem">{{ item.name }}</div>
<div style="display: inline-flex">
<!--Toggle-->
<div style="width: 5rem; margin: 1rem; padding-right: 1rem">
<div style="width: 5rem; margin-left: 1rem; margin-right: 1rem; margin-top: 0.5rem; padding-right: 1rem">
<!-- Rounded switch -->
<label class="switch">
<input class="toggle" id={{item.calendarId}} type="checkbox" toggled={{item.toggle}} onclick="toggleReaction(this)">
@ -34,7 +36,7 @@
</div>
<!--Color Selector-->
<div style="width: 2rem; margin: 1rem;">
<div style="width: 2rem; margin-left: 1rem; margin-right: 1rem; margin-top: 0.5rem">
<div class="colorPickSelector" id={{item.calendarId}} defaultColor={{item.color}}></div>
<!--svg height="20" width="20">
<circle cx="10" cy="10" r="10" stroke="black" stroke-width="0" fill={{ item.color }} />