gitea_admin/Styleguide
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add reusable VSF list detail layout page and module

Browse Source
This commit is contained in:
Mathias Gläser
2026-05-28 10:24:16 +02:00
parent 1ec247f62f
commit 377f23ff6e
4 changed files with 319 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
styles/33-layouts-vsf-list-detailseite.css
+44
View File
@@ -0,0 +1,44 @@
/* ========================================================= */
/* Layouts: VSF List Detailseite */
/* ========================================================= */
.sg-vsf-list-detail-page {
display: flex;
flex-direction: column;
}
.sg-vsf-list-detail-page > * + * {
margin-top: var(--spacing-large);
}
.sg-vsf-list-detail-page > .sg-options-row {
margin-top: var(--spacing-large);
}
.sg-vsf-list-detail-page > .sg-vsf-list-detail-page__intro-block {
margin-top: calc(var(--spacing-large) - 0.5rem);
}
.sg-vsf-list-detail-page__intro-block {
display: flex;
flex-direction: column;
gap: var(--spacing-large);
}
.sg-vsf-list-detail-page__title-row {
display: inline-flex;
align-items: center;
gap: var(--spacing-small);
width: fit-content;
max-width: 100%;
}
.sg-vsf-list-detail-page__intro-block .sg-text-layout-pattern__sample--sixty-width {
width: min(60vw, 100%);
}
@media (max-width: 767px) {
.sg-vsf-list-detail-page__intro-block .sg-text-layout-pattern__sample--sixty-width {
width: 100%;
}
}