From 668eb715af5cc2275113ef091f87e6279ab627ea Mon Sep 17 00:00:00 2001 From: Alexandre Tuleu Date: Tue, 19 Sep 2023 21:45:07 +0200 Subject: [PATCH] More tailwind css for the win. --- src/app.css | 1 + src/app.html | 4 +- src/config.yml | 2 +- src/lib/components/Brand.svelte | 5 +- src/lib/components/Header.svelte | 2 +- src/lib/components/ServiceCard.svelte | 36 +++++++-------- src/lib/components/ServiceGroup.svelte | 19 ++++++-- src/routes/+page.svelte | 64 ++++++++------------------ 8 files changed, 60 insertions(+), 73 deletions(-) diff --git a/src/app.css b/src/app.css index 99f2157..d2f6977 100644 --- a/src/app.css +++ b/src/app.css @@ -7,5 +7,6 @@ html { } body { + height: 100%; min-height: 100%; } diff --git a/src/app.html b/src/app.html index d294652..fe5ad2c 100644 --- a/src/app.html +++ b/src/app.html @@ -7,7 +7,9 @@ %sveltekit.head% -
+
%sveltekit.body%
diff --git a/src/config.yml b/src/config.yml index ea9d04e..e2325d0 100644 --- a/src/config.yml +++ b/src/config.yml @@ -17,7 +17,7 @@ services: icon: 'fas fa-photo-film' items: - title: 'Jellyfin' - subtitle: 'Media server for movies and shows' + subtitle: 'Media server' target: '_blank' url: 'https://eagle.tuleu.me' type: jellyfin diff --git a/src/lib/components/Brand.svelte b/src/lib/components/Brand.svelte index dfab94f..3699e1d 100644 --- a/src/lib/components/Brand.svelte +++ b/src/lib/components/Brand.svelte @@ -25,10 +25,13 @@ width: 100%; color: var(--mask-color); display: flex; + justify-content: center; + align-items: center; } img { - width: 100%; + max-width: 100%; + max-height: 100%; } .masked { diff --git a/src/lib/components/Header.svelte b/src/lib/components/Header.svelte index a78e261..dfd7a2d 100644 --- a/src/lib/components/Header.svelte +++ b/src/lib/components/Header.svelte @@ -8,7 +8,7 @@ export let links: Array; -
+
diff --git a/src/lib/components/ServiceCard.svelte b/src/lib/components/ServiceCard.svelte index 1c0de3a..2d5ccfa 100644 --- a/src/lib/components/ServiceCard.svelte +++ b/src/lib/components/ServiceCard.svelte @@ -16,24 +16,22 @@ } - -
-
-
-
-
- -
-
-
-

{service.title}

- {#if component != undefined} -

- {:else} -

{service.subtitle}

- {/if} -
-
-
+
+
+ +
+
+

{service.title}

+

+ {#if component != undefined} + + {:else} + {service.subtitle} + {/if} +

diff --git a/src/lib/components/ServiceGroup.svelte b/src/lib/components/ServiceGroup.svelte index dd03a95..30a7940 100644 --- a/src/lib/components/ServiceGroup.svelte +++ b/src/lib/components/ServiceGroup.svelte @@ -1,15 +1,15 @@ -
-
+
+

{#if group.icon} @@ -18,9 +18,20 @@

-
+
{#each group.items as service, i} {/each}
+ + diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte index e711dc9..ea55503 100644 --- a/src/routes/+page.svelte +++ b/src/routes/+page.svelte @@ -1,60 +1,32 @@ - - - - {@html renderCssVariables()} - -
-
-
- {#each data.config.services as group, i} - - {/each} -
+
+ {#each data.config.services as group, i} + + {/each}