Hotfix - visual fix

iwokonl · Apr 18, 2024 · 2182239 · 2182239
1 parent 92425dc
commit 2182239
Show file tree

Hide file tree

Showing 3 changed files with 26 additions and 9 deletions.
diff --git a/Front/kantor-angular/src/app/currency-account/currency-account.component.html b/Front/kantor-angular/src/app/currency-account/currency-account.component.html
@@ -1,7 +1,7 @@
 
 
 <div class="container">
-  <h3>Spis kont walutowych</h3>
+  <h3 class="nag">Spis kont walutowych</h3>
   <div class="row">
     <div class="col-md-4" *ngFor="let account of accounts">
       <div class="card">

diff --git a/Front/kantor-angular/src/app/currency-account/currency-account.component.scss b/Front/kantor-angular/src/app/currency-account/currency-account.component.scss
@@ -1,20 +1,31 @@
 //cały kontener ze wszystkimi kafelkami
 .container {
-  display: flex;
-  flex-wrap: wrap;
-  align-items: stretch;
+  display: grid;
+  grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
+
+  justify-content: center;
 }
+.nag{
 
+}
 //cały kafelek wraz z zawartością
 .card{
+
   display: flex;
   flex-direction: column;
+  flex-wrap: wrap;
+  align-items: stretch;
   margin-bottom: 20px;
+
+
   border: 1px solid #ccc;
   border-radius: 5px;
   box-shadow: 0 2px 4px 0 rgba(0,0,0,.1);
   background-color: #fff;
   min-height: 140px;
+  min-width: 300px;
+
+
 
   transition: box-shadow .3s;
 
@@ -28,8 +39,14 @@
 //zawartość kafelka - tekst
 .card-body {
   flex-grow: 1;
+
 }
+.row{
+  margin-top: 15%;
+  margin-right: -300px;
+  margin-left: -350px;
 
+}
 .tile {
   flex: 1 1 auto;
   border: 1px solid #ccc;
@@ -39,6 +56,7 @@
   margin: 10px;
   padding: 20px;
   box-sizing: border-box;
+
 }
 
 .create-account-form {
@@ -47,4 +65,5 @@
    display: flex;
    flex-direction: column;
    align-items: center;
+
 }
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,14 +1,12 @@
 .currency-details {
   display: block;
-  width: 20%; // or any specific width
-  margin-left: 120px;
-  margin-right: auto;
-  margin-top: 50px;
-  margin-bottom: 50px;
+  width: 100%; // or any specific width
+  margin: 50px auto 50px 120px;
   padding: 20px;
   border: 1px solid #ccc;
   border-radius: 5px;
   box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
   background-color: #fff;
 
+
 }