From 7bda351830c5242e67fffbcf41d381f71813995d Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Pawe=C5=82=20=C5=9Aci=C5=9Blewski?= <thezaiko1234@gmail.com>
Date: Mon, 20 May 2024 21:46:45 +0200
Subject: [PATCH] Buttons fix at currency-detail

---
 .../currency-detail.component.html               | 12 +++++++-----
 .../currency-detail.component.scss               | 16 +++++++++++++---
 2 files changed, 20 insertions(+), 8 deletions(-)

diff --git a/Front/kantor-angular/src/app/currency-detail/currency-detail.component.html b/Front/kantor-angular/src/app/currency-detail/currency-detail.component.html
index 9a7f13ec..edc57f54 100644
--- a/Front/kantor-angular/src/app/currency-detail/currency-detail.component.html
+++ b/Front/kantor-angular/src/app/currency-detail/currency-detail.component.html
@@ -12,11 +12,13 @@ <h3>{{ currencyDetails.currency +' ' + currencyFlags[currencyDetails.code] }}</h
     <div class="chart-container"><canvas id="chart" width="80vw" height="60vh"></canvas></div>
 
     <div class="chart-buttons-container">
-      <button class="chart-buttons" (click)="changeDateRange(7)">1 T</button>
-      <button class="chart-buttons" (click)="changeDateRange(14)">2 T</button>
-      <button class="chart-buttons" (click)="changeDateRange(30)">1 M</button>
-      <button class="chart-buttons" (click)="changeDateRange(90)">3 M</button>
-      <button class="chart-buttons" (click)="changeDateRange(365)">1 R</button>
+      <div class="chart-buttons-inner-container">
+        <button class="chart-buttons" (click)="changeDateRange(7)">1 T</button>
+        <button class="chart-buttons" (click)="changeDateRange(14)">2 T</button>
+        <button class="chart-buttons" (click)="changeDateRange(30)">1 M</button>
+        <button class="chart-buttons" (click)="changeDateRange(90)">3 M</button>
+        <button class="chart-buttons" (click)="changeDateRange(365)">1 R</button>
+      </div>
     </div>
 
   </div>
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
index b32f947d..f6f6bcfb 100644
--- a/Front/kantor-angular/src/app/currency-detail/currency-detail.component.scss
+++ b/Front/kantor-angular/src/app/currency-detail/currency-detail.component.scss
@@ -17,7 +17,7 @@
   color: #DBDBDB;
   display: flex;
   flex-direction: column;
-  width: 80vh;
+  width: 75vh;
   //margin: 50px auto 50px 120px;
   padding: 1vh;
   //border: 1px solid #ccc;
@@ -52,13 +52,23 @@
   display: flex;
   justify-content: center;
   align-items: center;
-  gap: 2vw;
+  padding: 1%;
   width: 100%;
   height: 10%;
+  gap: 1%;
+}
+.chart-buttons-inner-container{
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  height: 100%;
+  width: 100%;
 }
 .chart-buttons{
+  width: 10%;
+  height: 100%;
   background: none;
-  border: none;
+  border: 1px solid transparent;
   color: rgba(228, 228, 228, 0.80);
   &:hover{
     border-radius: 10px;