minor modifications in CSS

MatejFrnka · Feb 7, 2024 · 834eeee · 834eeee
1 parent a838c3f
commit 834eeee
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 21 deletions.
diff --git a/frontend/sportsmatch-app/src/components/EventHistoryItem.tsx b/frontend/sportsmatch-app/src/components/EventHistoryItem.tsx
@@ -13,7 +13,7 @@ function EventHistoryItem({ eventHistoryDTO }: EventHistoryProps) {
         <div className="event-history-item">
           <div className="match-status">VICTORY (uncorfirmed)</div>
           <div className="user-side">
-            <div className="user-profile">
+            <div className="profile">
               <div className="user-avatar">
                 <Avatar src="pictures/michael-dam-mEZ3PoFGs_k-unsplash.jpg" />
               </div>
@@ -31,7 +31,7 @@ function EventHistoryItem({ eventHistoryDTO }: EventHistoryProps) {
             <div className="opponent-score score">
               <span>{eventHistoryDTO.opponentScore}</span>
             </div>
-            <div className="opponent-profile">
+            <div className="profile">
               <div className="opponent-avatar">
                 <Avatar src="pictures/jeffrey-keenan-pUhxoSapPFA-unsplash.jpg" />
               </div>

diff --git a/frontend/sportsmatch-app/src/styles/EventHistoryItem.css b/frontend/sportsmatch-app/src/styles/EventHistoryItem.css
@@ -33,7 +33,7 @@
     grid-column: 1;
     display: grid;
     grid-template-columns: 3fr 1fr 1fr;
-    padding: 9px;
+    padding: 9px 9px 0 9px;
     text-align: center;
     grid-template-rows: 2fr 1fr;
 }
@@ -42,20 +42,11 @@
     grid-column: 3;
     display: grid;
     grid-template-columns: 1fr 1fr 3fr;
-    padding: 9px;
+    padding: 9px 9px 0 9px;
     text-align: center;
     grid-template-rows: 2fr 1fr;
 }
 
-.user-profile {
-    grid-column: 2;
-}
-
-.opponent-profile {
-    grid-column: 2;
-}
-
-
 .score {
     height: 35px;
     color: #FC4C02;
@@ -79,25 +70,23 @@
     text-align: left;
 }
 
-.user-name {
+.profile {
+    grid-column: 2;
     color: #FC4C02;
-    grid-row: 2;
     margin: auto;
 }
+.user-name {
+    grid-row: 2;
+}
 
 .opponent-name {
-    color: #FC4C02;
     grid-row: 2;
-    margin: auto;
-
 }
 
-
 .user-avatar {
     width: 35px;
     height: 35px;
     grid-row: 1;
-    margin: auto;
 }
 
 .opponent-avatar {
@@ -110,7 +99,9 @@
 .match-status {
     color: #FC4C02;
     font-weight: bold;
+    font-size: 12px;;
     position: relative;
-    padding: 4px;
+    padding: 4px 4px 8px 8px;
+    letter-spacing: 10%;
 }