feat: introducing self hosted admin dashboard package (#12)
Co-authored-by: Andrew Bastin <andrewbastin.k@gmail.com> Co-authored-by: Anwarul Islam <anwaarulislaam@gmail.com>
This commit is contained in:
committed by
GitHub
parent
2ba05a46ee
commit
3f59597864
83
packages/hoppscotch-sh-admin/src/pages/dashboard.vue
Normal file
83
packages/hoppscotch-sh-admin/src/pages/dashboard.vue
Normal file
@@ -0,0 +1,83 @@
|
||||
<template>
|
||||
<div class="sm:px-6 p-4">
|
||||
<h3 class="text-3xl font-medium text-gray-800 dark:text-gray-200">
|
||||
Dashboard
|
||||
</h3>
|
||||
|
||||
<div class="mt-4">
|
||||
<div class="flex flex-wrap -mx-6">
|
||||
<div class="w-full px-6 sm:w-1/2 xl:w-1/3">
|
||||
<div
|
||||
class="flex items-center px-5 py-6 bg-zinc-200 dark:bg-zinc-800 rounded-md shadow-sm"
|
||||
>
|
||||
<icon-lucide-user-cog class="text-2xl text-emerald-500" />
|
||||
|
||||
<div class="mx-5">
|
||||
<h4
|
||||
class="text-2xl font-semibold text-gray-700 dark:text-gray-200"
|
||||
>
|
||||
1000
|
||||
</h4>
|
||||
<div class="text-gray-600 dark:text-gray-400">Total Users</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="w-full px-6 mt-6 sm:w-1/2 xl:w-1/3 sm:mt-0">
|
||||
<div
|
||||
class="flex items-center px-5 py-6 bg-zinc-200 dark:bg-zinc-800 rounded-md shadow-sm"
|
||||
>
|
||||
<icon-lucide-users class="text-2xl text-pink-400" />
|
||||
|
||||
<div class="mx-5">
|
||||
<h4
|
||||
class="text-2xl font-semibold text-gray-700 dark:text-gray-200"
|
||||
>
|
||||
200
|
||||
</h4>
|
||||
<div class="text-gray-600 dark:text-gray-400">Total Teams</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="w-full px-6 mt-6 sm:w-1/2 xl:w-1/3 xl:mt-0">
|
||||
<div
|
||||
class="flex items-center px-5 py-6 bg-zinc-200 dark:bg-zinc-800 rounded-md shadow-sm"
|
||||
>
|
||||
<icon-lucide-lock class="text-2xl text-cyan-400" />
|
||||
|
||||
<div class="mx-5">
|
||||
<h4
|
||||
class="text-2xl font-semibold text-gray-700 dark:text-gray-200"
|
||||
>
|
||||
20
|
||||
</h4>
|
||||
<div class="text-gray-600 dark:text-gray-400">Total Roles</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="w-full px-6 mt-6 sm:w-1/2 xl:w-1/3 xl:mt-10">
|
||||
<div
|
||||
class="flex items-center px-5 py-6 bg-zinc-200 dark:bg-zinc-800 rounded-md shadow-sm"
|
||||
>
|
||||
<icon-lucide-line-chart class="text-2xl text-orange-400" />
|
||||
|
||||
<div class="mx-5">
|
||||
<h4
|
||||
class="text-2xl font-semibold text-gray-700 dark:text-gray-200"
|
||||
>
|
||||
215
|
||||
</h4>
|
||||
<div class="text-gray-600 dark:text-gray-400">
|
||||
Total Collections
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mt-8"></div>
|
||||
</div>
|
||||
</template>
|
||||
Reference in New Issue
Block a user