From eb644dc882b52c6411afbe68806b589d7e844c7e Mon Sep 17 00:00:00 2001 From: "upsaurav12 ." Date: Fri, 15 Nov 2024 13:12:01 +0000 Subject: [PATCH 1/3] fix: opportunty card responsiveness Signed-off-by: upsaurav12 . --- src/reusecore/Layout/Row.js | 5 +++++ .../Careers-Internship-grid/InternshipPage.style.js | 7 +++++++ 2 files changed, 12 insertions(+) diff --git a/src/reusecore/Layout/Row.js b/src/reusecore/Layout/Row.js index 4f5bc953fb1c..57c5b6769b1f 100644 --- a/src/reusecore/Layout/Row.js +++ b/src/reusecore/Layout/Row.js @@ -5,6 +5,11 @@ const RowWrapper = styled.div` display: flex; margin-left: -15px; margin-right: -15px; + + @media (max-width: 1440px) { + flex-wrap: wrap; + } + @media (max-width: 760px) { flex-wrap: wrap; } diff --git a/src/sections/Careers/Careers-Internship-grid/InternshipPage.style.js b/src/sections/Careers/Careers-Internship-grid/InternshipPage.style.js index 26776273efbf..7ad9f1e97ecd 100644 --- a/src/sections/Careers/Careers-Internship-grid/InternshipPage.style.js +++ b/src/sections/Careers/Careers-Internship-grid/InternshipPage.style.js @@ -123,6 +123,13 @@ p{ @media screen and (max-width: 991px) { .opportunity-card { height: 12.5rem; + width: 16rem; + } + } + + @media screen and (max-width: 700px) { + .opportunity-card { + width: 23rem; } } From 9dcf7502bbf5084feb56e20349ac1fdf2d53ba91 Mon Sep 17 00:00:00 2001 From: "upsaurav12 ." Date: Fri, 15 Nov 2024 13:26:22 +0000 Subject: [PATCH 2/3] fix:full time Signed-off-by: upsaurav12 . --- .../Careers/Careers-Internship-grid/InternshipPage.style.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/sections/Careers/Careers-Internship-grid/InternshipPage.style.js b/src/sections/Careers/Careers-Internship-grid/InternshipPage.style.js index 7ad9f1e97ecd..98081fde0fd0 100644 --- a/src/sections/Careers/Careers-Internship-grid/InternshipPage.style.js +++ b/src/sections/Careers/Careers-Internship-grid/InternshipPage.style.js @@ -115,7 +115,8 @@ p{ } .full_time { - .opportunity-card { + flex-wrap: wrap; + .opportunity-card { height: 12rem; } } From db7adb42e4f3395c546a1d91c4437bc11c0f8156 Mon Sep 17 00:00:00 2001 From: "upsaurav12 ." Date: Mon, 18 Nov 2024 12:28:26 +0000 Subject: [PATCH 3/3] fix: cards responsive issue on mobile view Signed-off-by: upsaurav12 . --- src/reusecore/Layout/Row.js | 1 + .../Careers/Careers-Internship-grid/InternshipPage.style.js | 6 ++++++ 2 files changed, 7 insertions(+) diff --git a/src/reusecore/Layout/Row.js b/src/reusecore/Layout/Row.js index 57c5b6769b1f..4b52946d27d9 100644 --- a/src/reusecore/Layout/Row.js +++ b/src/reusecore/Layout/Row.js @@ -5,6 +5,7 @@ const RowWrapper = styled.div` display: flex; margin-left: -15px; margin-right: -15px; + flex-wrap: wrap; @media (max-width: 1440px) { flex-wrap: wrap; diff --git a/src/sections/Careers/Careers-Internship-grid/InternshipPage.style.js b/src/sections/Careers/Careers-Internship-grid/InternshipPage.style.js index 98081fde0fd0..8847dffeecac 100644 --- a/src/sections/Careers/Careers-Internship-grid/InternshipPage.style.js +++ b/src/sections/Careers/Careers-Internship-grid/InternshipPage.style.js @@ -128,6 +128,12 @@ p{ } } + @media only screen and (max-width: 489px) { + .opportunity-card { + width: 100% !important; + } + } + @media screen and (max-width: 700px) { .opportunity-card { width: 23rem;