Merging settings with sidebar, currency-details visual update

iwokonl · May 13, 2024 · ec90241 · ec90241
1 parent 1b20ce6
commit ec90241
Show file tree

Hide file tree

Showing 5 changed files with 33 additions and 18 deletions.
diff --git a/Front/kantor-angular/src/app/currency-detail/currency-detail.component.scss b/Front/kantor-angular/src/app/currency-detail/currency-detail.component.scss
@@ -1,13 +1,20 @@
 .currency-details {
+  color: #DBDBDB;
   display: block;
   width: 550px;
-  margin: 50px auto 50px 120px;
+  margin-left: 340px;
+  //margin: 50px auto 50px 120px;
   padding: 20px;
-  border: 1px solid #ccc;
-  border-radius: 5px;
+  //border: 1px solid #ccc;
+  //border-radius: 5px;
   box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
   background-color: #fff;
   font-family: "Twemoji Country Flags", "Helvetica", serif;
 
+  border-radius: 47px;
+  border: 2px solid #DBDBDB;
+  background: linear-gradient(94deg, rgba(255, 255, 255, 0.04) 12.6%, rgba(255, 255, 255, 0.02) 100.13%);
+  backdrop-filter: blur(25px);
+
 
 }
diff --git a/Front/kantor-angular/src/app/header/header.component.html b/Front/kantor-angular/src/app/header/header.component.html
@@ -14,12 +14,12 @@
       <li class="nav-item active">
 <!--        <a class="nav-link" routerLink="/">Strona Główna</a>-->
       </li>
-      <li class="nav-item">
-        <a class="nav-link" routerLink="#">Kursy Walut</a>
-      </li>
-      <li class="nav-item">
-        <a class="nav-link" routerLink="#">Kontakt</a>
-      </li>
+<!--      <li class="nav-item">-->
+<!--        <a class="nav-link" routerLink="#">Kursy Walut</a>-->
+<!--      </li>-->
+<!--      <li class="nav-item">-->
+<!--        <a class="nav-link" routerLink="#">Kontakt</a>-->
+<!--      </li>-->
     </ul>
   </div>
 

diff --git a/Front/kantor-angular/src/app/settings/settings.component.html b/Front/kantor-angular/src/app/settings/settings.component.html
@@ -8,12 +8,12 @@
 <body>
   <div class="whole-settings">
     <!-- TODO: DODAC WIECEJ OPCJI DO MENU -->
-    <div class="settings-menu">
-      <p class="menu-title">Ustawienia</p>
-      <a class="nav-link profile" routerLink="settings">Profile</a>
-      <a class="nav-link" routerLink="security">Security</a>
-      <a class="nav-link" routerLink="help">Help</a>
-    </div>
+<!--    <div class="settings-menu">-->
+<!--      <p class="menu-title">Ustawienia</p>-->
+<!--      <a class="nav-link profile" routerLink="settings">Profile</a>-->
+<!--      <a class="nav-link" routerLink="security">Security</a>-->
+<!--      <a class="nav-link" routerLink="help">Help</a>-->
+<!--    </div>-->
     <div class="user-details">
       <p class="settings-title">Profile</p>
       <div class="form-container">

diff --git a/Front/kantor-angular/src/app/sidebar-left/sidebar-left.component.html b/Front/kantor-angular/src/app/sidebar-left/sidebar-left.component.html
@@ -7,6 +7,15 @@
     <a class="nav-link" routerLink="/">Strona Główna</a>
     <a class="nav-link" routerLink="#">Kursy Walut</a>
   </div>
+
+  <div class="nav-middle">
+    <div class="nav-bottom" *ngIf="router.url.startsWith('/settings')">
+      <a class="nav-link" routerLink="/settings" routerLinkActive="active">Profile</a>
+      <a class="nav-link" routerLink="/security" routerLinkActive="active">Security</a>
+      <a class="nav-link" routerLink="/help" routerLinkActive="active">Help</a>
+    </div>
+  </div>
+
   <div class="nav-bottom">
     <ng-container *ngIf="isLoggedIn; else notLoggedIn">
       <a class="nav-item nav-link" routerLink="/settings">Ustawienia</a>
@@ -17,8 +26,6 @@
       <a class="nav-item nav-link" routerLink="/login">Logowanie</a>
       <a class="nav-item nav-link" routerLink="/register">Rejestracja</a>
     </ng-template>
-  </div>
-  <div class="nav-bottom">
     <a class="nav-link" routerLink="#">Kontakt</a>
   </div>
 </div>
diff --git a/Front/kantor-angular/src/app/sidebar-left/sidebar-left.component.ts b/Front/kantor-angular/src/app/sidebar-left/sidebar-left.component.ts
@@ -1,6 +1,7 @@
 import {Component, OnDestroy, OnInit} from '@angular/core';
 import {Subscription} from "rxjs";
 import {AxiosService} from "../axios.service";
+import { Router } from '@angular/router';
 
 @Component({
   selector: 'app-sidebar-left',
@@ -12,7 +13,7 @@ export class SidebarLeftComponent implements OnInit, OnDestroy {
   isLoggedIn: boolean = false;
   private authStatusSub: Subscription | undefined;
 
-  constructor(public axiosService: AxiosService) { }
+  constructor(public axiosService: AxiosService, public router: Router) { }
 
   ngOnInit(): void {
     this.isLoggedIn = this.axiosService.getAuthTocken() !== null;