2
0
Fork 0

Make day selector stick to the top

This commit is contained in:
Luca 2022-05-17 16:59:53 +02:00
parent eb56b658fa
commit f70e94955d
2 changed files with 16 additions and 5 deletions

View File

@ -18,16 +18,17 @@
<hr>
{% endif %}
{% if free_shifts %}
<h3 class="title">Freie Schichten</h3>
<div class="breadcrumb has-bullet-separator">
<ul>
<h3 class="title mb-0">Freie Schichten</h3>
<div class="breadcrumb has-bullet-separator mb-0" style="background-color:var(--background);overflow-x:auto;padding:1em 0;position:sticky;top:0;z-index:42;">
<ul style="flex-wrap:nowrap;">
{% for day in days %}
<li><a href="#{{ day|date:"Y-m-d" }}">{{ day|date:"l, d.m.Y" }}</a></li>
<li><a href="#{{ day|date:"Y-m-d" }}">{{ day|date:"l" }}</a></li>
{% endfor %}
<li><a href="#">zurück nach oben</a></li>
</ul>
</div>
{% for shifts in free_shifts %}
<h5 class="subtitle" id="{{ shifts.0.start_at|date:"Y-m-d" }}">{{ shifts.0.start_at|date:"l, d.m.Y" }}</h5>
<h5 class="subtitle" id="{{ shifts.0.start_at|date:"Y-m-d" }}">{{ shifts.0.start_at|date:"l" }}</h5>
<div class="columns is-multiline">
{% for shift in shifts %}
{% include "partials/shift_listitem.html" %}

View File

@ -17,6 +17,16 @@
* {
font-family: "Maven Pro", sans-serif !important;
}
:root {
--background: #fff;
}
@media (prefers-color-scheme: dark) {
:root {
--background: #17181c;
}
}
</style>
</head>
<body>