From a12da28c4f1706d7b3d8e427ffa0c97c6541ac9a Mon Sep 17 00:00:00 2001 From: kelen-dev Date: Tue, 3 Jun 2025 15:03:00 +0200 Subject: [PATCH 1/3] Refactor footer and header components for improved structure and styling; add hover effect to social media links and update background color variable --- .../essentials/footer/footer.component.css | 61 ++++++++++++++----- .../essentials/footer/footer.component.html | 43 +++---------- .../essentials/header/header.component.css | 9 ++- .../essentials/header/header.component.html | 40 +++--------- FencerJudgeFront/src/styles.css | 1 + 5 files changed, 71 insertions(+), 83 deletions(-) diff --git a/FencerJudgeFront/src/app/components/essentials/footer/footer.component.css b/FencerJudgeFront/src/app/components/essentials/footer/footer.component.css index a76370e..93884ad 100644 --- a/FencerJudgeFront/src/app/components/essentials/footer/footer.component.css +++ b/FencerJudgeFront/src/app/components/essentials/footer/footer.component.css @@ -1,21 +1,52 @@ +footer { + color: white; + background-color: var(--h-f-bg); + padding: 2rem; +} -.footer-gris { - background-color: #2c2c2c; /* Gris foncé personnalisé */ +.socialmedias { + display: flex; + justify-content: end; + align-items: center; +} + +.socialmedias a { + background-color: white; + text-decoration: none; + margin-left: 1rem; + height: 40px; + width: 40px; + border-radius: 50%; + display: flex; + align-items: center; + justify-content: center; + padding: .6rem; + transition: background-color .4s ease-in-out; +} + +.socialmedias a:hover { + background-color: var(--primary-color); } .flag-bar { - height: 6px; /* épaisseur du trait */ - width: 100%; /* toute la largeur */ - background: linear-gradient( - to right, - #0055a4 0%, /* bleu */ - #0055a4 33.33%, /* 1/3 */ - #fff 33.33%, /* blanc */ - #fff 66.66%, /* 2/3 */ - #ef4135 66.66%, /* rouge */ - #ef4135 100% - ); + height: 6px; + /* épaisseur du trait */ + width: 100%; + /* toute la largeur */ + background: linear-gradient(to right, + #0055a4 0%, + /* bleu */ + #0055a4 33.33%, + /* 1/3 */ + #fff 33.33%, + /* blanc */ + #fff 66.66%, + /* 2/3 */ + #ef4135 66.66%, + /* rouge */ + #ef4135 100%); margin-bottom: 8px; - border-radius: 3px; /* optionnel, pour arrondir les bords */ - box-shadow: 0 1px 3px rgba(0,0,0,0.1); + border-radius: 3px; + /* optionnel, pour arrondir les bords */ + box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1); } \ No newline at end of file diff --git a/FencerJudgeFront/src/app/components/essentials/footer/footer.component.html b/FencerJudgeFront/src/app/components/essentials/footer/footer.component.html index 9ec5e22..68e8789 100644 --- a/FencerJudgeFront/src/app/components/essentials/footer/footer.component.html +++ b/FencerJudgeFront/src/app/components/essentials/footer/footer.component.html @@ -1,43 +1,16 @@ - \ No newline at end of file diff --git a/FencerJudgeFront/src/app/components/essentials/header/header.component.css b/FencerJudgeFront/src/app/components/essentials/header/header.component.css index 9df8f3d..d7282b5 100644 --- a/FencerJudgeFront/src/app/components/essentials/header/header.component.css +++ b/FencerJudgeFront/src/app/components/essentials/header/header.component.css @@ -1,3 +1,7 @@ +nav { + background-color: var(--h-f-bg); +} + .navbar { box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1); } @@ -7,6 +11,7 @@ font-size: 1.4rem; display: flex; align-items: center; + color: white; } .navbar-brand img { @@ -15,11 +20,13 @@ } .nav-link { + text-transform: uppercase; + font-weight: 600; + color: white; transition: color 0.3s ease; } .nav-link:hover, .active-link { color: #ffcc00 !important; - font-weight: 600; } diff --git a/FencerJudgeFront/src/app/components/essentials/header/header.component.html b/FencerJudgeFront/src/app/components/essentials/header/header.component.html index c8ae8e8..d427b35 100644 --- a/FencerJudgeFront/src/app/components/essentials/header/header.component.html +++ b/FencerJudgeFront/src/app/components/essentials/header/header.component.html @@ -1,52 +1,28 @@ - - \ No newline at end of file diff --git a/FencerJudgeFront/src/styles.css b/FencerJudgeFront/src/styles.css index d888619..a599d8b 100644 --- a/FencerJudgeFront/src/styles.css +++ b/FencerJudgeFront/src/styles.css @@ -12,4 +12,5 @@ rgba(64, 64, 64, 0.95) 0%, rgba(32, 32, 32, 0.98) 50%, rgba(16, 16, 16, 0.95) 100%); + --h-f-bg: #2c2c2c; } \ No newline at end of file From 343f69d9283e85c8bdbdb42547931b9a077ff2c5 Mon Sep 17 00:00:00 2001 From: ExostFlash Date: Tue, 3 Jun 2025 15:24:58 +0200 Subject: [PATCH 2/3] modif --- .../app/components/match/matches-id/matches-id.component.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/FencerJudgeFront/src/app/components/match/matches-id/matches-id.component.html b/FencerJudgeFront/src/app/components/match/matches-id/matches-id.component.html index 2f926a0..6ce2a75 100644 --- a/FencerJudgeFront/src/app/components/match/matches-id/matches-id.component.html +++ b/FencerJudgeFront/src/app/components/match/matches-id/matches-id.component.html @@ -29,7 +29,7 @@
From 79e65186dc65b560d5ebe8a2fb15e7742822d4f7 Mon Sep 17 00:00:00 2001 From: kelen-dev Date: Tue, 3 Jun 2025 15:28:42 +0200 Subject: [PATCH 3/3] fix background on card & delete overflow-x --- FencerJudgeFront/src/app/components/home/home.component.css | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/FencerJudgeFront/src/app/components/home/home.component.css b/FencerJudgeFront/src/app/components/home/home.component.css index a523b15..0d2b5a9 100644 --- a/FencerJudgeFront/src/app/components/home/home.component.css +++ b/FencerJudgeFront/src/app/components/home/home.component.css @@ -624,7 +624,8 @@ height: 500px; color: white; text-align: center; - overflow: auto; + overflow-y: auto; + overflow-x: hidden; display: flex; flex-direction: column; padding: 20px; @@ -643,6 +644,7 @@ transform: translateY(-2px); /* Léger lift au hover */ border: 2px solid rgba(212, 175, 55, 0.6); + background: var(--card-gradient) !important; } .weapon-card:before, @@ -673,8 +675,6 @@ .weapon-card:hover:before, .diplomes-card:hover:before { - background: - var(--card-gradient); animation: metalShine 2s ease-in-out infinite alternate; }