fixes kolzchut/srm#768

kolzchut · Feb 15, 2024 · eaad13e · eaad13e
1 parent 5f56a58
commit eaad13e
Show file tree

Hide file tree

Showing 3 changed files with 36 additions and 14 deletions.
diff --git a/projects/srm/src/app/homepage/homepage.component.html b/projects/srm/src/app/homepage/homepage.component.html
@@ -14,9 +14,11 @@ <h1 class='tagline'>
     </div>    
     <div class='search' role="main">
         <p class='intro hide-while-searching'>
-            <strong>כל שירות מבית כל זכות</strong><br/>הוא אתר המרכז את כל השירותים החברתיים בישראל.
-            <br/><br/>
-            חפשו שירותים באתר:
+            <strong>כל שירות מבית כל זכות</strong>
+            <span>
+                הוא אתר המרכז את כל השירותים החברתיים בישראל.<br/><br/>
+                חפשו שירותים באתר:
+            </span>
         </p>
         <div class='searchbox-container layout-desktop' [class.searching]='searching' appArrowToTab (keydown)='keydown($event)'>
             <div class='searchbox desktop' *ngIf='!searching'>

diff --git a/projects/srm/src/app/homepage/homepage.component.less b/projects/srm/src/app/homepage/homepage.component.less
@@ -37,21 +37,27 @@
             display: flex;
             flex-flow: row;
             justify-content: flex-start;
-            gap: 0px;
             position: relative;
             z-index: 1;
             .mobile({
                 padding: 0 8px;
                 align-items: flex-start;
-                flex: 0 1 100%;
+                flex: 0 0 auto;
+                gap: 4px;
             });
             .desktop({
                 padding: 20px 24px;
                 align-items: center;
+                gap: 0px;
             });
 
             .menu-button {
-                width: 32px;
+                .mobile({
+                    width: 42px;
+                });
+                .desktop({
+                    width: 32px;
+                });
                 height: 32px;
                 display: flex;
                 flex-flow: column;
@@ -63,9 +69,9 @@
                 flex-flow: row;
                 align-items: flex-start;    
                 .mobile({
-                    flex-flow: column;
+                    flex-flow: row;
                     align-items: flex-start;
-                    gap: 2px;    
+                    gap: 4px;
                 });
                 .desktop({
                     flex-flow: row;
@@ -110,10 +116,9 @@
             gap: 8px;
 
             .mobile({
-                flex: 0 0 auto;
+                flex: 0 1 100%;
             });
 
-
             p {
                 .font-rag-sans;
                 font-size: 16px;
@@ -128,12 +133,27 @@
             }
 
             .intro {
-                font-size: 20px;
+                .desktop({
+                    font-size: 20px;
+                    line-height: 20px;
+                });
+                .mobile({
+                    font-size: 16px;
+                    line-height: 20px;
+                    flex: 0 0 auto;
+                    height: calc(50% ~'-' 100px);
+                    display: flex;
+                    flex-flow: column;
+                    justify-content: flex-end;
+                    gap: 0;
+                });
                 font-weight: 300;
-                line-height: 20px;
                 strong {
                     font-weight: 600;
                 }
+                span {
+                    white-space: pre-wrap;
+                }
             }
             .searchbox-container {
                 margin-top: 8px;
@@ -304,7 +324,7 @@
             flex-flow: row;
             .mobile({
                 width: 100%;
-                flex: 0 1 100%;
+                flex: 0 0 auto;
                 padding: 0 16px;
             });
             .desktop({

diff --git a/projects/srm/src/app/menu/menu-popup/menu-popup.component.less b/projects/srm/src/app/menu/menu-popup/menu-popup.component.less
@@ -59,7 +59,7 @@
             width: 100%;
             height: 100%;
             .mobile({
-                padding: 56px 24px 0px;    
+                padding: 48px 24px 0px;    
             });
             .desktop({
                 padding: 48px;