fix(Use Case Participation): columns alignment ui issue (#1247)

eclipse-tractusx · Oct 28, 2024 · f98df16 · f98df16
1 parent cf9a7db
commit f98df16
Show file tree

Hide file tree

Showing 3 changed files with 13 additions and 3 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -2,6 +2,11 @@
 
 ## Unreleased
 
+### Bugfixes
+
+- **Use Case Participation**
+  - fixed columns alignment ui issue [#1247](https://github.com/eclipse-tractusx/portal-frontend/pull/1247)
+
 ## 2.3.0-RC1
 
 ### Change

diff --git a/src/components/pages/UsecaseParticipation/UsecaseParticipation.scss b/src/components/pages/UsecaseParticipation/UsecaseParticipation.scss
@@ -68,7 +68,7 @@
     padding: 30px;
   }
   .useCase-list-main {
-    max-width: 850px;
+    max-width: 1200px;
     width: 100%;
     margin: 0 auto 50px;
     .progress-main {
@@ -99,6 +99,9 @@
         }
         .credential-list {
           list-style: none;
+          .MuiAccordionSummary-root {
+            padding: 0px 25px 0px 0px;
+          }
           .credential-list-item {
             width: 100%;
             margin-bottom: 0;

diff --git a/src/components/pages/UsecaseParticipation/index.tsx b/src/components/pages/UsecaseParticipation/index.tsx
@@ -117,7 +117,7 @@ export default function UsecaseParticipation() {
               : 'N/A'}
           </Typography>
         </Trans>
-        {expiryDate.diff(todayDate, 'day') > 0 && (
+        {expiryDate.diff(todayDate, 'day') > 0 ? (
           <Typography variant="body3" className="fifthSection">
             <Chip
               color="secondary"
@@ -135,6 +135,8 @@ export default function UsecaseParticipation() {
               type="plain"
             />
           </Typography>
+        ) : (
+          <div className="fifthSection" />
         )}
       </div>
     )
@@ -238,7 +240,7 @@ export default function UsecaseParticipation() {
                                                 <div
                                                   className="credential-list-item"
                                                   style={{
-                                                    width: '82%',
+                                                    width: '80%',
                                                     textAlign: 'center',
                                                     margin: '0 0 10px',
                                                   }}