@campxdev/shared 1.8.14 → 1.8.16

package/src/components/Layout/Header/assets/commutex.svg

@@ -0,0 +1,14 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="164.636" height="30" viewBox="0 0 164.636 30">
+  <defs>
+    <linearGradient id="linear-gradient" x1="0.5" x2="0.5" y2="1" gradientUnits="objectBoundingBox">
+      <stop offset="0" stop-color="#6a2886"/>
+      <stop offset="1" stop-color="#8234a4"/>
+    </linearGradient>
+  </defs>
+  <g id="Group_4626" data-name="Group 4626" transform="translate(-154.491 -25)">
+    <text id="COMMUTEX" transform="translate(186.127 47.5)" font-size="22" font-family="Nexa-XBold, Nexa" font-weight="700"><tspan x="0" y="0">COMMUTEX</tspan></text>
+    <g id="Group_4542" data-name="Group 4542" transform="translate(1.791 -224.981)">
+      <path id="Union_49" data-name="Union 49" d="M14.451,30l-3.59-4.941L7.271,30H.073L0,29.947,10.177,15.939H.007V14.064H10.226L3.657,5.031v0L0,0V0H7.312L10.9,4.941,14.492,0h7.2l.073.053L11.584,14.064H21.757v1.875H11.54l6.566,9.03v0L21.763,30v0Z" transform="translate(152.7 249.981)" fill="url(#linear-gradient)"/>
+    </g>
+  </g>
+</svg>

package/src/components/Layout/Header/assets/commutexSmall.svg

@@ -0,0 +1,11 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="25.391" height="35" viewBox="0 0 25.391 35">
+  <defs>
+    <linearGradient id="linear-gradient" x1="0.5" x2="0.5" y2="1" gradientUnits="objectBoundingBox">
+      <stop offset="0" stop-color="#6a2886"/>
+      <stop offset="1" stop-color="#8234a4"/>
+    </linearGradient>
+  </defs>
+  <g id="Group_4867" data-name="Group 4867" transform="translate(-152.7 -249.981)">
+    <path id="Union_49" data-name="Union 49" d="M16.86,35l-4.188-5.765L8.483,35H.085L0,34.938,11.873,18.6H.008V16.408H11.931L4.267,5.87l0,0L0,0,0,0H8.531l4.188,5.764L16.907,0h8.4l.086.062L13.514,16.408H25.383V18.6H13.463L21.124,29.13l0,0L25.391,35l0,0Z" transform="translate(152.7 249.981)" fill="url(#linear-gradient)"/>
+  </g>
+</svg>

package/src/components/Layout/Header/assets/enroll.svg

@@ -0,0 +1,14 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="144.563" height="30" viewBox="0 0 144.563 30">
+  <defs>
+    <linearGradient id="linear-gradient" x1="0.5" x2="0.5" y2="1" gradientUnits="objectBoundingBox">
+      <stop offset="0" stop-color="#007ab1"/>
+      <stop offset="1" stop-color="#149ecd"/>
+    </linearGradient>
+  </defs>
+  <g id="Group_4627" data-name="Group 4627" transform="translate(-142.219 -25)">
+    <g id="Group_4626" data-name="Group 4626" transform="translate(-6.346)">
+      <text id="ENROLLX" transform="translate(186.127 47.5)" font-size="22" font-family="Nexa-XBold, Nexa" font-weight="700"><tspan x="0" y="0">ENROLLX</tspan></text>
+    </g>
+    <path id="Union_6" data-name="Union 6" d="M-1754-2151h0v0l3.636-5v0l7.262-10h7.161l.073.053-10.86,14.947Zm13.437-6.012,6.53-8.988h7.161l.073.053-6.491,8.935Zm13.691-8.988Zm0,0h-7.161l-6.54-9h7.272l6.5,8.948Zm-16.228,0-7.262-10v0l-3.636-5v0h7.273l10.86,14.947-.073.053Zm5.443-15h0ZM-1737.657-2181Zm-7.275,0h0v0h7.273l0,0h-7.275Zm-9.068,0h0Z" transform="translate(1896.219 2206)" fill="url(#linear-gradient)"/>
+  </g>
+</svg>

package/src/components/Layout/Header/assets/enroll_logo.svg

@@ -0,0 +1,9 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="177.011" height="195.229" viewBox="0 0 177.011 195.229">
+  <defs>
+    <linearGradient id="linear-gradient" x1="0.5" x2="0.5" y2="1" gradientUnits="objectBoundingBox">
+      <stop offset="0" stop-color="#007ab1"/>
+      <stop offset="1" stop-color="#149ecd"/>
+    </linearGradient>
+  </defs>
+  <path id="Union_61" data-name="Union 61" d="M0,195.229H.009L0,195.215l23.664-32.567.009.013L70.934,97.615h46.6l.474.344-70.671,97.27ZM87.442,156.1l42.5-58.487h46.6l.474.344L134.768,156.1Zm89.1-58.487h0Zm0,0h-46.6L87.381,39.042h47.325L177.011,97.27Zm-105.6,0L23.673,32.568l-.009.013L0,.013.009,0H47.337l70.671,97.27-.474.344ZM106.356.022h0ZM106.357.022Zm-47.346,0L59,.013,59.014,0h47.327l.016.021H59.011ZM0,0H.009Z" fill="url(#linear-gradient)"/>
+</svg>

package/src/components/Layout/Header/assets/enrollx.svg

@@ -0,0 +1,14 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="144.563" height="30" viewBox="0 0 144.563 30">
+  <defs>
+    <linearGradient id="linear-gradient" x1="0.5" x2="0.5" y2="1" gradientUnits="objectBoundingBox">
+      <stop offset="0" stop-color="#007ab1"/>
+      <stop offset="1" stop-color="#149ecd"/>
+    </linearGradient>
+  </defs>
+  <g id="Group_4627" data-name="Group 4627" transform="translate(-142.219 -25)">
+    <g id="Group_4626" data-name="Group 4626" transform="translate(-6.346)">
+      <text id="ENROLLX" transform="translate(186.127 47.5)" font-size="22" font-family="Nexa-XBold, Nexa" font-weight="700"><tspan x="0" y="0">ENROLLX</tspan></text>
+    </g>
+    <path id="Union_6" data-name="Union 6" d="M-1754-2151h0v0l3.636-5v0l7.262-10h7.161l.073.053-10.86,14.947Zm13.437-6.012,6.53-8.988h7.161l.073.053-6.491,8.935Zm13.691-8.988Zm0,0h-7.161l-6.54-9h7.272l6.5,8.948Zm-16.228,0-7.262-10v0l-3.636-5v0h7.273l10.86,14.947-.073.053Zm5.443-15h0ZM-1737.657-2181Zm-7.275,0h0v0h7.273l0,0h-7.275Zm-9.068,0h0Z" transform="translate(1896.219 2206)" fill="url(#linear-gradient)"/>
+  </g>
+</svg>

package/src/components/Layout/Header/assets/exams_small.svg

@@ -0,0 +1,12 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="33.975" height="35" viewBox="0 0 33.975 35">
+  <defs>
+    <linearGradient id="linear-gradient" x1="0.5" x2="0.5" y2="1" gradientUnits="objectBoundingBox">
+      <stop offset="0" stop-color="#d86b00"/>
+      <stop offset="1" stop-color="#ed9035"/>
+    </linearGradient>
+  </defs>
+  <g id="Group_4349" data-name="Group 4349" transform="translate(-342.295 -263.508)">
+    <path id="Subtraction_34" data-name="Subtraction 34" d="M33.973,35H25.488l0,0L0,35l0,0,4.242-5.838,0,0L12.717,17.5,4.244,5.839l0,0L0,0,0,0H33.973l0,0L29.732,5.841l0,0L21.257,17.5,29.73,29.161l0,0L33.975,35l0,0ZM16.987,23.3,13.43,28.2l7.11,0L16.987,23.3ZM13.43,6.8l3.557,4.9L20.539,6.8l-7.109,0Z" transform="translate(342.295 263.508)" fill="url(#linear-gradient)"/>
+    <rect id="Rectangle_4307" data-name="Rectangle 4307" width="0.404" height="14.649" transform="translate(359.08 273.686)" fill="#16161d"/>
+  </g>
+</svg>

package/src/components/Layout/Header/assets/examsx.svg

@@ -0,0 +1,14 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="121.121" height="30" viewBox="0 0 121.121 30">
+  <defs>
+    <linearGradient id="linear-gradient" x1="0.5" x2="0.5" y2="1" gradientUnits="objectBoundingBox">
+      <stop offset="0" stop-color="#d86b00"/>
+      <stop offset="1" stop-color="#ed9035"/>
+    </linearGradient>
+  </defs>
+  <g id="Group_4626" data-name="Group 4626" transform="translate(-145.007 -25)">
+    <text id="EXAMX" transform="translate(184.127 47.5)" font-size="22" font-family="Nexa-XBold, Nexa" font-weight="700"><tspan x="0" y="0">EXAMX</tspan></text>
+    <g id="Group_4477" data-name="Group 4477" transform="translate(-197.288 -238.509)">
+      <path id="Subtraction_66" data-name="Subtraction 66" d="M29.12,30H21.847l0,0L0,30v0l3.636-5v0L10.9,15,3.638,5v0L0,0V0H29.12V0l-3.636,5V5L18.221,15l7.263,10v0l3.636,5,0,0ZM11.511,5.827h0l2.876,3.96V20.208l-2.876,3.96,6.094,0-2.871-3.956V9.787l2.871-3.956-6.094,0Z" transform="translate(342.295 263.509)" fill="url(#linear-gradient)"/>
+    </g>
+  </g>
+</svg>

package/src/components/Layout/Header/assets/hostel_small.svg

@@ -0,0 +1,13 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="50.761" height="35" viewBox="0 0 50.761 35">
+  <defs>
+    <linearGradient id="linear-gradient" x1="0.5" x2="0.5" y2="1" gradientUnits="objectBoundingBox">
+      <stop offset="0" stop-color="#573dab"/>
+      <stop offset="1" stop-color="#7251dd"/>
+    </linearGradient>
+  </defs>
+  <g id="Group_4351" data-name="Group 4351" transform="translate(-270.758 -251.98)">
+    <path id="Subtraction_9" data-name="Subtraction 9" d="M8.724,17.99H0l0,0,4.361-6,0,0L12.981.127,17.251,6l0,0,.09.124L8.724,17.99ZM21.7.124h0L21.614,0h.047l.088.063L21.7.124Z" transform="translate(283.16 268.99)" fill="url(#linear-gradient)"/>
+    <path id="Union_40" data-name="Union 40" d="M8.724,35H0l0,0,4.362-6v0l8.618-11.861.02.028,3.762-5.179,0,0L25.383.127l.043.058.026-.036L38.368,17.927l-.008.006L46.4,29l0,0,4.361,6,0,0H42.037L33.418,23.136l0,0-4.363-6v0h0l-.044-.061,0,0-.858-1.18.011,0-2.759-3.8L21.126,17.99h-.041l-3.908,5.374L8.724,35h0Zm8-34.847L16.619,0l0,0h.218l-.111.152h0ZM34.107.124,34.016,0h.047l.087.064-.044.061Z" transform="translate(270.758 251.98)" fill="url(#linear-gradient)"/>
+    <path id="Subtraction_10" data-name="Subtraction 10" d="M21.661,17.99H13.073L4.472,6.152l4.361-6L21.749,17.927l-.087.063ZM.109.152h0L0,0,0,0H.219L.109.152Z" transform="translate(287.377 268.989)" fill="url(#linear-gradient)"/>
+  </g>
+</svg>

package/src/components/Layout/Header/assets/hostelx.svg

@@ -0,0 +1,13 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="464.103" height="320" viewBox="0 0 464.103 320">
+  <defs>
+    <linearGradient id="linear-gradient" x1="0.5" x2="0.5" y2="1" gradientUnits="objectBoundingBox">
+      <stop offset="0" stop-color="#573dab"/>
+      <stop offset="1" stop-color="#7251dd"/>
+    </linearGradient>
+  </defs>
+  <g id="Group_4511" data-name="Group 4511" transform="translate(-270.758 -251.98)">
+    <path id="Subtraction_9" data-name="Subtraction 9" d="M79.763,164.484H.016L0,164.46l39.875-54.878.015.021L118.681,1.165,157.727,54.9l.015-.021.827,1.138L79.763,164.483ZM198.442,1.137h0L197.615,0h.431l.8.58-.4.555Z" transform="translate(384.15 407.496)" fill="url(#linear-gradient)"/>
+    <path id="Union_40" data-name="Union 40" d="M79.765,320H.017L0,319.974,39.878,265.1l.013.019,78.793-108.439.185.253,34.4-47.349.016.022,78.79-108.44.389.534.239-.333L350.791,163.9l-.077.058,73.5,101.155.016-.019L464.1,319.974l-.017.023H384.339L305.533,211.531l.031-.042L265.677,156.63l-.014.019,0,0v0l-.4-.554.02-.014-7.844-10.789.1.016-25.226-34.717-39.155,53.891h-.379l-35.728,49.138L79.765,320v0ZM152.94,1.392l-1-1.367L151.96,0h1.991L152.94,1.392v0Zm158.893-.256L311.008,0h.431l.8.583-.4.554Z" transform="translate(270.757 251.98)" fill="url(#linear-gradient)"/>
+    <path id="Subtraction_10" data-name="Subtraction 10" d="M198.046,164.484h-78.52L40.883,56.246,80.756,1.366,198.845,163.9l-.8.58ZM1,1.393h0L0,.024.015,0H2.006L1,1.392Z" transform="translate(422.701 407.495)" fill="url(#linear-gradient)"/>
+  </g>
+</svg>

package/src/components/Layout/Header/assets/index.ts

@@ -0,0 +1,35 @@
+import collegex from './campx.png'
+import enrollx from './entrollx.png'
+import examx from './examx.png'
+import payx from './payx.png'
+import peoplex from './pepolex.png'
+import campxSquareSmall from './campx_square_small.svg'
+import examsSmall from './exams_small.svg'
+import paySmall from './pay_small.svg'
+import peopleSmall from './people_small.svg'
+import hostelSmall from './hostel_small.svg'
+import background from './background.png'
+import contactBg from './contactBg.png'
+import commuteSmall from './commutexSmall.svg'
+import commutex from './commutex.png'
+import hostelx from './hostelx.png'
+import enrollSmall from './enroll_logo.svg'
+
+export {
+  collegex,
+  enrollx,
+  examx,
+  payx,
+  hostelx,
+  peoplex,
+  campxSquareSmall,
+  examsSmall,
+  paySmall,
+  peopleSmall,
+  hostelSmall,
+  background,
+  contactBg,
+  commutex,
+  commuteSmall,
+  enrollSmall,
+}

package/src/components/Layout/Header/assets/libraryx.svg

@@ -0,0 +1,12 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="145.621" height="30" viewBox="0 0 145.621 30">
+  <defs>
+    <linearGradient id="linear-gradient" x1="0.5" x2="0.5" y2="1" gradientUnits="objectBoundingBox">
+      <stop offset="0" stop-color="#cba100"/>
+      <stop offset="1" stop-color="#f8d759"/>
+    </linearGradient>
+  </defs>
+  <g id="Group_4626" data-name="Group 4626" transform="translate(-154.507 -25)">
+    <text id="LIBRARYX" transform="translate(186.127 47.5)" font-size="22" font-family="Nexa-XBold, Nexa" font-weight="700"><tspan x="0" y="0">LIBRARYX</tspan></text>
+    <path id="Union_4" data-name="Union 4" d="M-3281.868-5857h0Zm-7.273,0-.073-.1-.073.1h-7.273v0l2.106-2.9,1.53-2.106v0l.073-.1-7.15-9.842.073-.053h7.16l3.553,4.89,3.553-4.89-3.553-4.89-3.553,4.89h-7.16l-.073-.053,7.15-9.842-.073-.1v0l-3.636-5v0h7.272l.073.1.073-.1h7.273v0l-3.636,5v0l-.073.1,7.15,9.842-.073.053.073.053-7.15,9.842.073.1v0l3.636,5v0Zm-7.42-30h0Z" transform="translate(3454.507 5912)" fill="url(#linear-gradient)"/>
+  </g>
+</svg>

package/src/components/Layout/Header/assets/pay_small.svg

@@ -0,0 +1,16 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="24.634" height="35" viewBox="0 0 24.634 35">
+  <defs>
+    <linearGradient id="linear-gradient" x1="0.222" y1="1" x2="0.787" gradientUnits="objectBoundingBox">
+      <stop offset="0" stop-color="#88b053"/>
+      <stop offset="1" stop-color="#50840b"/>
+    </linearGradient>
+  </defs>
+  <g id="Group_4350" data-name="Group 4350" transform="translate(-1597.6 -781.549)">
+    <g id="Group_4461" data-name="Group 4461" transform="translate(1597.6 781.55)">
+      <g id="Group_4460" data-name="Group 4460" transform="translate(0 0)">
+        <path id="Subtraction_8" data-name="Subtraction 8" d="M8.75,17.991,21.775.063,21.688,0H13.1L4.389,11.988l0,0-4.361,6,0,0H8.75Z" transform="translate(2.859 17.009)" fill="url(#linear-gradient)"/>
+        <path id="Subtraction_8-2" data-name="Subtraction 8" d="M13.051,0,.026,17.927l.087.063H8.7L17.412,6l0,0,4.361-6,0,0H13.051Z" transform="translate(-0.026 0)" fill="url(#linear-gradient)"/>
+      </g>
+    </g>
+  </g>
+</svg>

package/src/components/Layout/Header/assets/payx.svg

@@ -0,0 +1,19 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="93.064" height="30" viewBox="0 0 93.064 30">
+  <defs>
+    <linearGradient id="linear-gradient" x1="0.222" y1="1" x2="0.787" gradientUnits="objectBoundingBox">
+      <stop offset="0" stop-color="#88b053"/>
+      <stop offset="1" stop-color="#50840b"/>
+    </linearGradient>
+  </defs>
+  <g id="Group_4626" data-name="Group 4626" transform="translate(-157.064 -25)">
+    <text id="PAYX" transform="translate(190.127 47.5)" font-size="22" font-family="Nexa-XBold, Nexa" font-weight="700"><tspan x="0" y="0">PAYX</tspan></text>
+    <g id="Group_4464" data-name="Group 4464" transform="translate(-1440.537 -756.55)">
+      <g id="Group_4461" data-name="Group 4461" transform="translate(1597.6 781.55)">
+        <g id="Group_4460" data-name="Group 4460" transform="translate(0 0)">
+          <path id="Subtraction_8" data-name="Subtraction 8" d="M7.5,15.42,18.668.054,18.593,0H11.232L3.766,10.275v0L.026,15.418v0H7.5Z" transform="translate(2.447 14.58)" fill="url(#linear-gradient)"/>
+          <path id="Subtraction_8-2" data-name="Subtraction 8" d="M11.19,0,.026,15.366.1,15.42H7.462L14.928,5.145v0L18.668,0V0H11.19Z" transform="translate(-0.026 0)" fill="url(#linear-gradient)"/>
+        </g>
+      </g>
+    </g>
+  </g>
+</svg>

package/src/components/Layout/Header/assets/people_small.svg

@@ -0,0 +1,9 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="46.624" height="35.002" viewBox="0 0 46.624 35.002">
+  <defs>
+    <linearGradient id="linear-gradient" x1="0.5" x2="0.5" y2="1" gradientUnits="objectBoundingBox">
+      <stop offset="0" stop-color="#d0002b"/>
+      <stop offset="1" stop-color="#ea4a6b"/>
+    </linearGradient>
+  </defs>
+  <path id="Union_1" data-name="Union 1" d="M-1718.525-7459l-5.5-7.575-1.032,1.42,4.429,6.071-.113.083h-20l0,0,4.479-6.165-1.023-1.408-5.5,7.574H-1754l0,0,5.6-7.715,0,0,11.076-15.242.085.116,6.578,9.018,6.616-9.017.065-.089,16.6,22.845-.111.083Zm-10.1-30.589a4.412,4.412,0,0,1,4.41-4.412,4.413,4.413,0,0,1,4.412,4.412,4.413,4.413,0,0,1-4.412,4.413A4.413,4.413,0,0,1-1728.62-7489.589Zm-13.114,0a4.412,4.412,0,0,1,4.412-4.412,4.412,4.412,0,0,1,4.41,4.412,4.412,4.412,0,0,1-4.41,4.413A4.413,4.413,0,0,1-1741.735-7489.589Z" transform="translate(1753.999 7494.002)" fill="url(#linear-gradient)"/>
+</svg>

package/src/components/Layout/Header/assets/peoplex.svg

@@ -0,0 +1,12 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="155.964" height="30.002" viewBox="0 0 155.964 30.002">
+  <defs>
+    <linearGradient id="linear-gradient" x1="0.5" x2="0.5" y2="1" gradientUnits="objectBoundingBox">
+      <stop offset="0" stop-color="#d0002b"/>
+      <stop offset="1" stop-color="#ea4a6b"/>
+    </linearGradient>
+  </defs>
+  <g id="Group_4626" data-name="Group 4626" transform="translate(-136.164 -24.999)">
+    <text id="PEOPLEX" transform="translate(186.127 47.5)" font-size="22" font-family="Nexa-XBold, Nexa" font-weight="700"><tspan x="0" y="0">PEOPLEX</tspan></text>
+    <path id="Union_42" data-name="Union 42" d="M-1723.591-7464l-4.718-6.494-.884,1.217,3.8,5.2-.1.072h-17.139l0,0,3.84-5.284-.875-1.206-4.717,6.494H-1754l0,0,4.8-6.611,0,0,9.494-13.066.047.064h0l5.664,7.765,5.7-7.765h0l.029-.04,14.226,19.582-.1.072Zm-8.653-26.22a3.782,3.782,0,0,1,3.78-3.782,3.784,3.784,0,0,1,3.782,3.782,3.784,3.784,0,0,1-3.782,3.782A3.782,3.782,0,0,1-1732.245-7490.219Zm-11.241,0a3.782,3.782,0,0,1,3.78-3.782,3.783,3.783,0,0,1,3.782,3.782,3.783,3.783,0,0,1-3.782,3.782A3.782,3.782,0,0,1-1743.486-7490.219Z" transform="translate(1890.163 7519)" fill="url(#linear-gradient)"/>
+  </g>
+</svg>

package/src/components/Layout/Header/assets/squarex.svg

@@ -0,0 +1,12 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="226.128" height="30" viewBox="0 0 226.128 30">
+  <defs>
+    <linearGradient id="linear-gradient" x1="0.5" x2="0.5" y2="1" gradientUnits="objectBoundingBox">
+      <stop offset="0" stop-color="#596e79"/>
+      <stop offset="1" stop-color="#7c909b"/>
+    </linearGradient>
+  </defs>
+  <g id="Group_4626" data-name="Group 4626" transform="translate(-148 -25)">
+    <text id="CAMPX_SQUARE" data-name="CAMPX SQUARE" transform="translate(190.127 47.5)" font-size="22" font-family="Nexa-XBold, Nexa" font-weight="700"><tspan x="0" y="0">CAMPX SQUARE</tspan></text>
+    <path id="Subtraction_57" data-name="Subtraction 57" d="M-5680.2,8259.99h-11.3v-11.343h5.625v5.718h5.672v5.625Zm18.7,0h-11.3v-5.625h5.671v-5.718h5.625v11.343Zm0-18.749h-5.625v-5.626h-5.671v-5.625h11.3v11.251Zm-24.375,0h-5.625V8229.99h11.3v5.625h-5.672v5.626Z" transform="translate(5839.5 -8204.99)" fill="url(#linear-gradient)"/>
+  </g>
+</svg>

package/src/components/Layout/Header/icons.tsx

@@ -0,0 +1,57 @@
+export const AppsIcon = () => {
+  return (
+    <svg
+      id="apps"
+      xmlns="http://www.w3.org/2000/svg"
+      width="22"
+      height="22"
+      viewBox="0 0 24 24"
+    >
+      <path
+        id="Path_15109"
+        data-name="Path 15109"
+        d="M7,0H4A4,4,0,0,0,0,4V7a4,4,0,0,0,4,4H7a4,4,0,0,0,4-4V4A4,4,0,0,0,7,0ZM9,7A2,2,0,0,1,7,9H4A2,2,0,0,1,2,7V4A2,2,0,0,1,4,2H7A2,2,0,0,1,9,4Z"
+        fill="#d4483e"
+      />
+      <path
+        id="Path_15110"
+        data-name="Path 15110"
+        d="M20,0H17a4,4,0,0,0-4,4V7a4,4,0,0,0,4,4h3a4,4,0,0,0,4-4V4A4,4,0,0,0,20,0Zm2,7a2,2,0,0,1-2,2H17a2,2,0,0,1-2-2V4a2,2,0,0,1,2-2h3a2,2,0,0,1,2,2Z"
+        fill="#f8d759"
+      />
+      <path
+        id="Path_15111"
+        data-name="Path 15111"
+        d="M7,13H4a4,4,0,0,0-4,4v3a4,4,0,0,0,4,4H7a4,4,0,0,0,4-4V17A4,4,0,0,0,7,13Zm2,7a2,2,0,0,1-2,2H4a2,2,0,0,1-2-2V17a2,2,0,0,1,2-2H7a2,2,0,0,1,2,2Z"
+        fill="#88b053"
+      />
+      <path
+        id="Path_15112"
+        data-name="Path 15112"
+        d="M20,13H17a4,4,0,0,0-4,4v3a4,4,0,0,0,4,4h3a4,4,0,0,0,4-4V17A4,4,0,0,0,20,13Zm2,7a2,2,0,0,1-2,2H17a2,2,0,0,1-2-2V17a2,2,0,0,1,2-2h3a2,2,0,0,1,2,2Z"
+        fill="#4baabe"
+      />
+    </svg>
+  )
+}
+
+export const NotificationIcon = () => {
+  return (
+    <>
+      <svg
+        xmlns="http://www.w3.org/2000/svg"
+        width="18.125"
+        height="20"
+        viewBox="0 0 18.125 20"
+      >
+        <path
+          id="bell_10_"
+          data-name="bell (10)"
+          d="M18.958,11.384l-1.583-5.7a7.767,7.767,0,0,0-15.064.395L1.085,11.595a4.166,4.166,0,0,0,4.067,5.07H6.08a4.166,4.166,0,0,0,8.166,0h.7a4.166,4.166,0,0,0,4.015-5.281Zm-8.795,6.948a2.5,2.5,0,0,1-2.346-1.666H12.51A2.5,2.5,0,0,1,10.163,18.332Zm6.771-4.32A2.481,2.481,0,0,1,14.944,15H5.152a2.5,2.5,0,0,1-2.44-3.042L3.937,6.444a6.1,6.1,0,0,1,11.832-.31l1.583,5.7a2.481,2.481,0,0,1-.418,2.181Z"
+          transform="translate(-0.986 -0.002)"
+          fill="#121212"
+        />
+      </svg>
+    </>
+  )
+}

package/src/components/Layout/Header/index.tsx

@@ -0,0 +1 @@
+export { default } from './AppHeader'

package/src/components/Layout/Header/styles.tsx

@@ -0,0 +1,133 @@
+import {
+  alpha,
+  AppBar,
+  Box,
+  IconButton,
+  ListItemText,
+  styled,
+  Typography,
+  Link,
+  Avatar,
+} from '@mui/material'
+import { Link as RouterLink } from 'react-router-dom'
+
+export const StyledImageWrapper = styled('div')`
+  width: auto;
+  height: 24px;
+  & img {
+    width: 100%;
+    height: 100%;
+    object-fit: contain;
+  }
+`
+
+export const StyledItemText = styled(ListItemText)(({ theme }) => ({
+  color: theme.palette.text.primary,
+  transition: '0.2s ease',
+}))
+
+export const StyledAppBar = styled(AppBar)(({ theme }) => ({
+  backgroundColor: 'white',
+  boxShadow: '0px 8px 28px rgb(136,136,136, 0.3)',
+}))
+
+export const StyledHeader = styled(Box)(({ theme }) => ({
+  boxShadow: '0px 2px 10px #0000001a',
+  backgroundColor: 'white',
+  display: 'flex',
+  alignItems: 'center',
+  justifyContent: 'space-between',
+  '& .actions': {
+    marginRight: '20px',
+    display: 'flex',
+    alignItems: 'center',
+    gap: '14px',
+  },
+}))
+
+export const StyledUser = styled(Box)(({ theme }) => ({
+  cursor: 'pointer',
+  borderRadius: '5px',
+  transition: 'background 0.2s ease',
+  padding: '5px 16px',
+  display: 'flex',
+  alignItems: 'center',
+  gap: '8px',
+  '&:hover': {
+    background: theme.palette.secondary.light,
+  },
+}))
+
+export const StyledIconButton = styled(IconButton)({
+  padding: '20px',
+  backgroundColor: 'black',
+  display: 'flex',
+  alignItems: 'center',
+  justifyContent: 'center',
+  borderRadius: '0px',
+  border: '1px solid white',
+})
+
+export const StyledLink = styled(Link)({
+  textDecoration: 'none',
+})
+
+export const StyledDescription = styled(Typography)(({ theme }) => ({
+  fontSize: '12px',
+  fontWeight: 600,
+  color: alpha(theme?.palette?.secondary?.lighter, 0.5),
+}))
+
+export const StyledMenuItem = styled(Box)({
+  height: '68px',
+  width: '380px',
+  padding: '40px 20px',
+  transition: 'background ease 0.3s',
+  '&:hover': {
+    background: 'rgba(0, 0, 0, 0.03)',
+  },
+  display: 'flex',
+  alignItems: 'center',
+  gap: '20px',
+})
+
+export const StyledMenuItemContainer = styled(Box)(({ theme }) => ({
+  cursor: 'pointer',
+
+  padding: '8px 0px',
+
+  borderBottom: `1px solid ${theme?.palette?.secondary?.lighter}`,
+}))
+
+export const StyledAvatar = styled(Avatar)(({ theme }) => ({
+  background: theme.palette.secondary.main,
+  cursor: 'pointer',
+  height: '45px',
+  width: '45px',
+}))
+
+export const StyledLogosWrapper = styled(Box)(() => ({
+  display: 'flex',
+  alignItems: 'center',
+  gap: '10px',
+  padding: '10px',
+  transition: 'background ease 0.3s',
+  borderRadius: '5px',
+  '&:hover': {
+    background: 'rgba(0, 0, 0, 0.05)',
+  },
+}))
+
+export const StyledImageBox = styled(Box)(() => ({
+  height: '40px',
+  width: '40px',
+  boxShadow: '0px 5px 5px 0px rgba(48, 62, 99,0.1) ',
+  display: 'flex',
+  alignItems: 'center',
+  justifyContent: 'center',
+  borderRadius: '5px',
+}))
+
+export const StyledRouterLink = styled(RouterLink)(() => ({
+  textDecoration: 'none',
+}))

package/src/components/Layout/Helmet.tsx

@@ -0,0 +1,49 @@
+import { Helmet as ReactHelmet } from 'react-helmet'
+
+type MetaProps = JSX.IntrinsicElements['meta']
+type LinkProps = JSX.IntrinsicElements['link']
+
+interface IHelmetProps {
+  appTitle: string
+  favicon: string
+  description?: string
+  meta?: MetaProps[] | undefined
+  link?: LinkProps[] | undefined
+}
+
+export default function Helmet({
+  appTitle,
+  favicon,
+  description,
+  meta = [],
+  link = [],
+}: IHelmetProps) {
+  return (
+    <ReactHelmet
+      htmlAttributes={{ lang: 'en' }}
+      title={appTitle}
+      meta={[
+        {
+          charSet: 'utf-8',
+        },
+        {
+          name: 'description',
+          content: description,
+        },
+        {
+          name: 'viewport',
+          content: 'width=device-width, initial-scale=1',
+        },
+        ...meta,
+      ]}
+      link={[
+        { rel: 'icon', href: favicon },
+        {
+          rel: 'apple-touch-icon',
+          href: favicon,
+        },
+        ...link,
+      ]}
+    />
+  )
+}

package/src/components/Layout/LayoutWrapper.tsx

@@ -0,0 +1,28 @@
+import {
+  StyledLeftNavContainer,
+  StyledMainContentContainer,
+} from '../../layouts/Components/styles'
+import ErrorBoundary from '../ErrorBoundary'
+import SideNav from './SideNav'
+interface Props {
+  children?: React.ReactNode
+  menu: any[]
+  sideMenuHeader?: React.ReactNode
+}
+
+export default function LayoutWrapper({
+  children,
+  menu,
+  sideMenuHeader,
+}: Props) {
+  return (
+    <ErrorBoundary>
+      <StyledLeftNavContainer>
+        <SideNav menuItems={menu as any[]} header={sideMenuHeader} />
+      </StyledLeftNavContainer>
+      <StyledMainContentContainer>
+        <ErrorBoundary>{children}</ErrorBoundary>
+      </StyledMainContentContainer>
+    </ErrorBoundary>
+  )
+}

package/src/components/Layout/SideMenuHeader.tsx

@@ -0,0 +1,29 @@
+import { KeyboardBackspace } from '@mui/icons-material'
+import { Box, styled as styledMui, Typography } from '@mui/material'
+import { useNavigate } from 'react-router-dom'
+
+const StyledSideMenuHeader = styledMui(Box)(({ theme }) => ({
+  height: '60px',
+  display: 'flex',
+  gap: '8px',
+  alignItems: 'center',
+  cursor: 'pointer',
+  background: '#1d1d1d',
+}))
+
+export const SideMenuHeader = ({ title, path }) => {
+  const navigate = useNavigate()
+
+  return (
+    <StyledSideMenuHeader
+      onClick={() => {
+        navigate(path)
+      }}
+    >
+      <KeyboardBackspace />
+      <Typography variant="h3" color={'white'}>
+        {title}
+      </Typography>
+    </StyledSideMenuHeader>
+  )
+}