frontend: Fix layout of calendar component chips

This commit is contained in:
Lennart
2025-07-18 19:53:45 +02:00
parent 994864c6ef
commit c490c413ec
2 changed files with 20 additions and 19 deletions

View File

@@ -224,15 +224,15 @@ ul.collection-list {
min-height: 80px;
height: fit-content;
grid-template-areas:
". . color-chip"
"title comps color-chip"
"description description color-chip"
"subscription-url subscription-url color-chip"
"metadata metadata color-chip"
"actions actions color-chip"
". . color-chip";
". color-chip"
"title color-chip"
"description color-chip"
"subscription-url color-chip"
"metadata color-chip"
"actions color-chip"
". color-chip";
grid-template-rows: 12px auto auto auto auto auto 12px;
grid-template-columns: min-content auto 80px;
grid-template-columns: auto 80px;
row-gap: 4px;
color: inherit;
text-decoration: none;
@@ -260,7 +260,7 @@ ul.collection-list {
}
.comps {
grid-area: comps;
display: inline;
span {
margin: 0 2px;
@@ -293,6 +293,7 @@ ul.collection-list {
}
.actions {
pointer-events: all;
grid-area: actions;
width: fit-content;
display: flex;

View File

@@ -8,12 +8,12 @@
<span class="title">
{%- if calendar.principal != user.id -%}{{ calendar.principal }}/{%- endif -%}
{{ calendar.displayname.to_owned().unwrap_or(calendar.id.to_owned()) }}
</span>
<div class="comps">
{% for comp in calendar.components %}
<span>{{ comp }}</span>
{% endfor %}
</div>
</span>
<span class="description">
{% if let Some(description) = calendar.description %}{{ description }}{% endif %}
</span>
@@ -49,12 +49,12 @@
<span class="title">
{%- if calendar.principal != user.id -%}{{ calendar.principal }}/{%- endif -%}
{{ calendar.displayname.to_owned().unwrap_or(calendar.id.to_owned()) }}
</span>
<div class="comps">
{% for comp in calendar.components %}
<span>{{ comp }}</span>
{% endfor %}
</div>
</span>
<span class="description">
{% if let Some(description) = calendar.description %}{{ description }}{% endif %}
</span>