diff --git a/frontend/src/app/app-routing.module.ts b/frontend/src/app/app-routing.module.ts
index f5a78729051de672ea54db7033cdca951efca8bd..33fb3c81275beac8d9bb1e36576b1f3501ae2971 100644
--- a/frontend/src/app/app-routing.module.ts
+++ b/frontend/src/app/app-routing.module.ts
@@ -1,8 +1,8 @@
import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
-import { LoginComponent } from './login/login.component';
+import { LoginComponent } from './login-shit/login/login.component';
import { AdminComponent } from './admin/admin.component';
-import { SignupComponent } from './signup/signup.component';
+import { SignupComponent } from './login-shit/signup/signup.component';
const routes: Routes = [
{
diff --git a/frontend/src/app/app.component.css b/frontend/src/app/app.component.css
index b32cb712e72d845e8259289f3255ca0f8e730589..e69de29bb2d1d6434b8b29ae775ad8c2e48c5391 100644
--- a/frontend/src/app/app.component.css
+++ b/frontend/src/app/app.component.css
@@ -1,12 +0,0 @@
-nav {
- position: sticky;
- top: 0;
- width: 100%;
- background-color: #3f51b5;
- color: #fff;
- display: flex;
- padding: 0 16px;
- align-items: center;
- height: 56px;
- font: 500 20px/32px Roboto, "Helvetica Neue", sans-serif;
- }
\ No newline at end of file
diff --git a/frontend/src/app/app.component.html b/frontend/src/app/app.component.html
index 7e215bd0e1c47e413011a4d82519630e2d415590..ae3f9f44012c65c334b11b3e6eda347fde4d090b 100644
--- a/frontend/src/app/app.component.html
+++ b/frontend/src/app/app.component.html
@@ -1,11 +1,23 @@
-<nav>
- NAVBAR
- <button (click)="router.navigateByUrl('/');">Home</button>
- <button *ngIf="auth.isAdmin()" (click)="router.navigateByUrl('/admin')">Dashboard</button>
- <button *ngIf="!auth.isLoggedIn()" (click)="router.navigateByUrl('/login')">Login</button>
- <button *ngIf="auth.isLoggedIn()" (click)="auth.logout()">Logout</button>
- <button *ngIf="!auth.isLoggedIn()" (click)="router.navigateByUrl('/signup')">Sign Up</button>
- <label >{{auth.getUsername()}}</label>
-</nav>
-<router-outlet>
-</router-outlet>
\ No newline at end of file
+<div class="flex h-screen flex-col">
+ <nav class="bg-violet-900 px-6 py-4 flex flex-row justify-between text-white items-center">
+ <div class="flex flex-row">
+ <h2 class="mr-6 border-2 border-transparent font-bold">Navbar</h2>
+ <div>
+ <button class="mr-4 border-2 border-transparent hover:border-solid hover:border-white hover:border-2 hover:rounded-lg px-2" (click)="router.navigateByUrl('/');">Home</button>
+ <button class="border-2 border-transparent hover:border-solid hover:border-white hover:border-2 hover:rounded-lg px-2" *ngIf="auth.isAdmin()" (click)="router.navigateByUrl('/admin')">Dashboard</button>
+ </div>
+ </div>
+ <div class="flex flex-row">
+ <button class="mr-4 border-2 border-transparent hover:border-solid hover:border-white hover:border-2 hover:rounded-lg px-2" *ngIf="!auth.isLoggedIn()" (click)="router.navigateByUrl('/login')">Login</button>
+ <button class="mr-4 border-2 border-transparent hover:border-solid hover:border-white hover:border-2 hover:rounded-lg px-2" *ngIf="auth.isLoggedIn()" (click)="auth.logout()">Logout</button>
+ <button class="mr-4 border-2 border-transparent hover:border-solid hover:border-white hover:border-2 hover:rounded-lg px-2" *ngIf="!auth.isLoggedIn()" (click)="router.navigateByUrl('/signup')">Sign Up</button>
+
+ <div class="border-2 border-transparent bg-violet-950 h-8 w-8 rounded-full flex justify-center items-center">{{auth.getUsername().split('')[0].toUpperCase()}}</div>
+ </div>
+ </nav>
+
+ <main class="w-full h-full">
+ <router-outlet>
+ </router-outlet>
+ </main>
+</div>
\ No newline at end of file
diff --git a/frontend/src/app/app.module.ts b/frontend/src/app/app.module.ts
index e32444d79e9375f47cced09e88739426cbb3b87c..b5ae650876b87ed2e3a1a6c1c2d9ce562ea75a54 100644
--- a/frontend/src/app/app.module.ts
+++ b/frontend/src/app/app.module.ts
@@ -5,12 +5,12 @@ import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import {HTTP_INTERCEPTORS, HttpClientModule} from '@angular/common/http';
import { AdminComponent } from './admin/admin.component';
-import { LoginComponent } from './login/login.component';
+import { LoginComponent } from './login-shit/login/login.component';
import { ReactiveFormsModule } from '@angular/forms';
import { TokenInterceptor } from './interceptors/token-interceptor';
-import { SignupComponent } from './signup/signup.component';
-import { CreateUserComponent } from './create-user/create-user.component';
-import { UpdateUserComponent } from './update-user/update-user.component';
+import { SignupComponent } from './login-shit/signup/signup.component';
+import { CreateUserComponent } from './user-shit/create-user/create-user.component';
+import { UpdateUserComponent } from './user-shit/update-user/update-user.component';
@NgModule({
declarations: [
diff --git a/frontend/src/app/login/login-routing.module.ts b/frontend/src/app/login-shit/login/login-routing.module.ts
similarity index 100%
rename from frontend/src/app/login/login-routing.module.ts
rename to frontend/src/app/login-shit/login/login-routing.module.ts
diff --git a/frontend/src/app/create-user/create-user.component.css b/frontend/src/app/login-shit/login/login.component.css
similarity index 100%
rename from frontend/src/app/create-user/create-user.component.css
rename to frontend/src/app/login-shit/login/login.component.css
diff --git a/frontend/src/app/login-shit/login/login.component.html b/frontend/src/app/login-shit/login/login.component.html
new file mode 100644
index 0000000000000000000000000000000000000000..c6df74e87949b0b8818958077227da440a62fb9e
--- /dev/null
+++ b/frontend/src/app/login-shit/login/login.component.html
@@ -0,0 +1,12 @@
+<div class="h-full w-full flex justify-center">
+ <div class="bg-white border-2 border-neutral-800 rounded-lg p-5 flex flex-col items-center mt-80 h-fit">
+ <h1>Login</h1>
+ <form [formGroup]="loginForm" (ngSubmit)="onSubmit()">
+ <input class="border-b-4 mt-2" type="text" placeholder="Username" formControlName="username">
+ <br>
+ <input class="border-b-4 mt-2" type="password" placeholder="Password" formControlName="password">
+ <br>
+ <button class="border-2 border-black rounded-lg px-2 hover:bg-gray-300 mt-2" type="submit">Log In</button>
+ </form>
+ </div>
+</div>
\ No newline at end of file
diff --git a/frontend/src/app/login/login.component.spec.ts b/frontend/src/app/login-shit/login/login.component.spec.ts
similarity index 100%
rename from frontend/src/app/login/login.component.spec.ts
rename to frontend/src/app/login-shit/login/login.component.spec.ts
diff --git a/frontend/src/app/login/login.component.ts b/frontend/src/app/login-shit/login/login.component.ts
similarity index 91%
rename from frontend/src/app/login/login.component.ts
rename to frontend/src/app/login-shit/login/login.component.ts
index 64e2754b5a605e452e6afc88b654b7729ac89c58..7107c9ee0cbaff86b0567f29850fe0fa69eeb543 100644
--- a/frontend/src/app/login/login.component.ts
+++ b/frontend/src/app/login-shit/login/login.component.ts
@@ -1,7 +1,7 @@
import { Component, OnInit } from '@angular/core';
import { FormControl, FormGroup, Validators } from '@angular/forms';
import { Router } from '@angular/router';
-import { AuthenticationService } from '../services/authentication.service';
+import { AuthenticationService } from '../../services/authentication.service';
@Component({
selector: 'app-login',
diff --git a/frontend/src/app/login/login.module.ts b/frontend/src/app/login-shit/login/login.module.ts
similarity index 100%
rename from frontend/src/app/login/login.module.ts
rename to frontend/src/app/login-shit/login/login.module.ts
diff --git a/frontend/src/app/signup/signup.component.css b/frontend/src/app/login-shit/signup/signup.component.css
similarity index 100%
rename from frontend/src/app/signup/signup.component.css
rename to frontend/src/app/login-shit/signup/signup.component.css
diff --git a/frontend/src/app/login-shit/signup/signup.component.html b/frontend/src/app/login-shit/signup/signup.component.html
new file mode 100644
index 0000000000000000000000000000000000000000..702b528b6b61aedaa0c8c9da52d1b6d974bf5789
--- /dev/null
+++ b/frontend/src/app/login-shit/signup/signup.component.html
@@ -0,0 +1,12 @@
+<div class="h-full w-full flex justify-center">
+ <div class="bg-white border-2 border-neutral-800 rounded-lg p-5 flex flex-col items-center mt-80 h-fit">
+ <h1>Sign Up</h1>
+ <form [formGroup]="signupForm" (ngSubmit)="onSubmit()">
+ <input class="border-b-4 mt-2" type="text" placeholder="Username" formControlName="username">
+ <br>
+ <input class="border-b-4 mt-2" type="password" placeholder="Password" formControlName="password">
+ <br>
+ <button class="border-2 border-black rounded-lg px-2 hover:bg-gray-300 mt-2" type="submit">Sign Up</button>
+ </form>
+ </div>
+</div>
diff --git a/frontend/src/app/signup/signup.component.spec.ts b/frontend/src/app/login-shit/signup/signup.component.spec.ts
similarity index 100%
rename from frontend/src/app/signup/signup.component.spec.ts
rename to frontend/src/app/login-shit/signup/signup.component.spec.ts
diff --git a/frontend/src/app/signup/signup.component.ts b/frontend/src/app/login-shit/signup/signup.component.ts
similarity index 83%
rename from frontend/src/app/signup/signup.component.ts
rename to frontend/src/app/login-shit/signup/signup.component.ts
index 79274242f7cfd5950c55f077429240ff2045d702..ef685e7acb8c8236cb4316439d669ca9e4277dee 100644
--- a/frontend/src/app/signup/signup.component.ts
+++ b/frontend/src/app/login-shit/signup/signup.component.ts
@@ -1,9 +1,9 @@
import { Component } from '@angular/core';
import { FormControl, FormGroup, Validators } from '@angular/forms';
import { Router } from '@angular/router';
-import { UsersService } from '../services/users.service';
-import { AuthenticationService } from '../services/authentication.service';
-import { User } from '../Types/types';
+import { UsersService } from '../../services/users.service';
+import { AuthenticationService } from '../../services/authentication.service';
+import { User } from '../../Types/types';
@Component({
selector: 'app-signup',
diff --git a/frontend/src/app/login/login.component.css b/frontend/src/app/login/login.component.css
deleted file mode 100644
index f283317ef37836ee23ff132c45c9a851ca797218..0000000000000000000000000000000000000000
--- a/frontend/src/app/login/login.component.css
+++ /dev/null
@@ -1,26 +0,0 @@
-.form-signin {
- width: 100%;
- max-width: 330px;
- padding: 15px;
- margin: auto;
-}
-
-.form-signin .checkbox {
- font-weight: 400;
-}
-
-.form-signin .form-floating:focus-within {
- z-index: 2;
-}
-
-.form-signin input[type="email"] {
- margin-bottom: -1px;
- border-bottom-right-radius: 0;
- border-bottom-left-radius: 0;
-}
-
-.form-signin input[type="password"] {
- margin-bottom: 10px;
- border-top-left-radius: 0;
- border-top-right-radius: 0;
-}
\ No newline at end of file
diff --git a/frontend/src/app/login/login.component.html b/frontend/src/app/login/login.component.html
deleted file mode 100644
index 6441cffb2e3ab4bee0dd87fee851df2267f9177f..0000000000000000000000000000000000000000
--- a/frontend/src/app/login/login.component.html
+++ /dev/null
@@ -1,8 +0,0 @@
-<h1>Login</h1>
-<form [formGroup]="loginForm" (ngSubmit)="onSubmit()">
- <input type="text" placeholder="Username" formControlName="username">
- <br>
- <input type="password" placeholder="Password" formControlName="password">
- <br>
- <button type="submit">Log In</button>
-</form>
\ No newline at end of file
diff --git a/frontend/src/app/signup/signup.component.html b/frontend/src/app/signup/signup.component.html
deleted file mode 100644
index 099f63060f307d4bb39b62a70d99aedf9475e5fa..0000000000000000000000000000000000000000
--- a/frontend/src/app/signup/signup.component.html
+++ /dev/null
@@ -1,8 +0,0 @@
-<h1>Sign Up</h1>
-<form [formGroup]="signupForm" (ngSubmit)="onSubmit()">
- <input type="text" placeholder="Username" formControlName="username">
- <br>
- <input type="password" placeholder="Password" formControlName="password">
- <br>
- <button type="submit">Sign Up</button>
-</form>
\ No newline at end of file
diff --git a/frontend/src/app/update-user/update-user.component.css b/frontend/src/app/user-shit/create-user/create-user.component.css
similarity index 100%
rename from frontend/src/app/update-user/update-user.component.css
rename to frontend/src/app/user-shit/create-user/create-user.component.css
diff --git a/frontend/src/app/create-user/create-user.component.html b/frontend/src/app/user-shit/create-user/create-user.component.html
similarity index 100%
rename from frontend/src/app/create-user/create-user.component.html
rename to frontend/src/app/user-shit/create-user/create-user.component.html
diff --git a/frontend/src/app/create-user/create-user.component.spec.ts b/frontend/src/app/user-shit/create-user/create-user.component.spec.ts
similarity index 100%
rename from frontend/src/app/create-user/create-user.component.spec.ts
rename to frontend/src/app/user-shit/create-user/create-user.component.spec.ts
diff --git a/frontend/src/app/create-user/create-user.component.ts b/frontend/src/app/user-shit/create-user/create-user.component.ts
similarity index 91%
rename from frontend/src/app/create-user/create-user.component.ts
rename to frontend/src/app/user-shit/create-user/create-user.component.ts
index 0433a874d02a373fb2cf4b3f470f0e14a60e5f2c..984f2ec76d31bc553cd6040989757ce8dbf0b7e4 100644
--- a/frontend/src/app/create-user/create-user.component.ts
+++ b/frontend/src/app/user-shit/create-user/create-user.component.ts
@@ -1,7 +1,7 @@
import { Component, EventEmitter, Input, Output } from '@angular/core';
import { FormControl, FormGroup, Validators } from '@angular/forms';
-import { User } from '../Types/types';
-import { UsersService } from '../services/users.service';
+import { User } from '../../Types/types';
+import { UsersService } from '../../services/users.service';
@Component({
selector: 'app-create-user',
diff --git a/frontend/src/app/user-shit/update-user/update-user.component.css b/frontend/src/app/user-shit/update-user/update-user.component.css
new file mode 100644
index 0000000000000000000000000000000000000000..e69de29bb2d1d6434b8b29ae775ad8c2e48c5391
diff --git a/frontend/src/app/update-user/update-user.component.html b/frontend/src/app/user-shit/update-user/update-user.component.html
similarity index 100%
rename from frontend/src/app/update-user/update-user.component.html
rename to frontend/src/app/user-shit/update-user/update-user.component.html
diff --git a/frontend/src/app/update-user/update-user.component.spec.ts b/frontend/src/app/user-shit/update-user/update-user.component.spec.ts
similarity index 100%
rename from frontend/src/app/update-user/update-user.component.spec.ts
rename to frontend/src/app/user-shit/update-user/update-user.component.spec.ts
diff --git a/frontend/src/app/update-user/update-user.component.ts b/frontend/src/app/user-shit/update-user/update-user.component.ts
similarity index 91%
rename from frontend/src/app/update-user/update-user.component.ts
rename to frontend/src/app/user-shit/update-user/update-user.component.ts
index 0409efe635464242b081ef43db8a7670b4b4bb26..749e53d75d725d0f620d8868c9ca4ed8e2b60b73 100644
--- a/frontend/src/app/update-user/update-user.component.ts
+++ b/frontend/src/app/user-shit/update-user/update-user.component.ts
@@ -1,7 +1,7 @@
import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
import { FormControl, FormGroup, Validators } from '@angular/forms';
-import { User } from '../Types/types';
-import { UsersService } from '../services/users.service';
+import { User } from '../../Types/types';
+import { UsersService } from '../../services/users.service';
@Component({
selector: 'app-update-user',
diff --git a/frontend/src/index.html b/frontend/src/index.html
index 3af61ec9be6069adc54c86431f653d1982e8f9f8..200b0662b81e3c2e85d2eebc0b3da3a241934b74 100644
--- a/frontend/src/index.html
+++ b/frontend/src/index.html
@@ -7,7 +7,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" type="image/x-icon" href="favicon.ico">
</head>
-<body>
- <app-root></app-root>
+<body class="bg-violet-100 h-screen">
+ <app-root style="display: block; height: 100%;"></app-root>
</body>
</html>
diff --git a/frontend/src/styles.css b/frontend/src/styles.css
index 5dbc40afb79820408151efa73357d394e4f0a870..2d07941f99f034fa6a097a1b66673aae7ab4d9ac 100644
--- a/frontend/src/styles.css
+++ b/frontend/src/styles.css
@@ -1,4 +1,6 @@
/* You can add global styles to this file, and also import other style files */
@tailwind base;
@tailwind components;
-@tailwind utilities;
\ No newline at end of file
+@tailwind utilities;
+
+@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap');
\ No newline at end of file
diff --git a/frontend/tailwind.config.js b/frontend/tailwind.config.js
index 7586753924697a4507c2ef2c3313359baddf0519..3ccc1a8881467fd37f85e6a37389c24759f63ea7 100644
--- a/frontend/tailwind.config.js
+++ b/frontend/tailwind.config.js
@@ -5,6 +5,9 @@ module.exports = {
],
theme: {
extend: {},
+ fontFamily: {
+ 'sans': ["'Roboto'"]
+ }
},
plugins: [],
}