Fix notifications pattern desktop sizing

This commit is contained in:
2026-06-03 15:36:13 +02:00
parent b1af9b3e6b
commit fb5baffc01
+12 -11
View File
@@ -11,26 +11,27 @@
} }
.sg-notifications-pattern__card { .sg-notifications-pattern__card {
flex: 1 1 var(--layout-notifications-card-flex-basis); flex: 0 0 100%;
min-width: var(--layout-notifications-card-min-width); width: 100%;
max-width: var(--layout-notifications-card-max-width); min-width: 0;
max-width: none;
} }
/* Dokumentierte Pattern-Variante: Notifications innerhalb Group Card */ /* Dokumentierte Pattern-Variante: Notifications innerhalb Group Card */
.sg-notifications-pattern.sg-group-card > .sg-notifications-pattern__card { .sg-notifications-pattern.sg-group-card > .sg-notifications-pattern__card {
flex: 1 1 var(--layout-notifications-card-flex-basis); flex: 0 0 100%;
min-width: var(--layout-notifications-card-min-width); width: 100%;
max-width: var(--layout-notifications-card-max-width); min-width: 0;
width: auto; max-width: none;
} }
.sg-notifications-pattern.sg-notifications-pattern--multi-row .sg-notifications-pattern__card { .sg-notifications-pattern.sg-notifications-pattern--multi-row .sg-notifications-pattern__card {
flex: 0 0 var(--layout-object-card-shared-width); flex: 0 0 100%;
width: var(--layout-object-card-shared-width); width: 100%;
} }
.sg-notifications-pattern__card > .sg-notifications-pattern__text-segment { .sg-notifications-pattern__card > .sg-notifications-pattern__text-segment {
height: var(--layout-notifications-text-segment-fixed-height); height: auto;
} }
.sg-notifications-pattern__card > .sg-notifications-pattern__title-segment { .sg-notifications-pattern__card > .sg-notifications-pattern__title-segment {
@@ -38,7 +39,7 @@
} }
.sg-notifications-pattern__card > .sg-notifications-pattern__text-segment.sg-notifications-pattern__text-segment--small { .sg-notifications-pattern__card > .sg-notifications-pattern__text-segment.sg-notifications-pattern__text-segment--small {
height: var(--layout-notifications-text-segment-fixed-height-small); height: auto;
} }
@media (max-width: 767px) { @media (max-width: 767px) {