fix: vertically align nav arrow with p5 logo using flexbox (#1430) (#1440)

doradocodes · kiranShamsHere · ksen0 · web-flow · commit a04f9752ffaa · 2026-06-11T13:43:14.000-04:00
* fix: vertically align nav arrow with p5 logo using flexbox

* fix: set explicit height on logo anchor to prevent SVG collapse

Co-authored-by: Kiran Shams &lt;kiranshamsdhiloo@gmail.com&gt;
Co-authored-by: kit &lt;1304340+ksen0@users.noreply.github.com&gt;
diff --git a/src/components/Nav/styles.module.scss b/src/components/Nav/styles.module.scss
@@ -66,11 +66,12 @@
     .logo {
       height: 50px;
       display: flex;
+      align-items: center;
       gap: var(--spacing-xs);
       padding: 0;
       margin-bottom: 10px;
       a {
-        height: unset;
+        height: 100%;
       }
     }
 
@@ -113,7 +114,6 @@
     display: none;
     @media (min-width: variables.$breakpoint-tablet) {
       display: block;
-      margin-top: 7.5px;
     }
   }
 

Original file line number	Diff line number	Diff line change
`@@ -66,11 +66,12 @@`
`66`	`66`	`.logo {`
`67`	`67`	`height: 50px;`
`68`	`68`	`display: flex;`
	`69`	`+ align-items: center;`
`69`	`70`	`gap: var(--spacing-xs);`
`70`	`71`	`padding: 0;`
`71`	`72`	`margin-bottom: 10px;`
`72`	`73`	`a {`
`73`		`- height: unset;`
	`74`	`+ height: 100%;`
`74`	`75`	`}`
`75`	`76`	`}`
`76`	`77`
`@@ -113,7 +114,6 @@`
`113`	`114`	`display: none;`
`114`	`115`	`@media (min-width: variables.$breakpoint-tablet) {`
`115`	`116`	`display: block;`
`116`		`- margin-top: 7.5px;`
`117`	`117`	`}`
`118`	`118`	`}`
`119`	`119`