3
0
Fork 0
mirror of https://github.com/ZeppelinBot/Zeppelin.git synced 2025-05-21 00:35:02 +00:00

guild list improvements

- Cut off long guild names
- Not allowed cursor on disabled buttons
- Add transition to buttons
This commit is contained in:
Coding 2021-07-23 16:41:02 -07:00
parent a9e0466e33
commit 9701d93fc8

View file

@ -6,20 +6,20 @@
<h1>Guilds</h1>
<ul class="list-none flex flex-wrap -m-4 pt-4">
<li v-for="guild in guilds" class="flex-none p-4 w-full md:w-1/2 lg:w-1/3 xl:w-1/4">
<div class="flex items-center">
<div class="flex items-center overflow-hidden whitespace-nowrap">
<div class="flex-none w-12 h-12">
<img v-if="guild.icon" class="rounded-full w-full h-full" :src="guild.icon" alt="" :title="'Logo for guild ' + guild.name">
<img v-if="guild.icon" class="rounded-full w-full h-full" :src="guild.icon" alt="" :title="'Icon for guild ' + guild.name">
<div v-else class="bg-gray-700 rounded-full w-full h-full"></div>
</div>
<div class="flex-auto ml-4">
<div class="flex-auto pl-4">
<div>
<div class="font-semibold leading-tight">{{ guild.name }}</div>
<div class="text-gray-600 text-sm leading-tight">{{ guild.id }}</div>
</div>
<div class="pt-1">
<span class="inline-block bg-gray-700 rounded px-1 opacity-50 select-none">Info</span>
<router-link class="inline-block bg-gray-700 rounded px-1 hover:bg-gray-800" :to="'/dashboard/guilds/' + guild.id + '/config'">Config</router-link>
<span class="inline-block bg-gray-700 rounded px-1 opacity-50 select-none">Access</span>
<span class="inline-block bg-gray-700 rounded px-1 opacity-50 select-none cursor-not-allowed">Info</span>
<router-link class="inline-block bg-gray-700 rounded px-1 hover:bg-gray-800 transition duration-100" :to="'/dashboard/guilds/' + guild.id + '/config'">Config</router-link>
<span class="inline-block bg-gray-700 rounded px-1 opacity-50 select-none cursor-not-allowed">Access</span>
</div>
</div>
</div>