defuj/apkt-eis
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix recent page list style

Browse Source
This commit is contained in:
Dede Fuji Abdul
2023-10-27 08:49:51 +07:00
parent a4fb6dcdd7
commit 8384a35832
3 changed files with 56 additions and 90 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/components/CommandPalettes.vue
View File

@ -23,7 +23,7 @@
</div>
<ComboboxOptions v-if="query === '' || filteredMenus.length > 0" static
class="overflow-y-auto divide-y divide-gray-500 max-h-80 scroll-py-2 divide-opacity-10">
class="overflow-y-auto divide-y divide-gray-500 scroll-py-2 divide-opacity-10">
<li class="p-2" v-if="filteredMenus.length > 0 || recent.length > 0">
<h2 v-if="query === '' && recent.length > 0"
class="px-3 mt-4 mb-2 text-xs font-semibold text-gray-900">
@ -62,7 +62,7 @@
:class="['h-6 w-6 flex-none', active ? 'opacity-100' : 'opacity-40']" />
<div class="flex flex-col flex-1 ml-3 space-y-1">
<span class="text-sm font-medium text-gray-800 truncate line-clamp-1">
<span class="text-sm font-medium text-gray-800 line-clamp-1">
{{ menu.name }}
</span>
<span class="text-xs text-gray-500 line-clamp-1">

34
src/components/Pages/Welcome.vue
View File

@ -1,12 +1,12 @@
<template>
<div class="flex flex-col items-center justify-center px-6 text-center whitespace-pre-wrap h-screen-80">
<div class="w-full md:w-[440px] px-4 py-4 md:px-0 md:py-0 flex flex-col items-center">
<div class="flex flex-col items-center justify-center px-4 text-center whitespace-pre-wrap h-screen-80">
<div class="w-full md:w-[440px] py-4 md:py-0 flex flex-col items-center">
<img :src="IconApp" alt="pln" class="h-[66px] object-contain mx-auto mb-4">
<button @click="command.showCommandPalettes" type="button"
class="flex flex-row items-center w-full p-2 text-gray-400 rounded-full bg-gray-50 hover:text-primary-500 focus:outline-none focus:ring-0">
<span class="sr-only">Search</span>
<MagnifyingGlassIcon class="w-6 h-6 text-primary-500" aria-hidden="true" />
<span class="hidden px-3 text-sm font-medium text-gray-500 md:block text-md">Cari menu</span>
<span class="px-3 text-sm font-medium text-gray-500 text-md">Cari menu</span>
</button>
<div v-if="query === '' || filteredMenus.length > 0" static class="w-full mt-6 md:mt-8 lg:mt-12">
@ -20,35 +20,35 @@
<div
class="flex flex-row items-center justify-between px-3 py-2 rounded-md cursor-pointer select-none group-hover:bg-primary-500 group-hover:text-white group-hover:bg-opacity-80">
<component v-if="menu.path.includes('/gangguan/')" :is="navigationIcon[0]" alt="icon"
:class="['w-8 h-8 fill-gray-600 group-hover:fill-white']" />
:class="['w-8 h-8 fill-gray-600 group-hover:fill-white flex']" />
<component v-else-if="menu.path.includes('/keluhan/')" :is="navigationIcon[1]" alt="icon"
:class="['w-8 h-8 fill-gray-600 group-hover:fill-white']" />
:class="['w-8 h-8 fill-gray-600 group-hover:fill-white flex']" />
<component v-else-if="menu.path.includes('/monalisa/')" :is="navigationIcon[2]" alt="icon"
:class="['w-8 h-8 fill-gray-600 group-hover:fill-white']" />
:class="['w-8 h-8 fill-gray-600 group-hover:fill-white flex']" />
<component v-else-if="menu.path.includes('/check-in-out/')" :is="navigationIcon[3]"
alt="icon" :class="['w-8 h-8 fill-gray-600 group-hover:fill-white']" />
alt="icon" :class="['w-8 h-8 fill-gray-600 group-hover:fill-white flex']" />
<component v-else-if="menu.path.includes('/anomali-pengaduan/')" :is="navigationIcon[4]"
alt="icon" :class="['w-8 h-8 fill-gray-600 group-hover:fill-white']" />
alt="icon" :class="['w-8 h-8 fill-gray-600 group-hover:fill-white flex']" />
<component v-else-if="menu.path.includes('/ctt-kwh-periksa/')" :is="navigationIcon[5]"
alt="icon" :class="['w-8 h-8 fill-gray-600 group-hover:fill-white']" />
alt="icon" :class="['w-8 h-8 fill-gray-600 group-hover:fill-white flex']" />
<component v-else-if="menu.path.includes('/material/')" :is="navigationIcon[6]" alt="icon"
:class="['w-8 h-8 fill-gray-600 group-hover:fill-white']" />
:class="['w-8 h-8 fill-gray-600 group-hover:fill-white flex']" />
<component v-else-if="menu.path.includes('/transaksi/')" :is="navigationIcon[7]" alt="icon"
:class="['w-8 h-8 fill-gray-600 group-hover:fill-white']" />
:class="['w-8 h-8 fill-gray-600 group-hover:fill-white flex']" />
<component v-else :is="navigationIcon[8]" alt="icon"
:class="['w-8 h-8 fill-gray-600 group-hover:fill-white']" />
:class="['w-8 h-8 fill-gray-600 group-hover:fill-white flex']" />
<div class="flex flex-col items-start flex-1 ml-3 space-y-1">
<div class="flex flex-col items-start flex-1 w-full pl-3 space-y-1">
<span
class="text-sm font-medium text-gray-800 truncate group-hover:text-white line-clamp-1">
class="w-full text-sm font-medium text-gray-800 text-start group-hover:text-white line-clamp-1">
{{ menu.name }}
</span>
<span class="text-xs text-gray-500 group-hover:text-white line-clamp-1">
<span
class="w-full text-xs text-gray-500 text-start group-hover:text-white line-clamp-1">
{{ menu.path.replace('/home/', '') }}
</span>
</div>
<span
class="flex-none hidden ml-3 text-sm text-gray-500 group-hover:block group-hover:text-white">
<span class="hidden ml-3 text-sm text-gray-500 group-hover:block group-hover:text-white">
Buka
</span>
</div>