From 11b93dc4d44b3206fadbc27d9fbc298727defc25 Mon Sep 17 00:00:00 2001 From: skanderKha <124169513+skanderKha@users.noreply.github.com> Date: Mon, 2 Oct 2023 18:13:43 +0100 Subject: [PATCH] 574 restrict length of title components and keep it one line in web view (#589) * handle the title next stp the subtitle to do * fixing the length of the title of campaign to fit all the screen with a 100% width and fix the brand to fit all the screens --------- Co-authored-by: skanderKhabou --- .../campaign-detail.component.html | 240 ++++++++++-------- .../campaign-detail.component.scss | 28 +- 2 files changed, 150 insertions(+), 118 deletions(-) diff --git a/src/app/campaigns/campaign-details/components/campaign-detail/campaign-detail.component.html b/src/app/campaigns/campaign-details/components/campaign-detail/campaign-detail.component.html index 0cdd73afe..fb12db5ac 100755 --- a/src/app/campaigns/campaign-details/components/campaign-detail/campaign-detail.component.html +++ b/src/app/campaigns/campaign-details/components/campaign-detail/campaign-detail.component.html @@ -1,47 +1,60 @@ - + - +
- +
- - {{ campaign.title }} - - - - - - {{ campaign.title }} - - - - - + /> +
- - - -
-
- - -
-
-

{{ 'campaign_password.title' | translate }}

-
-
- -
-
-

{{ 'campaign_password.description2' | translate }}

+
+ + -
- -
-
-
- - + +
+
+

{{ 'campaign_password.title' | translate }}

-
- -
-

{{ errorMessage }}

-
+
+
+

{{ 'campaign_password.description2' | translate }}

+
+
-
-

{{ successMessage }}

-
+
+
+
+ + +
+
+
+
+

{{ errorMessage }}

+
-
-
- -
+ +
- - - - - - -
+ +
diff --git a/src/app/campaigns/campaign-details/components/campaign-detail/campaign-detail.component.scss b/src/app/campaigns/campaign-details/components/campaign-detail/campaign-detail.component.scss index d28ba3df7..e1bcca02e 100755 --- a/src/app/campaigns/campaign-details/components/campaign-detail/campaign-detail.component.scss +++ b/src/app/campaigns/campaign-details/components/campaign-detail/campaign-detail.component.scss @@ -196,9 +196,9 @@ padding-bottom: 3%; padding-right: 10%; width: max-content; - border-radius: 30px ; - background-color: #F6F6FF; - color: #ADADC8; + border-radius: 30px; + background-color: #f6f6ff; + color: #adadc8; font-family: 'Poppins'; border: 1px solid #adadc8; } @@ -413,6 +413,10 @@ display: block; } +.container_title { + flex-basis: max-content; +} + .campaign-title { display: flex; font-style: normal; @@ -420,7 +424,7 @@ font-size: 36px; letter-spacing: 1px; color: #1f2337; - max-width: 70%; + max-width: 100%; line-height: 40px; margin-top: 0.5em; text-transform: capitalize; @@ -450,6 +454,14 @@ margin-top: 0.5em; } +@media (min-width: 1025px) and (max-width: 1396px) { + .campaign-title { + max-width: 99% !important; + } + .campaign-brand { + width: 75% !important; + } +} @media (min-width: 768px) and (max-width: 1024.98px) { .div-footer-bar { display: flex !important; @@ -461,6 +473,10 @@ .modal-transaction-password { width: 70vw; } + + .campaign-title { + max-width: 74% !important; + } } @media (min-width: 768px) { @@ -727,9 +743,6 @@ } @media (max-width: 767.98px) { - .campaign-title { - max-width: 100%; - } .desktopClass { display: none; } @@ -753,6 +766,7 @@ padding-top: 1rem !important; } .campaign-title { + max-width: 100%; /* flex-grow: 1; */ /* width: 100% !important; */ /* text-align: center; */