From ba93e7e783bb33fad9252ddb0cd43805d8052720 Mon Sep 17 00:00:00 2001
From: elisejakob <hei@elisejakob.no>
Date: Tue, 14 May 2024 21:28:29 +0200
Subject: [PATCH] add happy lil pig to expanded menu

---
 web/src/components/general/Logo.tsx          |  25 ++++
 web/src/components/general/logo.module.scss  |  13 ++
 web/src/components/layout/Header.tsx         | 121 ++++++++++---------
 web/src/components/layout/header.module.scss |  12 +-
 4 files changed, 108 insertions(+), 63 deletions(-)

diff --git a/web/src/components/general/Logo.tsx b/web/src/components/general/Logo.tsx
index c6a1a49..1d83414 100644
--- a/web/src/components/general/Logo.tsx
+++ b/web/src/components/general/Logo.tsx
@@ -58,3 +58,28 @@ export const Logo = () => {
     </div>
   );
 };
+
+export const LogoIcon = ({ face }: { face?: "left" | "right" }) => {
+  return (
+    <div className={`${styles.logoIcon} ${face && styles[face]}`}>
+      <svg viewBox="0 0 116 100" fill="none" xmlns="http://www.w3.org/2000/svg">
+        <path
+          d="M69.6652 64.3249C69.1722 63.6766 68.304 62.9918 67.193 62.6548C66.0856 62.3106 64.7649 62.252 63.4184 62.6988C62.7488 62.9222 62.0792 63.2921 61.4943 63.8451C60.9167 64.3981 60.42 65.1965 60.3097 66.1304C60.2618 66.5918 60.2986 67.0606 60.4274 67.4964C60.5635 67.9323 60.7769 68.3205 61.0307 68.6501C61.5531 69.2983 62.2043 69.7158 62.8555 69.9685C64.1689 70.4812 65.4712 70.3934 66.516 70.0454C67.5645 69.6902 68.3555 69.0236 68.7308 68.3461C69.1207 67.6686 69.095 67.0753 69.014 66.8519C68.9662 66.72 68.8338 66.6541 68.694 66.6468C69.1391 66.6468 69.5806 66.5955 69.9043 66.4124C70.2318 66.2366 70.412 65.918 70.3127 65.5664C70.2943 65.5371 70.1692 64.9841 69.6652 64.3322V64.3249Z"
+          fill="currentColor"
+        />
+        <path
+          d="M23.0197 77.9194C23.8585 77.436 23.9983 76.1212 23.3361 74.9749C22.6739 73.8323 21.4561 73.2939 20.6173 73.7737C19.7785 74.2534 19.6387 75.5719 20.3009 76.7182C20.9631 77.8608 22.1809 78.3992 23.0197 77.9194Z"
+          fill="currentColor"
+        />
+        <path
+          d="M15.2644 67.3426C14.4183 67.7162 14.1902 69.0456 14.753 70.3128C15.3159 71.5799 16.4601 72.3051 17.3062 71.9315C18.1524 71.558 18.3805 70.2285 17.8176 68.9614C17.2547 67.6942 16.1106 66.9691 15.2644 67.3426Z"
+          fill="currentColor"
+        />
+        <path
+          d="M114.85 54.7407C114.677 54.1218 114.486 53.5248 114.269 52.9462L113.507 50.8184C113.275 50.1006 112.955 49.423 112.65 48.7345L111.737 46.6763C109.155 41.2597 105.789 36.3375 102.275 31.6387C99.2475 27.6028 96.1351 23.6805 93.0926 19.7545C90.9367 17.0077 88.8949 14.2134 86.923 11.3824L85.5103 9.22525L84.8039 8.14853L84.1491 7.04617L82.8431 4.84144L81.1471 1.61859C80.8196 0.974017 80.3671 0.607784 79.9845 0.380719C79.635 0.179291 79.0942 -0.00382553 78.524 0.00716147C78.0052 0.0108238 77.4939 0.164642 77.1407 0.384382C77.0782 0.424667 77.023 0.472278 76.9715 0.527213L76.4932 1.03628L76.2173 1.33293L76.0775 1.47942C76.0333 1.53069 75.9818 1.56732 75.9487 1.66254L75.2902 3.13113L75.1246 3.49736L74.9812 3.83064L74.8193 4.21152C74.6022 4.71692 74.3999 5.23697 74.1975 5.75702C73.7965 6.79713 73.4323 7.86287 73.1012 8.94325C72.4537 11.1114 71.9681 13.382 71.8283 15.7222C71.7511 16.8905 71.7621 18.0808 71.8798 19.2527C71.9939 20.421 72.1999 21.5563 72.4353 22.6514C72.9099 24.8451 73.5022 26.9033 73.8738 28.903C74.0614 29.9028 74.1902 30.8806 74.2307 31.8438C74.2711 32.8107 74.2307 33.8105 74.1497 34.8433C74.1387 35.0081 74.124 35.1765 74.1093 35.345C73.4323 35.2022 72.7885 34.9348 72.1337 34.7078C71.2323 34.3928 70.3126 34.1218 69.3855 33.8984C67.3584 33.4113 65.3313 33.2099 63.2601 33.122C63.2453 33.122 63.2306 33.122 63.2159 33.122C63.2306 31.5984 62.2815 29.8259 61.4758 28.7748C60.2764 27.2073 58.6467 25.9328 57.0721 24.7572C55.446 23.545 53.7279 22.4536 51.8737 21.6259C49.6038 20.6114 47.1353 19.9779 44.6777 19.6995C42.2276 19.4322 39.851 19.4834 37.57 19.4871C35.2854 19.5018 33.1075 19.4248 30.9001 19.1428C27.1255 18.6777 23.4282 17.6523 19.9148 16.224C17.0783 15.107 14.2602 13.404 10.7947 12.4261C9.07294 11.9464 7.1231 11.6973 5.16959 12.0379L4.44116 12.1808C4.14316 12.2577 3.8562 12.3492 3.58396 12.4628C3.31172 12.5763 3.04684 12.7045 2.79299 12.8583C2.66423 12.9352 2.54282 13.0121 2.41038 13.1037C2.24115 13.2135 2.09031 13.3454 1.93948 13.4736C1.34717 14.0046 0.857867 14.6528 0.644489 15.3853L0.563552 15.66L0.519405 15.9383C0.493652 16.1178 0.50101 16.3082 0.493652 16.495C0.504689 16.6818 0.515726 16.8722 0.556194 17.0553C0.611378 17.2348 0.64081 17.4252 0.703352 17.601C0.868904 18.0075 1.08596 18.3957 1.38763 18.729C1.65988 19.033 1.98362 19.304 2.34416 19.5201C2.52075 19.6336 2.71205 19.7325 2.89968 19.824L3.04316 19.89L3.14249 19.9339L3.33012 20.0145C3.57293 20.1134 3.79734 20.1976 3.996 20.2672L4.53313 20.4943L5.61106 20.9411C5.79501 21.007 5.96792 21.0985 6.13715 21.1938L6.65588 21.4684C7.0017 21.6552 7.3512 21.8273 7.69334 22.0251L8.69033 22.677C9.36726 23.0835 9.98164 23.6182 10.6144 24.1053C13.1124 26.1452 15.3124 28.6576 17.5198 31.2176C19.7235 33.7849 21.9235 36.4584 24.4215 38.9597C25.0763 39.586 25.7312 40.2159 26.4191 40.8129L27.4824 41.6882L28.0158 42.124L28.5824 42.5268C30.1018 43.6512 31.577 44.5338 33.0596 45.4933C34.1523 46.1892 35.1934 46.9766 36.2934 47.6834C36.5362 47.8409 36.7901 47.9947 37.0476 48.1339C37.0035 48.1888 36.9556 48.2401 36.9115 48.295C35.5613 49.9248 34.3804 51.6717 33.1369 53.349C33.1369 53.349 32.7653 53.8471 32.758 53.8544L32.7212 53.8874C32.6733 53.935 32.5777 53.99 32.5078 54.0412C32.1951 54.2536 31.8051 54.4734 31.3894 54.6748C30.558 55.085 29.6382 55.4512 28.7074 55.7918C26.8349 56.473 24.8813 57.059 22.9205 57.6266C20.9155 58.2016 18.9178 58.8425 16.887 59.3663C16.1365 59.5567 15.3603 59.6373 14.6061 59.7838C14.378 59.8277 14.1425 59.8753 13.9328 59.9705C12.0639 60.0767 10.5923 60.9301 9.54753 61.8383C3.19032 67.3684 10.1582 75.3011 13.1345 78.6887C17.4057 83.5523 21.6145 86.0976 25.1205 86.0976C26.4155 86.0976 27.6111 85.746 28.6817 85.0392C28.9282 85.0392 29.1784 85.0282 29.2556 85.0246C30.3078 84.9916 31.3894 85.1747 32.4416 85.2333C32.5372 85.237 33.1001 85.2956 33.8322 85.3688C35.2081 87.7017 36.871 89.8918 38.9312 91.6644C40.9436 93.3967 43.4011 94.4368 45.7593 95.605C47.4884 96.4584 49.2359 97.2677 50.9908 98.0698C51.848 98.4616 52.7089 98.8462 53.5624 99.249C54.3055 99.6006 54.7727 99.7325 55.5858 99.9119C56.1376 100.036 58.1059 100.201 58.2309 98.8608C58.3744 97.2787 55.538 95.931 54.2172 95.3963C50.4353 93.8618 46.4547 92.2064 43.0038 90.0163C41.3078 88.9396 39.9944 87.5882 38.7693 86.0134C38.6995 85.9218 38.6222 85.8303 38.5486 85.7387C38.6443 85.7424 38.4861 85.7314 38.1807 85.7094C39.2954 85.7497 39.8804 85.7204 40.0974 85.7021C42.5513 85.5593 44.8801 84.4459 46.7085 82.8418C47.6393 82.0214 48.4192 81.0729 49.0851 80.0291C49.648 79.1465 50.5236 77.894 50.0159 76.8063C49.8135 76.3741 49.2286 76.0372 48.25 75.8724C47.2125 75.6929 46.5393 77.2348 46.1125 77.9196C45.5239 78.8609 44.6667 79.6483 43.747 80.2709C40.3071 82.6111 36.6319 81.842 32.7616 81.5014L31.4299 81.3659C32.4342 77.8024 30.5138 72.9352 25.8489 67.6248C23.6931 65.1711 21.883 63.4278 20.2091 62.2119C21.986 61.7468 23.7593 61.256 25.5325 60.7286C26.879 60.3258 28.2623 60.0072 29.6088 59.5164C30.6646 59.1282 31.7131 58.6924 32.7727 58.165C33.3061 57.8903 33.8322 57.6083 34.3841 57.2384C34.5202 57.1505 34.6637 57.0407 34.8035 56.9418C34.8734 56.8869 34.9396 56.8466 35.0168 56.777L35.2707 56.5572C35.3663 56.462 35.4841 56.3998 35.554 56.2862L35.771 55.9859L36.0065 55.66C37.8349 53.1037 39.7112 50.6096 41.7824 48.3023C44.159 45.6691 46.7784 43.285 49.6369 41.3476C50.0895 41.0473 50.5383 40.7396 51.0055 40.4686C51.2373 40.3294 51.4654 40.183 51.7008 40.0511L52.4072 39.6629C55.3651 38.0588 58.5915 37.0626 61.8952 36.8978C65.3276 36.7257 68.7858 37.4582 72.0638 38.7363C72.3102 38.8206 72.5531 38.9231 72.8069 38.989C73.241 39.0952 73.5317 39.1245 73.7965 39.0147C73.7377 39.7947 73.6898 40.5895 73.6862 41.4098C73.6862 42.0068 73.7009 42.6111 73.7561 43.2227L73.7929 43.6548C73.7929 43.6548 73.7965 43.6915 73.8002 43.7098L73.8664 44.1456L74.0062 45.0319C74.0099 45.0575 74.0136 45.0795 74.021 45.1051L74.2343 45.9731L74.341 46.3906C74.3447 46.4126 74.3521 46.4346 74.3594 46.4529L74.4955 46.863L74.7825 47.709C74.7899 47.731 74.7972 47.753 74.8083 47.7713L75.1578 48.588L75.3307 48.9835C75.338 49.0019 75.3491 49.0202 75.3564 49.0385L75.5551 49.4194L75.9708 50.2031C75.9818 50.2214 75.9929 50.2397 76.0039 50.258L76.4748 51.0088L76.7066 51.3714C76.7066 51.3714 76.7287 51.4043 76.7397 51.419L76.9935 51.7633L77.5196 52.4737C77.5196 52.4737 77.5454 52.5067 77.5564 52.5214L78.1303 53.1952L78.4099 53.5212C78.4099 53.5212 78.4357 53.5505 78.4504 53.5651L78.7521 53.8728L79.3959 54.5246C80.7019 55.7625 82.1293 56.9052 83.7628 57.7475C84.436 58.0698 85.1534 58.4104 85.8635 58.5093C86.1063 58.5496 86.3307 58.5788 86.5404 58.5752C86.7538 58.5679 86.9451 58.5422 87.1143 58.5019C87.4564 58.425 87.7103 58.2895 87.8758 58.1101C88.207 57.7512 88.1702 57.2201 87.8023 56.6232C87.6625 56.3961 87.5116 56.18 87.3424 55.9823C87.1768 55.7735 87.0039 55.5648 86.8016 55.3816C86.6029 55.1985 86.3822 55.0374 86.1431 54.8543C85.9039 54.6785 85.628 54.543 85.33 54.3818C82.523 52.9535 80.1685 50.5474 78.7852 47.7054C78.0935 46.2844 77.6337 44.7645 77.4865 43.2117C77.3283 41.6369 77.4387 39.9705 77.6042 38.2346C77.7367 36.8283 77.9317 35.3743 78.031 33.8544C78.0751 33.0927 78.0935 32.3163 78.0678 31.5252C78.0273 30.7378 77.9574 29.9504 77.8323 29.196C77.4534 26.8045 76.7875 24.5997 76.2762 22.4792C76.0186 21.4172 75.7979 20.3771 75.6581 19.3516C75.5183 18.3298 75.4741 17.3153 75.5072 16.2862C75.6139 13.6164 76.2909 10.9209 77.2437 8.27305C77.4792 7.61016 77.7367 6.94728 78.0052 6.28806L78.4909 5.11978C78.535 5.04287 78.5424 4.91103 78.6491 4.89638C78.7631 4.88539 78.7852 5.01357 78.8367 5.09048L79.4879 6.32469C81.4046 9.69769 83.4905 12.9645 85.7457 16.0738C87.9899 19.1868 90.3223 22.2265 92.6732 25.204C94.1484 27.0938 95.6384 28.9616 97.0842 30.844C98.2394 32.3089 99.3247 33.8032 100.439 35.2864C101.495 36.799 102.599 38.2859 103.574 39.8387L104.328 40.9923L104.703 41.571L105.049 42.1606L106.44 44.5228C106.881 45.3175 107.279 46.1342 107.702 46.94C107.908 47.3465 108.125 47.7457 108.316 48.1559L108.857 49.401L109.42 50.6939L109.699 51.3384C109.788 51.5545 109.858 51.7779 109.935 51.9976L110.858 54.6455C111.436 56.4217 111.829 58.1137 111.627 59.5677L111.557 60.0474C111.55 60.0877 111.542 60.128 111.531 60.1646C111.487 60.3221 111.436 60.4759 111.392 60.6298C111.366 60.7177 111.347 60.8055 111.314 60.8934L111.2 61.1461C111.119 61.311 111.064 61.4867 110.969 61.6479C110.612 62.3034 110.126 62.9041 109.571 63.4571C108.412 64.5228 106.933 65.3542 105.336 65.7644C104.869 65.9072 104.383 65.9731 103.916 66.1013C102.963 66.2954 102.415 66.3686 102.021 66.658C101.745 66.8447 101.543 67.1451 101.311 67.6065C101.105 68.0167 101.249 68.5148 101.635 68.7638C102.393 69.2472 103.294 69.5988 104.302 69.6904C105.608 69.8112 107.106 69.5475 108.566 68.6942C108.776 68.5697 108.986 68.4525 109.199 68.3353C109.405 68.2035 109.615 68.0753 109.828 67.9471C110.259 67.7091 110.663 67.4087 111.086 67.1304C111.303 66.9986 111.491 66.8228 111.693 66.6689C111.892 66.5041 112.098 66.3577 112.286 66.1782C112.65 65.8083 113.043 65.4677 113.345 65.0355C114.386 63.7134 115.133 62.08 115.391 60.3587C115.567 59.2381 115.641 57.3849 114.861 54.7444L114.85 54.7407ZM22.9094 70.1848C26.581 74.3672 29.2299 79.5054 26.8643 81.5637C24.4987 83.6219 19.7345 80.3221 16.0629 76.1434C9.58064 68.7601 10.3311 66.31 12.1081 64.7645C13.3994 63.6402 14.698 63.545 16.4566 64.4496C18.2114 65.3505 20.2606 67.1743 22.9094 70.1884V70.1848ZM56.5681 34.0339C55.1112 34.4294 53.7169 34.9788 52.3557 35.5941C50.0416 36.6854 47.8527 37.9929 45.8513 39.5164C43.46 41.3439 41.3005 43.3985 39.3028 45.5702C39.049 45.1637 38.6884 44.7975 38.1807 44.4862C36.9998 43.7611 35.8188 43.0103 34.6489 42.2522L32.8978 41.1059L32.0369 40.5272L31.2349 39.9376C29.0937 38.3774 27.1439 36.4913 25.2824 34.4734C23.774 32.8473 22.4165 31.0381 20.9228 29.3168C18.5756 26.6103 16.0997 23.8966 13.2154 21.4867L12.0455 20.5748L11.4569 20.1207L10.8315 19.7069L9.58064 18.8792L8.25622 18.154L7.59401 17.7951C7.36959 17.6779 7.13046 17.59 6.89869 17.4875L5.50069 16.8942C5.25788 16.788 5.05186 16.722 4.86791 16.6488L4.61407 16.5426L4.56624 16.5206C4.51473 16.495 4.46323 16.4584 4.4338 16.4034C4.38965 16.3119 4.4338 16.2057 4.5037 16.1397C4.51106 16.1324 4.52209 16.1251 4.53313 16.1141C4.55152 16.0995 4.53313 16.1141 4.58831 16.0738C4.67661 16.0152 4.77226 15.9603 4.87159 15.9127C4.97092 15.8651 5.07393 15.8211 5.17694 15.7882C5.22845 15.7698 5.27628 15.7625 5.3241 15.7442L5.53748 15.7039L5.98263 15.616L6.43514 15.5721C6.58598 15.5501 6.74049 15.5464 6.89501 15.5501C7.04952 15.5501 7.20404 15.5391 7.35856 15.5501C7.98398 15.5794 8.62043 15.671 9.26425 15.8175C10.5556 16.1214 11.8653 16.6268 13.1897 17.2201C14.5178 17.8098 15.8532 18.4836 17.2843 19.1136C18.7118 19.7435 20.1723 20.3075 21.6549 20.7946C23.5275 21.4135 25.4405 21.9079 27.3757 22.2815C30.3998 22.8711 33.5158 23.1568 36.5693 23.1714C39.5934 23.1971 42.4851 23.1092 45.1854 23.5377C50.7369 24.4276 55.8948 27.7603 59.0661 32.3822C59.2794 32.7191 59.5259 33.0451 59.754 33.371C58.6761 33.5248 57.6055 33.7629 56.557 34.0376L56.5681 34.0339Z"
+          fill="currentColor"
+        />
+      </svg>
+    </div>
+  );
+};
diff --git a/web/src/components/general/logo.module.scss b/web/src/components/general/logo.module.scss
index 4d339fd..0f70ce5 100644
--- a/web/src/components/general/logo.module.scss
+++ b/web/src/components/general/logo.module.scss
@@ -10,4 +10,17 @@
   svg {
     width: 100%;
   }
+}
+
+.logoIcon {
+  color: currentColor;
+  width: 3rem;
+
+  svg {
+    width: 100%;
+  }
+
+  &.right {
+    transform: scaleX(-1);
+  }
 }
\ No newline at end of file
diff --git a/web/src/components/layout/Header.tsx b/web/src/components/layout/Header.tsx
index 4cb5512..8e076fc 100644
--- a/web/src/components/layout/Header.tsx
+++ b/web/src/components/layout/Header.tsx
@@ -3,7 +3,7 @@ import { useState, useEffect, useRef } from "react";
 import { usePathname } from "next/navigation";
 import Link from "next/link";
 import styles from "./header.module.scss";
-import { Logo } from "../general/Logo";
+import { Logo, LogoIcon } from "@/components/general/Logo";
 
 export const Header = () => {
   const [showMenu, setShowMenu] = useState(false);
@@ -87,64 +87,67 @@ export const Header = () => {
         >
           <span className={styles.menuIcon}></span>
         </button>
-        <ul className={styles.fullMenu}>
-          <li className={styles.menuItemLarge}>
-            <Link
-              href="/arrangementer"
-              data-active={pathname === "/arrangementer"}
-            >
-              Arrangementer
-            </Link>
-          </li>
-          <li className={styles.menuItemLarge}>
-            <Link href="/" data-active={pathname === "/praktisk"}>
-              Praktisk info
-            </Link>
-          </li>
-          <li className={styles.menuItemLarge}>
-            <Link href="/utleie" data-active={pathname === "/utleie"}>
-              Utleie
-            </Link>
-          </li>
-          <li className={styles.menuItemLarge}>
-            <Link href="/" data-active={pathname === "/medlem"}>
-              Bli medlem
-            </Link>
-          </li>
-          <li className={styles.divider}>
-            <Link href="/aktuelt" data-active={pathname === "/aktuelt"}>
-              Siste nytt
-            </Link>
-          </li>
-          <li>
-            <Link href="/" data-active={pathname === "/om"}>
-              Om oss
-            </Link>
-          </li>
-          <li>
-            <Link href="/kontakt" data-active={pathname === "/kontakt"}>
-              Kontakt
-            </Link>
-          </li>
-          <li>
-            <Link href="/" data-active={pathname === "/frivillig"}>
-              Bli frivillig
-            </Link>
-          </li>
-          <li className={styles.search}>
-            <label>
-              <p>Søk</p>
-              <input type="text" />
-            </label>
-          </li>
-          <li className={styles.galtinn}>
-            <Link href="/">Mitt medlemskap &rarr;</Link>
-          </li>
-          <li>
-            {/* TODO: skal trolig ikke være så synlig ved lansering */}
-            <Link href="/lokaler">Lokaler*</Link>
-          </li>
-        </ul>
+        <div className={styles.fullMenu}>
+          <LogoIcon face="right" />
+          <ul>
+            <li className={styles.menuItemLarge}>
+              <Link
+                href="/arrangementer"
+                data-active={pathname === "/arrangementer"}
+              >
+                Arrangementer
+              </Link>
+            </li>
+            <li className={styles.menuItemLarge}>
+              <Link href="/" data-active={pathname === "/praktisk"}>
+                Praktisk info
+              </Link>
+            </li>
+            <li className={styles.menuItemLarge}>
+              <Link href="/utleie" data-active={pathname === "/utleie"}>
+                Utleie
+              </Link>
+            </li>
+            <li className={styles.menuItemLarge}>
+              <Link href="/" data-active={pathname === "/medlem"}>
+                Bli medlem
+              </Link>
+            </li>
+            <li className={styles.divider}>
+              <Link href="/aktuelt" data-active={pathname === "/aktuelt"}>
+                Siste nytt
+              </Link>
+            </li>
+            <li>
+              <Link href="/" data-active={pathname === "/om"}>
+                Om oss
+              </Link>
+            </li>
+            <li>
+              <Link href="/kontakt" data-active={pathname === "/kontakt"}>
+                Kontakt
+              </Link>
+            </li>
+            <li>
+              <Link href="/" data-active={pathname === "/frivillig"}>
+                Bli frivillig
+              </Link>
+            </li>
+            <li className={styles.search}>
+              <label>
+                <p>Søk</p>
+                <input type="text" />
+              </label>
+            </li>
+            <li className={styles.galtinn}>
+              <Link href="/">Mitt medlemskap &rarr;</Link>
+            </li>
+            <li>
+              {/* TODO: skal trolig ikke være så synlig ved lansering */}
+              <Link href="/lokaler">Lokaler*</Link>
+            </li>
+          </ul>
+        </div>
       </nav>
     </header>
   );
diff --git a/web/src/components/layout/header.module.scss b/web/src/components/layout/header.module.scss
index a02f272..47b0011 100644
--- a/web/src/components/layout/header.module.scss
+++ b/web/src/components/layout/header.module.scss
@@ -84,12 +84,16 @@
   background: var(--color-chateauBlue);
   color: var(--color-betongGray);
   padding: var(--spacing-sitepadding);
-  display: flex;
-  flex-direction: column;
-  justify-content: center;
-  font-size: 1.4rem;
 
   transition: all var(--transition-easing);
+
+  ul {
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    font-size: 1.4rem;
+    padding: var(--spacing-sitepadding) 0;
+  }
 }
 
 .menuItemLarge {