diff --git a/src/routes/(app)/+layout.svelte b/src/routes/(app)/+layout.svelte index 4d7c5dc..74a56b7 100644 --- a/src/routes/(app)/+layout.svelte +++ b/src/routes/(app)/+layout.svelte @@ -133,7 +133,7 @@ > .left { display: flex; align-self: start; - justify-content: right; + justify-content: center; flex-wrap: wrap; @include mobile { diff --git a/src/routes/(app)/players/+page.svelte b/src/routes/(app)/players/+page.svelte index e622e29..2cff1c0 100644 --- a/src/routes/(app)/players/+page.svelte +++ b/src/routes/(app)/players/+page.svelte @@ -102,18 +102,52 @@ max-width: min-content; padding-inline-start: 0; display: table; + + @include mobile { + display: block; + max-width: none; + width: 100%; + } + li { display: table-row; - > * { - display: table-cell; - padding: 0.1em 1ex; - width: fit-content; - white-space: nowrap; + @include desktop { + > * { + display: table-cell; + width: fit-content; + white-space: nowrap; + padding: 0.1em 1ex; + } } - > .submitted { - color: green; + @include mobile { + display: flex; + flex-direction: row; + width: 100%; + flex-wrap: wrap; + gap: 1ex; + + > * { + padding: 0 !important; + } + + > .counter { + } + + > .submitted { + color: green; + } + + > .name { + text-align: left; + } + + > .joined { + text-align: end; + flex: 1 0 100%; + + } } } } @@ -160,14 +194,14 @@