Patch - Most Requested: fix wrapping for long text link (#2380)

wet-boew · Jun 18, 2024 · 39738ea · 39738ea
1 parent 9c24a0b
commit 39738ea
Show file tree

Hide file tree

Showing 3 changed files with 6 additions and 6 deletions.
diff --git a/_includes/components/gc-most-requested/gc-most-requested.html b/_includes/components/gc-most-requested/gc-most-requested.html
@@ -6,8 +6,8 @@ <h2>{% if page.language == "en" %}Most requested{% else %}En demande{% endif %}<
 			<li><a href="#">[{% if page.language == "en" %}Top task hyperlink{% else %}Tâche principale{% endif %} 2]</a></li>
 			<li><a href="#">[{% if page.language == "en" %}Top task hyperlink{% else %}Tâche principale{% endif %} 3]</a></li>
 			<li><a href="#">[{% if page.language == "en" %}Top task hyperlink{% else %}Tâche principale{% endif %} 4]</a></li>
-			<li><a href="#">[{% if page.language == "en" %}Top task hyperlink{% else %}Tâche principale{% endif %} 5]</a></li>
-			<li><a href="#">[{% if page.language == "en" %}Top task hyperlink{% else %}Tâche principale{% endif %} 6]</a></li>
+			<li><a href="#">[{% if page.language == "en" %}Top task hyperlink with a very long task name than spans over two lines{% else %}Tâche principale avec un nom de tâche très long qui s'étend sur deux lignes{% endif %} 5]</a></li>
+			<li><a href="#">[{% if page.language == "en" %}Top task hyperlink with a very long task name than spans over two lines{% else %}Tâche principale avec un nom de tâche très long qui s'étend sur deux lignes{% endif %} 6]</a></li>
 		</ul>
 	</div>
 </section>
diff --git a/components/gc-most-requested/_screen-md-min.scss b/components/gc-most-requested/_screen-md-min.scss
@@ -13,12 +13,12 @@ div:not(.container) .gc-most-requested {
 	ul {
 		display: flex;
 		flex-wrap: wrap;
-		list-style-position: inside;
-		padding-left: 1.3em;
+		padding-left: 2.5em;
 
 		li {
 			flex-basis: 50%;
 			font-size: $small-size;
+			padding-right: 1.3em;
 		}
 	}
 }
diff --git a/components/gc-most-requested/samples/gc-most-requested.html b/components/gc-most-requested/samples/gc-most-requested.html
@@ -6,8 +6,8 @@ <h2>{% if page.language == "en" %}Most requested{% else %}En demande{% endif %}<
 			<li><a href="#">[{% if page.language == "en" %}Top task hyperlink{% else %}Tâche principale{% endif %} 2]</a></li>
 			<li><a href="#">[{% if page.language == "en" %}Top task hyperlink{% else %}Tâche principale{% endif %} 3]</a></li>
 			<li><a href="#">[{% if page.language == "en" %}Top task hyperlink{% else %}Tâche principale{% endif %} 4]</a></li>
-			<li><a href="#">[{% if page.language == "en" %}Top task hyperlink{% else %}Tâche principale{% endif %} 5]</a></li>
-			<li><a href="#">[{% if page.language == "en" %}Top task hyperlink{% else %}Tâche principale{% endif %} 6]</a></li>
+			<li><a href="#">[{% if page.language == "en" %}Top task hyperlink with a very long task name than spans over two lines{% else %}Tâche principale avec un nom de tâche très long qui s'étend sur deux lignes{% endif %} 5]</a></li>
+			<li><a href="#">[{% if page.language == "en" %}Top task hyperlink with a very long task name than spans over two lines{% else %}Tâche principale avec un nom de tâche très long qui s'étend sur deux lignes{% endif %} 6]</a></li>
 		</ul>
 	</div>
 </section>