From a374f1d6bafb2b575774884ebfd3dbc3ef11be58 Mon Sep 17 00:00:00 2001
From: Gurram Karthik <167804249+gurramkarthiknetha@users.noreply.github.com>
Date: Tue, 24 Dec 2024 16:30:19 +0530
Subject: [PATCH] fixed:#2510 Refactor CSS files in src/screens/ManageTag
(#2769)
* issue-2510-fixed
* changed in css
* changed acc to coderabbin
---
src/screens/ManageTag/ManageTag.tsx | 8 +--
src/style/app.module.css | 105 ++++++++++++++--------------
2 files changed, 55 insertions(+), 58 deletions(-)
diff --git a/src/screens/ManageTag/ManageTag.tsx b/src/screens/ManageTag/ManageTag.tsx
index 6afec3f130..7eb6a3221d 100644
--- a/src/screens/ManageTag/ManageTag.tsx
+++ b/src/screens/ManageTag/ManageTag.tsx
@@ -292,7 +292,7 @@ function ManageTag(): JSX.Element {
minWidth: 100,
align: 'center',
headerAlign: 'center',
- headerClassName: `${styles.tableHeader}`,
+ headerClassName: `${styles.tableHeaders}`,
sortable: false,
renderCell: (params: GridCellParams) => {
return
@@ -321,7 +321,7 @@ function ManageTag(): JSX.Element {
minWidth: 100,
headerAlign: 'center',
sortable: false,
- headerClassName: `${styles.tableHeader}`,
+ headerClassName: `${styles.tableHeaders}`,
renderCell: (params: GridCellParams) => {
return (
@@ -494,7 +494,7 @@ function ManageTag(): JSX.Element {
),
}}
sx={dataGridStyle}
- getRowClassName={() => `${styles.rowBackground}`}
+ getRowClassName={() => `${styles.rowBackgrounds}`}
autoHeight
rowHeight={65}
rows={userTagAssignedMembers?.map(
diff --git a/src/style/app.module.css b/src/style/app.module.css
index ae6daace2f..1903c7b323 100644
--- a/src/style/app.module.css
+++ b/src/style/app.module.css
@@ -12,10 +12,14 @@
--search-button-bg: #a8c7fa;
--search-button-border: #555555;
--table-image-size: 50px;
+ --bs-primary: #0056b3;
+ --bs-white: #fff;
+ --table-head-bg: var(--bs-primary, blue);
--table-head-bg: var(
--bs-primary,
blue
); /* Assuming var(--bs-primary) is defined elsewhere */
+
--table-head-color: white;
--table-header-color: var(--bs-greyish-black, black);
--table-head-radius: 20px;
@@ -87,6 +91,7 @@
border-bottom: 3px solid #31bb6b;
width: 15%;
}
+
.searchtitle {
color: #707070;
font-weight: 600;
@@ -101,6 +106,7 @@
display: flex;
justify-content: space-between;
}
+
.admindetails > p {
margin-top: -12px;
margin-right: 30px;
@@ -113,10 +119,12 @@
margin-right: -15px;
margin-bottom: 20px;
}
+
.justifysp {
display: flex;
justify-content: space-between;
}
+
@media screen and (max-width: 575.5px) {
.justifysp {
padding-left: 55px;
@@ -204,13 +212,11 @@
.input {
flex: 1;
-
position: relative;
}
.btnsContainer {
display: flex;
- /* Adjust spacing between items */
margin: 2.5rem 0;
align-items: center;
gap: 10px;
@@ -221,21 +227,33 @@
width: max-content;
}
-.btnsContainer .btnsBlock button {
+.btnsContainerBlockAndUnblock {
+ display: flex;
+ margin: 2.5rem 0 2.5rem 0;
+}
+
+.btnsContainerBlockAndUnblock .btnsBlockBlockAndUnblock {
+ display: flex;
+}
+
+.btnsContainerBlockAndUnblock .btnsBlockBlockAndUnblock button {
margin-left: 1rem;
display: flex;
justify-content: center;
align-items: center;
}
-.btnsContainer .input {
+.btnsContainerBlockAndUnblock .inputContainerBlockAndUnblock {
flex: 1;
position: relative;
- max-width: 60%;
- justify-content: space-between;
}
-.btnsContainer input {
+.btnsContainerBlockAndUnblock .inputBlockAndUnblock {
+ width: 70%;
+ position: relative;
+}
+
+.btnsContainerBlockAndUnblock input {
outline: 1px solid var(--bs-gray-400);
}
@@ -380,27 +398,10 @@
font-size: var(--font-size-header);
}
-.orgUserTagsScrollableDiv {
- scrollbar-width: auto;
- scrollbar-color: var(--bs-gray-400) var(--bs-white);
-
- max-height: calc(100vh - 18rem);
- overflow: auto;
- position: sticky;
-}
-
.errorContainer {
min-height: 100vh;
}
-.errorMessage {
- margin-top: 25%;
- display: flex;
- justify-content: center;
- align-items: center;
- flex-direction: column;
-}
-
.errorIcon {
transform: scale(1.5);
color: var(--bs-danger);
@@ -412,12 +413,6 @@
}
}
-.subTagsLink {
- color: var(--subtle-blue-grey);
- font-weight: 500;
- cursor: pointer;
-}
-
.subTagsLink i {
visibility: hidden;
}
@@ -437,7 +432,6 @@
.manageTagScrollableDiv {
scrollbar-width: thin;
scrollbar-color: var(--bs-gray-400) var(--bs-white);
-
max-height: calc(100vh - 18rem);
overflow: auto;
}
@@ -504,6 +498,7 @@ hr {
display: flex;
justify-content: flex-end;
}
+
.icon {
margin: 1px;
}
@@ -544,10 +539,6 @@ hr {
align-items: center;
}
-.toggleBtn:hover {
- color: var(--bs-primary) !important;
-}
-
.pageNotFound {
position: relative;
bottom: 20px;
@@ -563,10 +554,12 @@ hr {
margin-top: 50px;
font-size: 40px;
}
+
.pageNotFound .brand h3 {
font-weight: 300;
margin: 10px 0 0 0;
}
+
.pageNotFound h1.head {
font-size: 250px;
font-weight: 900;
@@ -574,6 +567,7 @@ hr {
letter-spacing: 25px;
margin: 10px 0 0 0;
}
+
.pageNotFound h1.head span {
position: relative;
display: inline-block;
@@ -590,6 +584,7 @@ hr {
.pageNotFound h1.head span:before {
left: -55%;
}
+
.pageNotFound h1.head span:after {
right: -55%;
}
@@ -839,6 +834,7 @@ hr {
font-size: 1rem;
color: black;
}
+
.cardBody {
min-height: 180px;
}
@@ -852,13 +848,6 @@ hr {
height: 2.5rem;
}
-@media (max-width: 520px) {
- .btn {
- flex-direction: column;
- justify-content: center;
- }
-}
-
@media (max-width: 1024px) {
.pageNotFound h1.head {
font-size: 200px;
@@ -922,12 +911,15 @@ hr {
right: -30%;
}
}
-
@media (max-width: 520px) {
.btnsContainer {
margin-bottom: 0;
}
+ .btn {
+ flex-direction: column;
+ justify-content: center;
+ }
.btnsContainer .btnsBlock {
display: block;
margin-top: 1rem;
@@ -1000,6 +992,16 @@ hr {
transform: rotate(360deg);
}
}
+.btnsContainer .input {
+ flex: 1;
+ position: relative;
+ max-width: 60%;
+ justify-content: space-between;
+}
+
+.btnsContainer input {
+ outline: 1px solid var(--bs-gray-400);
+}
.list_box {
height: auto;
@@ -1007,10 +1009,6 @@ hr {
width: 100%;
}
-.inputFields {
- box-shadow: 0 1px 1px #31bb6b;
-}
-
.fundName {
font-weight: 600;
cursor: pointer;
@@ -1052,6 +1050,12 @@ hr {
font-size: 1rem;
}
+.rowBackgrounds {
+ background-color: var(--bs-white);
+ max-height: 120px;
+ overflow-y: auto; /* Handle content overflow */
+}
+
.subTagsLink {
color: var(--bs-blue);
font-weight: 500;
@@ -1091,7 +1095,6 @@ hr {
.subTagsScrollableDiv {
scrollbar-width: auto;
scrollbar-color: var(--bs-gray-400) var(--bs-white);
-
max-height: calc(100vh - 18rem);
overflow: auto;
}
@@ -1209,12 +1212,6 @@ input[type='radio']:checked + label {
color: #31bb6b;
}
-/* Action Items Data Grid */
-.rowBackgrounds {
- background-color: var(--bs-white);
- max-height: 120px;
-}
-
.chipIcon {
height: 0.9rem !important;
}