refact front

resources/js/components/App.vue

@@ -4,7 +4,7 @@
         <div v-if="authUser" class="w-full overflow-y-auto">
             <TopBar />
             <main>
-                <router-view :key="$route.fullPath"></router-view>
+                <router-view :key="$route.fullPath" class="mx-2 p-2 bg-gray-200"></router-view>
             </main>
         </div>
     </div>

resources/js/components/InputField.vue

@@ -1,7 +1,7 @@
 <template>
     <div class="relative mb-2">
         <label v-if="label" :for="name" class="pb-2 font-bold text-xl ml-1">{{ label }}</label>
-        <input :id="name" :type="type" :placeholder="placeholder" v-model="value" @input="updateField()" :class="'w-full rounded p-2 ' + classes + ' ' + errorClassObject()">
+        <input :id="name" :type="type" :placeholder="placeholder" v-model="value" @input="updateField()" :class="'w-full p-2 ' + classes + ' ' + errorClassObject()">
         <p class="text-red-600 m-0" v-text="errorMessage()">Error Here</p>
     </div>
 </template>

resources/js/components/TopBar.vue

@@ -1,5 +1,5 @@
 <template>
-    <div class="top-bar flex justify-between bg-gray-600">
+    <div class="top-bar relative z-10 flex justify-between bg-marine h-16">
         <router-link v-if="authUser" :to="'/profile'" class="flex items-center m-2">
             <Avatar :avatar="authUser.data.attributes.thumbnail_cover_image.data.attributes.path" size="small" :alt="authUser.data.attributes.name" class="w-10 h-10"/>
             <span class="ml-2 text-gray-100 hover:text-white">{{ authUser.data.attributes.name }}</span>
@@ -11,7 +11,7 @@
             </button>
         </form>
         <router-link to="/dashboard" v-if="authUser" class="text-gray-100 hover:text-white">
-            <svg-vue icon="params" class="w-10 m-2 fill-current" />
+            <svg-vue icon="params" class="w-10 m-3 fill-current" />
         </router-link>
         <router-link v-else to="/login">
             Se connecter