feat: added styling

This commit is contained in:
Smigz 2025-06-14 20:54:36 -04:00
parent 8be819bf91
commit 5ab9f0b2c2
7 changed files with 34 additions and 22 deletions

View file

@ -41,7 +41,7 @@ model File {
model Folder {
id String @id @default(uuid())
name String @db.VarChar(255)
creation_date DateTime @default(now())
createdAt DateTime @default(now())
modification_date DateTime @default(now())
File File[]
owner User? @relation(fields: [owner_user_id], references: [id])

View file

@ -141,8 +141,17 @@ input[type='file']:focus::file-selector-button {
main {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
}
main > div {
width: 100%;
}
aside {
min-width: 250px;
padding: 1em;
}
.flex {
display: flex;
@ -153,5 +162,9 @@ main {
grid-template-columns: 1fr 1fr 1fr;
}
.app {
height: 100%;
}
@media screen and (max-width: 600px) {
}

View file

@ -2,9 +2,10 @@ const {
getDirectoryContents,
getParentDirectories,
} = require('../services/fileService');
const { formatBytes } = require('../utils/formatHelpers');
const indexGet = async (req, res) => {
if (req.user) {
if (req.isAuthenticated()) {
res.redirect(`/fs/${req.user.username}/${req.user.rootDirectoryId}`);
// if unauthenticated redirect
} else {
@ -27,6 +28,7 @@ const userDirectoryNavigation = async (req, res) => {
folder: { id: directoryId, name: dirContents.name },
directoryListing: dirContents,
parentDirectories: parentDirectories,
formatBytes: formatBytes,
});
};

View file

@ -51,8 +51,7 @@ passport.deserializeUser(async (id, done) => {
});
const loggedIn = function (req, res, next) {
if (req.isAuthenticated()) console.log('logged in');
if (!req.user) res.redirect('/');
if (!req.isAuthenticated()) res.redirect('/');
next();
};

View file

@ -8,7 +8,7 @@ const getFullUploadPath = async (folderId, folderName, username, filename) => {
};
const formatBytes = (bytes, decimals = 2) => {
if (!+bytes) return '0 Bytes';
if (!+bytes) return '-';
const k = 1024;
const dm = decimals < 0 ? 0 : decimals;

View file

@ -1,23 +1,22 @@
<%- include('partials/header') %>
<body>
<% if(currentUser) { %>
<div class="container flex">
<div class="container flex app">
<aside class="nav">
<p> Hello <%= currentUser.username %> </p>
<a href="/auth/logout">sign out</a>
</div>
<main>
<div class="container">
<div class="container flex">
<%- include('partials/newDirectory') %>
<%- include('partials/fileUpload') %>
</div>
</aside>
<main>
<div class="container">
<%- include('partials/parentDirectories') %>
<%- include('partials/directoryListing') %>
</div>
</main>
</div>
<% } else { %>
<main>
<form action="/auth/login" method="post">

View file

@ -1,15 +1,15 @@
<section class="container directory-listing">
<div class="directory-grid">
<div class="col file-name heading directory__grid_heading">
<p>Name</p>
<p class="title__heading">Name</p>
</div>
<div class="col file-size directory__grid__heading">
<p>Size</p>
<p class="title__heading">Size</p>
</div>
<div class="col file-modified directory__grid__heading">
<p>Modified Last</p>
<p class="title__heading">Created</p>
</div>
<!-- Combined loop for both directories and files -->
<%
@ -23,10 +23,10 @@
<% } %>
</div>
<div class="col file-size">
<p><%= item?.size %></p>
<p><%= formatBytes(item?.size) %></p>
</div>
<div class="col file-modified">
<p><%= item?.modifiedAt %></p>
<p><%= item?.createdAt %></p>
</div>
<% }; %>
@ -36,6 +36,5 @@
<!-- Render files -->
<% directoryListing.File.forEach(f => renderItem(f, false)); %>
</div>
</div>
</div>
</section>