kontakt
/
shiftregister
2
0
Fork 0
Code

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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
shiftregister/app/templates/shiftlist.html
View File

@ -18,16 +18,17 @@
<hr> <hr>
{% endif %} {% endif %}
{% if free_shifts %} {% if free_shifts %}
<h3 class="title">Freie Schichten</h3> <h3 class="title mb-0">Freie Schichten</h3>
<div class="breadcrumb has-bullet-separator"> <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> <ul style="flex-wrap:nowrap;">
{% for day in days %} {% 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 %} {% endfor %}
<li><a href="#">zurück nach oben</a></li>
</ul> </ul>
</div> </div>
{% for shifts in free_shifts %} {% 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"> <div class="columns is-multiline">
{% for shift in shifts %} {% for shift in shifts %}
{% include "partials/shift_listitem.html" %} {% include "partials/shift_listitem.html" %}

10
templates/base.html
View File

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