frontend: update stylesheet

This commit is contained in:
Lennart
2025-11-04 15:31:35 +01:00
parent 9f28aaec41
commit 6838e8e379
2 changed files with 17 additions and 20 deletions

View File

@@ -79,9 +79,6 @@ header {
nav { nav {
display: flex; display: flex;
border-radius: 12px;
background: color-mix(in srgb, var(--background-darker), var(--dilute-color) 5%);
a { a {
text-decoration: none; text-decoration: none;
margin: 4px 8px; margin: 4px 8px;
@@ -259,19 +256,6 @@ ul.collection-list {
margin: 8px initial; margin: 8px initial;
} }
.comps {
display: inline;
span {
margin: 0 2px;
background: var(--primary-color);
color: var(--text-on-primary-color);
font-size: .8em;
padding: 3px 8px;
border-radius: 12px;
}
}
.description { .description {
grid-area: description; grid-area: description;
white-space: nowrap; white-space: nowrap;
@@ -363,3 +347,16 @@ svg.icon {
color: var(--text-on-background-color); color: var(--text-on-background-color);
stroke: var(--text-on-background-color); stroke: var(--text-on-background-color);
} }
.component-chips {
display: inline;
span.chip {
margin: 0 2px;
background: var(--primary-color);
color: var(--text-on-primary-color);
font-size: .8em;
padding: 3px 8px;
border-radius: 12px;
}
}

View File

@@ -8,9 +8,9 @@
<span class="title"> <span class="title">
{%- if calendar.principal != user.id -%}{{ calendar.principal }}/{%- endif -%} {%- if calendar.principal != user.id -%}{{ calendar.principal }}/{%- endif -%}
{{ calendar.meta.displayname.to_owned().unwrap_or(calendar.id.to_owned()) }} {{ calendar.meta.displayname.to_owned().unwrap_or(calendar.id.to_owned()) }}
<div class="comps"> <div class="component-chips">
{% for comp in calendar.components %} {% for comp in calendar.components %}
<span>{{ comp }}</span> <span class="chip">{{ comp }}</span>
{% endfor %} {% endfor %}
</div> </div>
</span> </span>
@@ -58,9 +58,9 @@
<span class="title"> <span class="title">
{%- if calendar.principal != user.id -%}{{ calendar.principal }}/{%- endif -%} {%- if calendar.principal != user.id -%}{{ calendar.principal }}/{%- endif -%}
{{ calendar.meta.displayname.to_owned().unwrap_or(calendar.id.to_owned()) }} {{ calendar.meta.displayname.to_owned().unwrap_or(calendar.id.to_owned()) }}
<div class="comps"> <div class="component-chips">
{% for comp in calendar.components %} {% for comp in calendar.components %}
<span>{{ comp }}</span> <span class="chip">{{ comp }}</span>
{% endfor %} {% endfor %}
</div> </div>
</span> </span>