mirrors
/
dick
mirror of https://github.com/Facinorous-420/dick
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Updates to UI (#27)

Browse Source 
Removed hover effect to stat cards as there is no reason for them as they don't link to anything
Cleaned up some code base
Removed user total from user list

Signed-off-by: ImgBotApp <ImgBotHelp@gmail.com>
Co-authored-by: ImgBotApp <ImgBotHelp@gmail.com>
pull/30/head
William Harrison 2 years ago committed by GitHub
parent d8f960f6ee
commit 902aeb144f
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
16 changed files with 52 additions and 88 deletions
Show Stats Download Patch File Download Diff File

BIN
assets/dick_example_1.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 145 KiB

After

Width:  |  Height:  |  Size: 111 KiB

BIN
assets/dick_example_2.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 16 KiB

After

Width:  |  Height:  |  Size: 9.9 KiB

4
src/dashboard.ts
Unescape View File

@ -65,9 +65,9 @@ app.use(async (req, res) => await Pager.render(res, req, TEMPLATE.ERRORS[404]))
// Run DICK // Run DICK
app.listen(app.get("port"), () => { app.listen(app.get("port"), () => {
console.log( console.log(
" Dick is running at http://localhost:%d in %s mode", "[DICK] Listening on Port: %d\n[DICK] Running in: %s mode",
app.get("port"), app.get("port"),
app.get("env") app.get("env")
) )
console.log(" Press CTRL-C to stop\n") console.log("[DICK] Press CTRL+C to stop")
}) })

BIN
src/public/images/logo.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 60 KiB

After

Width:  |  Height:  |  Size: 49 KiB

BIN
src/public/images/profile.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 70 KiB

After

Width:  |  Height:  |  Size: 61 KiB

19
views/modals/admin/create-user.ejs
Unescape View File

@ -2,7 +2,7 @@
<!-- Modal Outscreen --> <!-- Modal Outscreen -->
<div class="buttonModal absolute inset-0 bg-gradient-to-tr opacity-90 from-gray-700 via-gray-900 to-gray-700"> <div class="buttonModal absolute inset-0 bg-gradient-to-tr opacity-90 from-gray-700 via-gray-900 to-gray-700">
</div> </div>
<!-- Modal Outscreen --> <!-- End Modal Outscreen -->
<form action="/admin/add/user" method="POST" <form action="/admin/add/user" method="POST"
class="rounded-2xl flex-col bg-tertiary flex shadow-lg max-h-modal w-11/12 md:w-3/5 lg:w-2/5 xl:w-4/12 z-50"> class="rounded-2xl flex-col bg-tertiary flex shadow-lg max-h-modal w-11/12 md:w-3/5 lg:w-2/5 xl:w-4/12 z-50">
@ -37,24 +37,19 @@
<div class="grid grid-cols-2 gap-5 text-sm md:text-base"> <div class="grid grid-cols-2 gap-5 text-sm md:text-base">
<div class="md:col-span-1 col-span-2"> <div class="md:col-span-1 col-span-2">
<label class="mb-2 block text-color-tertiary text-sm"> <label class="mb-2 block text-color-tertiary text-sm">
<div class="relative w-max"> <div class="relative w-max">Username</div>
Username
</div>
</label> </label>
<input <input
class="form-input block w-full mt-1 rounded text-sm text-color-tertiary border-form bg-forminput transition duration-500 focus:border-transparent border-transparent focus:ring-0 focus:border-formaccent focus:text-color-accent" class="form-input block w-full mt-1 rounded text-sm text-color-tertiary border-form bg-forminput transition duration-500 focus:border-transparent border-transparent focus:ring-0 focus:border-formaccent focus:text-color-accent"
placeholder="Imposter" name="username" type="text" /> name="username" type="text" />
</div> </div>
<div class="md:col-span-1 col-span-2"> <div class="md:col-span-1 col-span-2">
<label class="mb-2 block text-color-tertiary text-sm"> <label class="mb-2 block text-color-tertiary text-sm">
<div class="relative w-max"> <div class="relative w-max">Password</div>
Secret Key
</div>
</label> </label>
<input <input
class="form-input block w-full mt-1 rounded text-sm text-color-tertiary border-form bg-forminput transition duration-500 focus:border-transparent border-transparent focus:ring-0 focus:border-formaccent focus:text-color-accent" class="form-input block w-full mt-1 rounded text-sm text-color-tertiary border-form bg-forminput transition duration-500 focus:border-transparent border-transparent focus:ring-0 focus:border-formaccent focus:text-color-accent"
placeholder="***************" name="password" type="password" /> name="password" type="password" />
</div> </div>
</div> </div>
</div> </div>
@ -64,9 +59,7 @@
<div class="p-6"> <div class="p-6">
<div class="flex items-center justify-end flex-wrap -mb-3"> <div class="flex items-center justify-end flex-wrap -mb-3">
<button type="submit" <button type="submit"
class="bg-accentsecondary w-auto hover:bg-accent rounded-md px-5 py-2 text-color-primary"> class="bg-accentsecondary w-auto hover:bg-accent rounded-md px-5 py-2 text-color-primary">Create User</button>
Add User
</button>
</div> </div>
<div> <div>
<!-- End Modal Footer --> <!-- End Modal Footer -->

12
views/pages/admin/main.ejs
Unescape View File

@ -11,7 +11,7 @@
<div class="flex flex-wrap lg:flex-row gap-6 pb-5"> <div class="flex flex-wrap lg:flex-row gap-6 pb-5">
<div class="col-span-12 sm:col-span-6 xl:col-span-2 min-w-30"> <div class="col-span-12 sm:col-span-6 xl:col-span-2 min-w-30">
<div class="bg-secondary shadow-xl rounded-lg p-5 hover:bg-secondary-hover"> <div class="bg-secondary shadow-xl rounded-lg p-5">
<div class="flex"> <div class="flex">
<i data-lucide="users" class="text-color-accent mr-2"></i> <i data-lucide="users" class="text-color-accent mr-2"></i>
</div> </div>
@ -25,7 +25,7 @@
</div> </div>
<div class="col-span-12 sm:col-span-6 xl:col-span-2 min-w-30"> <div class="col-span-12 sm:col-span-6 xl:col-span-2 min-w-30">
<div class="bg-secondary shadow-xl rounded-lg p-5 hover:bg-secondary-hover"> <div class="bg-secondary shadow-xl rounded-lg p-5">
<div class="flex"> <div class="flex">
<i data-lucide="files" class="text-color-accent mr-2"></i> <i data-lucide="files" class="text-color-accent mr-2"></i>
<p class="ml-auto text-slate-500 text-sm"> <p class="ml-auto text-slate-500 text-sm">
@ -46,7 +46,7 @@
</div> </div>
<div class="col-span-12 sm:col-span-6 xl:col-span-2 min-w-30"> <div class="col-span-12 sm:col-span-6 xl:col-span-2 min-w-30">
<div class="bg-secondary shadow-xl rounded-lg p-5 hover:bg-secondary-hover "> <div class="bg-secondary shadow-xl rounded-lg p-5">
<div class="flex"> <div class="flex">
<i data-lucide="image" class="text-blue-400 mr-2"></i> <i data-lucide="image" class="text-blue-400 mr-2"></i>
<p class="ml-auto text-slate-500 text-sm"> <p class="ml-auto text-slate-500 text-sm">
@ -63,7 +63,7 @@
</div> </div>
<div class="col-span-12 sm:col-span-6 xl:col-span-2 min-w-30"> <div class="col-span-12 sm:col-span-6 xl:col-span-2 min-w-30">
<div class="bg-secondary shadow-xl rounded-lg p-5 hover:bg-secondary-hover"> <div class="bg-secondary shadow-xl rounded-lg p-5">
<div class="flex"> <div class="flex">
<i data-lucide="video" class="text-yellow-400 mr-2"></i> <i data-lucide="video" class="text-yellow-400 mr-2"></i>
<p class="ml-auto text-slate-500 text-sm"> <p class="ml-auto text-slate-500 text-sm">
@ -80,7 +80,7 @@
</div> </div>
<div class="col-span-12 sm:col-span-6 xl:col-span-2"> <div class="col-span-12 sm:col-span-6 xl:col-span-2">
<div class="bg-secondary shadow-xl rounded-lg p-5 hover:bg-secondary-hover"> <div class="bg-secondary shadow-xl rounded-lg p-5">
<div class="flex"> <div class="flex">
<i data-lucide="headphones" class="text-orange-400 mr-2"></i> <i data-lucide="headphones" class="text-orange-400 mr-2"></i>
<p class="ml-auto text-slate-500 text-sm"> <p class="ml-auto text-slate-500 text-sm">
@ -97,7 +97,7 @@
</div> </div>
<div class="col-span-12 sm:col-span-6 xl:col-span-2 min-w-30"> <div class="col-span-12 sm:col-span-6 xl:col-span-2 min-w-30">
<div class="bg-secondary shadow-xl rounded-lg p-5 hover:bg-secondary-hover"> <div class="bg-secondary shadow-xl rounded-lg p-5">
<div class="flex"> <div class="flex">
<i data-lucide="ghost" class="text-green-400 mr-2"></i> <i data-lucide="ghost" class="text-green-400 mr-2"></i>
<p class="ml-auto text-slate-500 text-sm"> <p class="ml-auto text-slate-500 text-sm">

23
views/pages/admin/tabs/users.ejs
Unescape View File

@ -7,7 +7,7 @@
<button type="button" <button type="button"
class="buttonModal rounded-md bg-accentsecondary py-2 px-2.5 font-medium text-color-primary hover:bg-accent"> class="buttonModal rounded-md bg-accentsecondary py-2 px-2.5 font-medium text-color-primary hover:bg-accent">
Add New user Create User
</button> </button>
<!-- <!--
<button <button
@ -19,14 +19,6 @@
</div> </div>
<!-- End Add User --> <!-- End Add User -->
<!-- Total User -->
<div class="flex-1 lg:order-2 order-3 lg:basis-auto basis-full">
<div class="text-sm text-color-secondary lg:text-center text-right">
Showing <%= totalUsers %> users
</div>
</div>
<!-- End Total User -->
<!-- Search User --> <!-- Search User -->
<!-- <!--
<div <div
@ -48,6 +40,7 @@
--> -->
<!-- End Search user --> <!-- End Search user -->
</div> </div>
<div class="mt-8"> <div class="mt-8">
<!-- Table User --> <!-- Table User -->
<table class="table-fixed w-full md:text-base text-sm text-black"> <table class="table-fixed w-full md:text-base text-sm text-black">
@ -90,13 +83,9 @@
</div> </div>
</td> </td>
<!-- <!--
<td class="p-4 bg-tertiary text-color-secondary text-center">66</td>
<td class="p-4 bg-tertiary text-color-secondary text-center "> <td class="p-4 bg-tertiary text-color-secondary text-center ">
66 <div class="sm:border-r border-slate-700 border-r-0">65GB</div>
</td>
<td class="p-4 bg-tertiary text-color-secondary text-center ">
<div class="sm:border-r border-slate-700 border-r-0">
65GB
</div>
</td> </td>
--> -->
<!-- <!--
@ -104,9 +93,7 @@
<div class="flex justify-center"> <div class="flex justify-center">
<button class="text-red-500 flex sm:flex-row flex-col justify-center items-center space-x-1 "> <button class="text-red-500 flex sm:flex-row flex-col justify-center items-center space-x-1 ">
<i data-lucide="trash-2" class="text-color-red"></i> <i data-lucide="trash-2" class="text-color-red"></i>
<div> <div>Delete</div>
Delete
</div>
</button> </button>
</div> </div>
</td> </td>

6
views/pages/public/login.ejs
Unescape View File

@ -25,12 +25,12 @@
<label class="block text-sm"> <label class="block text-sm">
<span class="text-color-tertiary">Username</span> <span class="text-color-tertiary">Username</span>
<input class="form-input block w-full mt-1 rounded text-sm text-color-tertiary border-form bg-forminput transition duration-500 focus:border-transparent border-transparent focus:ring-0 focus:border-formaccent focus:text-color-accent" <input class="form-input block w-full mt-1 rounded text-sm text-color-tertiary border-form bg-forminput transition duration-500 focus:border-transparent border-transparent focus:ring-0 focus:border-formaccent focus:text-color-accent"
placeholder="Imposter" name="username" type="text" /> name="username" type="text" />
</label> </label>
<label class="block mt-4 text-sm"> <label class="block mt-4 text-sm">
<span class="text-color-tertiary">Secret Key</span> <span class="text-color-tertiary">Password</span>
<input class="form-input block w-full mt-1 rounded text-sm text-color-tertiary border-form bg-forminput transition duration-500 focus:border-transparent border-transparent focus:ring-0 focus:border-formaccent focus:text-color-accent" <input class="form-input block w-full mt-1 rounded text-sm text-color-tertiary border-form bg-forminput transition duration-500 focus:border-transparent border-transparent focus:ring-0 focus:border-formaccent focus:text-color-accent"
placeholder="***************" name="password" type="password" /> name="password" type="password" />
</label> </label>
<% if(settingsDatabase.captchaEnabled) { %> <% if(settingsDatabase.captchaEnabled) { %>
<div class="h-captcha mt-4" data-theme="dark" data-sitekey=<%= settingsDatabase.captchaSiteID %>></div> <div class="h-captcha mt-4" data-theme="dark" data-sitekey=<%= settingsDatabase.captchaSiteID %>></div>

30
views/pages/user/main.ejs
Unescape View File

@ -1,6 +1,4 @@
<span class="text-lg font-semibold text-color-secondary md:text-xl lg:text-xl"> <span class="text-lg font-semibold text-color-secondary md:text-xl lg:text-xl">Your Profile</span>
Your Profile
</span>
<div class="bg-tertiary mt-6 h-auto w-full rounded-lg"> <div class="bg-tertiary mt-6 h-auto w-full rounded-lg">
<div class="flex w-full flex-row flex-wrap items-center space-x-3 border-b border-purple-400/25 py-3 px-6 md:space-x-6 md:px-5 md:py-5 lg:space-x-6 lg:px-5 lg:py-5"> <div class="flex w-full flex-row flex-wrap items-center space-x-3 border-b border-purple-400/25 py-3 px-6 md:space-x-6 md:px-5 md:py-5 lg:space-x-6 lg:px-5 lg:py-5">
@ -23,26 +21,20 @@
<div class="flex flex-wrap lg:flex-row gap-6 items-center justify-center pb-5 -mx-5"> <div class="flex flex-wrap lg:flex-row gap-6 items-center justify-center pb-5 -mx-5">
<div class="col-span-12 sm:col-span-6 xl:col-span-2 min-w-30"> <div class="col-span-12 sm:col-span-6 xl:col-span-2 min-w-30">
<div class="bg-secondary shadow-xl rounded-lg p-5 hover:bg-secondary-hover"> <div class="bg-secondary shadow-xl rounded-lg p-5">
<div class="flex"> <div class="flex">
<i data-lucide="files" class="text-color-accent mr-2"></i> <i data-lucide="files" class="text-color-accent mr-2"></i>
<p class="ml-auto text-slate-500 text-sm"> <p class="ml-auto text-slate-500 text-sm"><%= totalSize %></p>
<%= totalSize %>
</p>
</div>
<div class="text-color-primary sm:text-lg md:text-3xl font-medium leading-8 mt-6">
<%= usersDataObj.totalFiles %>
</div>
<div class="sm:text-sm md:text-base text-base text-slate-500 mt-1">
Total Files
</div> </div>
<div class="text-color-primary sm:text-lg md:text-3xl font-medium leading-8 mt-6"><%= usersDataObj.totalFiles %></div>
<div class="sm:text-sm md:text-base text-base text-slate-500 mt-1">Files</div>
</div> </div>
</div> </div>
<div class="col-span-6 sm:col-span-3 xl:col-span-1 w-px h-40 border border-r border-accent border-dashed mx-4 xl:mx-6 hidden md:table-cell" ></div> <div class="col-span-6 sm:col-span-3 xl:col-span-1 w-px h-40 border border-r border-accent border-dashed mx-4 xl:mx-6 hidden md:table-cell" ></div>
<div class="col-span-12 sm:col-span-6 xl:col-span-2 min-w-30"> <div class="col-span-12 sm:col-span-6 xl:col-span-2 min-w-30">
<div class="bg-secondary shadow-xl rounded-lg p-5 hover:bg-secondary-hover "> <div class="bg-secondary shadow-xl rounded-lg p-5">
<div class="flex"> <div class="flex">
<i data-lucide="image" class="text-blue-400 mr-2"></i> <i data-lucide="image" class="text-blue-400 mr-2"></i>
<p class="ml-auto text-slate-500 text-sm"> <p class="ml-auto text-slate-500 text-sm">
@ -59,7 +51,7 @@
</div> </div>
<div class="col-span-12 sm:col-span-6 xl:col-span-2 min-w-30"> <div class="col-span-12 sm:col-span-6 xl:col-span-2 min-w-30">
<div class="bg-secondary shadow-xl rounded-lg p-5 hover:bg-secondary-hover"> <div class="bg-secondary shadow-xl rounded-lg p-5">
<div class="flex"> <div class="flex">
<i data-lucide="video" class="text-yellow-400 mr-2"></i> <i data-lucide="video" class="text-yellow-400 mr-2"></i>
<p class="ml-auto text-slate-500 text-sm"> <p class="ml-auto text-slate-500 text-sm">
@ -76,7 +68,7 @@
</div> </div>
<div class="col-span-12 sm:col-span-6 xl:col-span-2"> <div class="col-span-12 sm:col-span-6 xl:col-span-2">
<div class="bg-secondary shadow-xl rounded-lg p-5 hover:bg-secondary-hover"> <div class="bg-secondary shadow-xl rounded-lg p-5">
<div class="flex"> <div class="flex">
<i data-lucide="headphones" class="text-orange-400 mr-2"></i> <i data-lucide="headphones" class="text-orange-400 mr-2"></i>
<p class="ml-auto text-slate-500 text-sm"> <p class="ml-auto text-slate-500 text-sm">
@ -93,7 +85,7 @@
</div> </div>
<div class="col-span-12 sm:col-span-6 xl:col-span-2 min-w-30"> <div class="col-span-12 sm:col-span-6 xl:col-span-2 min-w-30">
<div class="bg-secondary shadow-xl rounded-lg p-5 hover:bg-secondary-hover"> <div class="bg-secondary shadow-xl rounded-lg p-5">
<div class="flex"> <div class="flex">
<i data-lucide="ghost" class="text-green-400 mr-2"></i> <i data-lucide="ghost" class="text-green-400 mr-2"></i>
<p class="ml-auto text-slate-500 text-sm"> <p class="ml-auto text-slate-500 text-sm">
@ -125,9 +117,7 @@
class="tabUser inline-flex w-full items-center space-x-2 px-6 pb-5 text-sm text-color-primary md:w-auto md:text-base lg:w-auto lg:text-base"> class="tabUser inline-flex w-full items-center space-x-2 px-6 pb-5 text-sm text-color-primary md:w-auto md:text-base lg:w-auto lg:text-base">
<i data-lucide="Settings" class="text-color-secondary"></i> <i data-lucide="Settings" class="text-color-secondary"></i>
<span>Config Gen</span> <span>Config Gen</span>
<span class="text-xs inline-block py-1 px-2.5 leading-none text-center whitespace-nowrap align-baseline font-bold bg-yellow-600 text-black rounded-full"> <span class="text-xs inline-block py-1 px-2.5 leading-none text-center whitespace-nowrap align-baseline font-bold bg-yellow-600 text-black rounded-full">TBA</span>
TBA
</span>
</button> </button>
</div> </div>
<!-- End Profile Tabs --> <!-- End Profile Tabs -->

2
views/pages/user/tabs/filemanager/infinite-scroll/no-more-data.ejs
Unescape View File

@ -6,6 +6,6 @@
<line x1="9" y1="9" x2="9.01" y2="9"></line> <line x1="9" y1="9" x2="9.01" y2="9"></line>
<line x1="15" y1="9" x2="15.01" y2="9"></line> <line x1="15" y1="9" x2="15.01" y2="9"></line>
</svg> </svg>
<span class="font-semibold text-color-primary">You have no more files to load! <%= settingsDatabase.appEmoji ? settingsDatabase.appEmoji : '🍆' %></span> <span class="font-semibold text-color-primary">There are no more files to load.</span>
</div> </div>
</div> </div>

10
views/templates/errors/404.ejs
Unescape View File

@ -4,12 +4,10 @@
<div class="flex flex-col items-center justify-center min-h-screen p-6"> <div class="flex flex-col items-center justify-center min-h-screen p-6">
<div class="flex-col lg:flex-row items-center justify-center h-screen text-center lg:text-left"> <div class="flex-col lg:flex-row items-center justify-center h-screen text-center lg:text-left">
<div class="text-color-primary mt-10 lg:mt-0"> <div class="text-color-primary mt-10 lg:mt-0">
<div class="text-8xl font-medium">404</div> <div class="text-8xl font-medium">Error 404</div>
<div class="text-xl lg:text-3xl font-medium mt-5">Oops. This page does not exist.</div> <div class="text-xl lg:text-3xl font-medium mt-5">Page Not Found</div>
<div class="text-lg mt-3">You may have mistyped the address or <%= settingsDatabase.name ? settingsDatabase.name.toUpperCase() : "DICK" %> seems to be malfunctioning</div> <div class="text-lg mt-3">The page you were looking for does not exist. You may have mistyped the URL or the page may have moved.</div>
<a href="/login" class="py-3 px-4 text-color-primary border-white dark:border-darkmode-400 dark:text-slate-200 mt-10"> <a href="/" class="py-3 px-4 text-color-primary border-white dark:border-darkmode-400 dark:text-slate-200 mt-10">Return Home</a>
Back to Home
</a>
</div> </div>
</div> </div>
</div> </div>

3
views/templates/partials/nav/breadcrumb.ejs
Unescape View File

@ -10,7 +10,6 @@
</svg> </svg>
<% if(path == '/'){ %><div href="#" class="inline-block text-gray-300">Dashboard</div> <% } %> <% if(path == '/'){ %><div href="#" class="inline-block text-gray-300">Dashboard</div> <% } %>
<% if(path == '/admin'){ %><div href="#" class="inline-block text-gray-300">Admin Dashboard</div> <% } %> <% if(path == '/admin'){ %><div href="#" class="inline-block text-gray-300">Admin</div> <% } %>
</div> </div>
</div> </div>

6
views/templates/partials/nav/profile.ejs
Unescape View File

@ -17,16 +17,14 @@
</svg> </svg>
</button> </button>
<div id="themeTogglerToolTip" role="tooltip" <div id="themeTogglerToolTip" role="tooltip"
class="inline-block absolute invisible z-10 py-2 px-3 text-sm font-medium text-color-primary bg-gray-900 rounded-lg shadow-sm opacity-0 transition-opacity duration-300 tooltip"> class="inline-block absolute invisible z-10 py-2 px-3 text-sm font-medium text-color-primary bg-gray-900 rounded-lg shadow-sm opacity-0 transition-opacity duration-300 tooltip">Toggle Theme
Toggle theme
<div class="tooltip-arrow" data-popper-arrow></div> <div class="tooltip-arrow" data-popper-arrow></div>
</div> </div>
<!-- End Theme Toggler --> <!-- End Theme Toggler -->
<!-- Navbar Profile Image --> <!-- Navbar Profile Image -->
<div class="dropdownProfileBtn relative z-[100] cursor-pointer hover:scale-110"> <div class="dropdownProfileBtn relative z-[100] cursor-pointer hover:scale-110">
<img class="relative h-10 w-10 rounded-full object-cover object-center" src=<%= settingsDatabase.defaultProfilePicture ? settingsDatabase.defaultProfilePicture : "./images/profile.png" %> <img class="relative h-10 w-10 rounded-full object-cover object-center" src=<%= settingsDatabase.defaultProfilePicture ? settingsDatabase.defaultProfilePicture : "./images/profile.png" %> alt="Profile" />
alt="Profile" />
</div> </div>
<!-- End Navbar Profile Image --> <!-- End Navbar Profile Image -->
</div> </div>

1
views/templates/user.ejs
Unescape View File

@ -24,6 +24,5 @@
<% } %> <% } %>
<%- include("./partials/footer") %> <%- include("./partials/footer") %>
</body> </body>
</html> </html>
Write Preview
Loading…
Cancel
Save