Romain/portal
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refact css tailwind

Browse Source
This commit is contained in:
Romulus21
2020-05-08 23:38:31 +02:00
parent 6e0db185bb
commit 765d99e48b
15 changed files with 194 additions and 106 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
resources/js/components/Avatar.vue
View File

@@ -1,7 +1,7 @@
<template>
<div class="flex justify-center items-center rounded-full bg-primary-600 hover:bg-primary-800">
<img v-if="avatar" src="avatar" alt="alt" class="avatar" v-bind:class="'avatar' + size">
<span v-else class="text-2xl font-bold" v-bind:class="'text-' + size">{{ alt[0] }}</span>
<div class="flex justify-center items-center rounded-full bg-gray-900 hover:bg-primary-800">
<img v-if="avatar" :src="avatar" alt="alt" class="rounded-full" v-bind:class="'avatar' + size">
<span v-else class="text-2xl font-bold text-gray-100 hover:text-white" v-bind:class="'text-' + size">{{ alt[0] }}</span>
</div>
</template>

4
resources/js/components/Nav.vue
View File

@@ -1,6 +1,6 @@
<template>
<nav v-bind:class="{ small: !toggleNav }" class="h-screen bg-primary-400 flex flex-col justify-between">
<div class="">
<nav v-bind:class="{ small: !toggleNav }" class="">
<div>
<router-link to="/" class="logo" v-bind:class="{ small: !toggleNav }">
<svg-vue icon="logo" />
</router-link>

8
resources/js/components/TopBar.vue
View File

@@ -1,8 +1,8 @@
<template>
<div class="top-bar flex justify-between bg-primary-300">
<div class="top-bar flex justify-between bg-gray-600">
<router-link v-if="authUser" :to="'/profile'" class="flex items-center m-2">
<Avatar :avatar="authUser.data.attributes.avatar" size="small" :alt="authUser.data.attributes.name" class="w-10 h-10"/>
<span class="ml-2 hover:text-primary-900">{{ authUser.data.attributes.name }}</span>
<Avatar :avatar="authUser.data.attributes.profile_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>
</router-link>
<form v-if="authUser && search" class="m-2">
<input type="search" name="search" placeholder="Search">
@@ -10,7 +10,7 @@
<svg-vue icon="search" />
</button>
</form>
<router-link to="/dashboard" v-if="authUser" class="text-primary-600 hover:text-primary-800">
<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" />
</router-link>
<router-link v-else to="/login">