From 1b4f3d11f408d3c0df68b0b4550bf68abe83307a Mon Sep 17 00:00:00 2001
From: Alexandre Aubin <alex.aubin@mailoo.org>
Date: Mon, 13 Nov 2023 17:35:47 +0100
Subject: [PATCH] Misc clumsy cosmetic tweaks

---
 layouts/default.vue |  2 +-
 pages/index.vue     | 17 ++++++++---------
 2 files changed, 9 insertions(+), 10 deletions(-)

diff --git a/layouts/default.vue b/layouts/default.vue
index 948c931..dceda67 100644
--- a/layouts/default.vue
+++ b/layouts/default.vue
@@ -71,7 +71,7 @@ async function logout() {
 
 <template>
   <div class="container mx-auto p-10 min-h-screen flex flex-col">
-    <header class="py-10">
+    <header class="py-2">
       <div class="h-10 -mt-10">
         <a
           id="skip-link"
diff --git a/pages/index.vue b/pages/index.vue
index 05c8739..cecc0ef 100644
--- a/pages/index.vue
+++ b/pages/index.vue
@@ -49,7 +49,7 @@ const apps = computed(() => {
   <div>
     <PageTitle :text="$t('app_list')" />
 
-    <div id="apps" class="my-10">
+    <div id="apps">
       <div v-if="!apps.length" class="w-2/3">
         <em>{{ t('no_apps') }}</em>
       </div>
@@ -60,9 +60,8 @@ const apps = computed(() => {
           :key="app.id"
           class="leading-none card h-40 w-40 relative mr-7 mb-7"
         >
-          <div class="tile-layer" :class="[app.colors[0], 'brightness-75']" />
           <a :href="app.url" class="tile-layer p-5" :class="app.colors">
-            <div class="text-6xl font-extrabold mb-1" aria-hidden="true">
+            <div class="text-6xl font-extrabold mb-1 mt-2" aria-hidden="true">
               {{ app.label.substring(0, 2) }}
             </div>
             <span class="leading-tight mt-2">{{ app.label }}</span>
@@ -85,14 +84,14 @@ const apps = computed(() => {
   z-index: -1;
   position: absolute;
   @apply inset-0;
-  @apply rounded-2xl;
+  @apply text-center;
   transform: translate(0rem, 0rem);
 }
-#apps li.card:hover div.tile-layer {
-  transform: translate(0.75rem, 0.75rem);
-}
-
 #apps li.card:hover {
-  transform: translate(-0.75rem, -0.75rem);
+  height: 9.5em;
+  width: 9.5em;
+  margin-left: 0.25em;
+  margin-top: 0.25em;
+  transition: all 0.1s ease;
 }
 </style>