Merge pull request #102 from KotlinFoundation/ktl-2150-logos

nikpachoo · web-flow · commit 4d4e0bdb88c3 · 2025-02-18T11:02:04.000+01:00
fix sponsors logo positioning
diff --git a/src/components/IntroBanner/introBanner.module.css b/src/components/IntroBanner/introBanner.module.css
@@ -63,12 +63,19 @@
   margin-left: calc(-1 * var(--ktf-companies-logo-spacing));
 
   @media (--ktl-ds-min) {
-    max-width: 480px;
+    max-width: 520px;
   }
 }
 
 .company {
   margin-left: var(--ktf-companies-logo-spacing);
+
+  /* this forces companies logos to spread among two lines equally  */
+  @media (width >= 473px) and (width <= 616px) {
+    &:nth-child(2) {
+      flex-basis: 50%;
+    }
+  }
 }
 
 .companyLogo {

Original file line number	Diff line number	Diff line change
`@@ -63,12 +63,19 @@`
`63`	`63`	`margin-left: calc(-1 * var(--ktf-companies-logo-spacing));`
`64`	`64`
`65`	`65`	`@media (--ktl-ds-min) {`
`66`		`- max-width: 480px;`
	`66`	`+ max-width: 520px;`
`67`	`67`	`}`
`68`	`68`	`}`
`69`	`69`
`70`	`70`	`.company {`
`71`	`71`	`margin-left: var(--ktf-companies-logo-spacing);`
	`72`	`+`
	`73`	`+ /* this forces companies logos to spread among two lines equally */`
	`74`	`+ @media (width >= 473px) and (width <= 616px) {`
	`75`	`+ &:nth-child(2) {`
	`76`	`+ flex-basis: 50%;`
	`77`	`+ }`
	`78`	`+ }`
`72`	`79`	`}`
`73`	`80`
`74`	`81`	`.companyLogo {`