Skip to content

Commit

Permalink
Merge branch 'main' into page/aaronchan32/overview-page
Browse files Browse the repository at this point in the history
  • Loading branch information
@aaronchan32
aaronchan32 authored Jun 2, 2024
2 parents 51d42af + cb028c0 commit 79971c4
Show file tree
Hide file tree
Showing 21 changed files with 822 additions and 71 deletions.
20 changes: 20 additions & 0 deletions src/app/components/ApplyNow/ApplyNow.scss
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
.apply-now-svg {
align-self: flex-end;
margin-inline: auto;
opacity: 0;
font-size: $p-font;
display: flex;

.mask {
fill: none;
stroke: #fff;
stroke-dasharray: 0;
stroke-dashoffset: 0;
}

@keyframes dash {
to {
stroke-dashoffset: 0;
}
}
}
59 changes: 59 additions & 0 deletions src/app/components/ApplyNow/ApplyNow.tsx
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,59 @@
import { RefObject } from 'react';
import './ApplyNow.scss';
import ApplyNowSVG from './ApplyNowSVG';
// Credit to: https://css-tricks.com/how-to-get-handwriting-animation-with-irregular-svg-strokes/

type ApplyNowTypes = {
applySVGRef: RefObject<SVGSVGElement>;
};

export default function ApplyNow({ applySVGRef }: ApplyNowTypes) {
return (
<>
{/* prettier-ignore */}
<svg className='apply-now-svg' ref={applySVGRef} viewBox='0 0 230 60' fill="none" xmlns="http://www.w3.org/2000/svg">
<title>Apply Now!</title>
<defs>
<mask id="apply-masks" >
<g id="apply-mask-A">
<path className='mask' d="M3 50.5L8 31L12.5 15.5" stroke="black" strokeWidth="5"/>
<path className='mask' d="M13 16L27 47" stroke="black" strokeWidth="5"/>
<path className='mask' d="M6 37L25.5 32.5" stroke="black" strokeWidth="5"/>
</g>
<g id="apply-mask-p-1">
<path className='mask' d="M37 26.5L39.5 41L41 54" stroke="black" strokeWidth="5"/>
<path className='mask' d="M27.5 27.5L39 22L46 23L48 27L47 32.5L43 36L35 41.5" stroke="black" strokeWidth="5"/>
</g>
<g id="apply-mask-p-2">
<path className='mask' d="M60.5 25.5L63 40L64.5 53" stroke="black" strokeWidth="5"/>
<path className='mask' d="M51 26.5L62.5 21L69.5 22L71.5 26L70.5 31.5L66.5 35L58.5 40.5" stroke="black" strokeWidth="5"/>
</g>
<g id="apply-mask-l">
<path className='mask' d="M80 12L84 45" stroke="black" strokeWidth="5"/>
</g>
<g id="apply-mask-y">
<path className='mask' d="M90.5 25L97 38L104.5 32.5L108 20.5" stroke="black" strokeWidth="5"/>
<path className='mask' d="M108 23V46L103.5 54L97.5 59" stroke="black" strokeWidth="5"/>
</g>
<g id="apply-mask-n">
<path className='mask' d="M135 16.5L136 40" stroke="black" strokeWidth="5"/>
<path className='mask' d="M134.5 19L154 38" stroke="black" strokeWidth="5"/>
<path className='mask' d="M153 37L154 12.5" stroke="black" strokeWidth="5"/>
</g>
<g id="apply-mask-o">
<path className='mask' d="M172 19L167.5 18.5L164 23L163.5 27.5L164.5 34L169.5 37L176 34L179.5 27.5L177 20L172 19Z" stroke="black" strokeWidth="5"/>
</g>
<g id="apply-mask-w">
<path className='mask' d="M186 17.5L192.5 35.5L200 20.5L206.5 36L215 14.5" stroke="black" strokeWidth="5"/>
</g>
<g id="apply-mask-exclamation">
<path className='mask' d="M228 0.5L225.5 13.5V27" stroke="black" strokeWidth="5"/>
<path className='mask' d="M227 35L226 42.5" stroke="black" strokeWidth="5"/>
</g>
</mask>
</defs>
<ApplyNowSVG />
</svg>
</>
);
}
9 changes: 9 additions & 0 deletions src/app/components/ApplyNow/ApplyNowSVG.tsx
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,9 @@
export default function ApplyNowSVG() {
return (
<path
mask="url(#apply-masks)"
d="M5.988 47.45a8.866 8.866 0 0 1-.697 1.945c-.3.55-.63.875-.995.976-.767.245-1.367.154-1.8-.275-.433-.429-.627-.993-.582-1.693.197-2.473.592-5.08 1.185-7.82a99.282 99.282 0 0 1 2.146-8.3c.836-2.795 1.76-5.49 2.772-8.088 1.05-2.641 2.134-5.037 3.25-7.19.188-.337.403-.533.647-.587.282-.097.528-.11.737-.039.196-.174.434-.33.714-.468.28-.138.563-.214.85-.23.122-.006.246.008.371.043.166.032.336.146.51.342.175.196.376.494.602.892.265.356.581.893.948 1.613a125.618 125.618 0 0 0 2.307 6.344c.895 2.17 1.81 4.338 2.746 6.505a1.01 1.01 0 0 1 .304-.078l.362-.142c.448-.064.96-.07 1.538-.019.578.052.982.318 1.212.799.279.6.266 1.135-.038 1.602-.303.468-.873.95-1.709 1.444a373.305 373.305 0 0 0 1.802 3.785 97.886 97.886 0 0 0 1.85 3.535c.052.203.13.527.236.973.104.405.168.832.192 1.283a3.67 3.67 0 0 1 0 1.17c-.062.372-.213.626-.452.762-.28.138-.588.133-.924-.013a5.61 5.61 0 0 1-.892-.569 15.356 15.356 0 0 1-.844-.818c-.222-.316-.401-.594-.537-.834a187.557 187.557 0 0 1-2.241-3.945c-.688-1.36-1.355-2.72-2.002-4.082-1.702.417-3.57.803-5.603 1.155-1.993.351-3.97.619-5.93.804a665.483 665.483 0 0 1-1.106 4.675 143.42 143.42 0 0 0-.929 4.543Zm7.35-26.243a134.186 134.186 0 0 0-4.24 12.905c2.737-.226 5.646-.727 8.724-1.504a113.633 113.633 0 0 1-4.484-11.401ZM42.317 52.196c-.017.452-.2.872-.549 1.26-.346.428-.746.634-1.198.617-.698-.005-1.245-.243-1.639-.715-.395-.472-.6-.871-.618-1.199a99.774 99.774 0 0 0-.38-4.844c-.173-1.715-.369-3.47-.587-5.264a2.946 2.946 0 0 1-1.48-.045 1.721 1.721 0 0 1-.909-.876c-.323-.68-.315-1.297.025-1.848.34-.552.907-1.095 1.7-1.629-.286-1.503-.57-2.987-.853-4.45a122.798 122.798 0 0 0-.78-4.268 1.24 1.24 0 0 1 .025-.679c.071-.209.164-.398.278-.568.112-.211.327-.407.646-.588.521-.233 1.123-.1 1.806.397a3.921 3.921 0 0 1 1.52 1.953c.164.77.335 1.665.512 2.682.216.973.417 2.05.602 3.231.832-.577 1.6-1.192 2.304-1.844a11.156 11.156 0 0 0 1.86-2.068c.536-.726.928-1.465 1.176-2.216a4.777 4.777 0 0 0 .118-2.408c-.119-.691-.458-1.29-1.019-1.794-.562-.545-1.418-.808-2.566-.789a12.975 12.975 0 0 0-3.057.407c-.971.256-1.94.574-2.905.953-.924.376-1.844.815-2.762 1.314-.877.498-1.733.994-2.568 1.49-.556.357-1.121.53-1.697.52-.536-.055-.895-.241-1.076-.56-.412-.8-.43-1.537-.056-2.214.415-.678 1.058-1.328 1.928-1.948.754-.49 1.651-.99 2.692-1.495a24.496 24.496 0 0 1 3.373-1.408 19.598 19.598 0 0 1 3.645-.93c1.26-.23 2.468-.273 3.625-.129 1.155.104 2.199.44 3.132 1.006.972.524 1.775 1.344 2.409 2.46.795 1.846 1.072 3.576.83 5.19a10.568 10.568 0 0 1-1.614 4.394c-.834 1.316-1.897 2.541-3.192 3.676a41.028 41.028 0 0 1-3.844 2.972c.322 2.2.582 4.382.779 6.547.197 2.165.318 4.067.364 5.707ZM65.761 50.967c-.017.452-.2.872-.549 1.26-.346.429-.746.634-1.198.617-.698-.005-1.244-.243-1.639-.715-.394-.471-.6-.871-.618-1.198a99.77 99.77 0 0 0-.38-4.844c-.173-1.715-.369-3.47-.587-5.264a2.947 2.947 0 0 1-1.48-.046 1.721 1.721 0 0 1-.909-.876c-.323-.68-.315-1.297.025-1.848.34-.551.907-1.094 1.7-1.628-.286-1.504-.57-2.987-.853-4.45a122.792 122.792 0 0 0-.78-4.269 1.24 1.24 0 0 1 .025-.678c.071-.21.164-.399.278-.57.112-.21.327-.406.646-.587.521-.233 1.123-.1 1.807.398a3.922 3.922 0 0 1 1.52 1.952c.163.771.334 1.665.511 2.682.216.974.417 2.05.603 3.232a21.01 21.01 0 0 0 2.303-1.845 11.148 11.148 0 0 0 1.86-2.068c.536-.726.928-1.464 1.176-2.216a4.777 4.777 0 0 0 .118-2.407c-.119-.692-.458-1.29-1.019-1.794-.562-.545-1.418-.808-2.566-.79a12.98 12.98 0 0 0-3.057.407c-.971.256-1.94.574-2.904.953-.924.377-1.845.815-2.763 1.314-.877.498-1.733.994-2.568 1.49-.556.357-1.121.53-1.697.52-.536-.055-.895-.241-1.076-.56-.412-.8-.43-1.537-.056-2.213.416-.679 1.058-1.328 1.928-1.948.754-.491 1.651-.99 2.692-1.496a24.504 24.504 0 0 1 3.373-1.408 19.596 19.596 0 0 1 3.645-.93c1.26-.23 2.468-.273 3.625-.128 1.155.103 2.2.439 3.132 1.005.972.524 1.775 1.344 2.409 2.46.796 1.846 1.072 3.576.83 5.19a10.569 10.569 0 0 1-1.614 4.394c-.834 1.316-1.897 2.541-3.191 3.677a41.058 41.058 0 0 1-3.845 2.972c.322 2.199.582 4.381.779 6.546.197 2.165.318 4.068.364 5.707ZM82.045 14.59c.441 4.45 1.034 9.057 1.78 13.82a487.358 487.358 0 0 0 2.32 13.547c.218 1.794-.224 2.74-1.327 2.84a1.323 1.323 0 0 1-.75-.207 3.914 3.914 0 0 1-.714-.702c-.22-.276-.441-.572-.663-.889-.181-.318-.299-.6-.353-.843a201.15 201.15 0 0 1-1.273-6.582c-.41-2.319-.8-4.638-1.17-6.958-.33-2.363-.637-4.666-.92-6.909a123.045 123.045 0 0 1-.637-6.184c.03-.987.13-1.813.3-2.479.167-.706.58-1.056 1.237-1.05.698.005 1.204.265 1.52.783.353.474.57 1.078.65 1.812ZM109.251 22.583c.24 2.204.481 4.429.723 6.673.283 2.243.443 4.471.478 6.686a47.065 47.065 0 0 1-.336 6.42 25.348 25.348 0 0 1-1.4 6.107 21.162 21.162 0 0 1-3.035 5.454c-1.264 1.708-2.905 3.272-4.923 4.691a2.537 2.537 0 0 1-1.086.427c-.366.06-.735.059-1.108-.004a2.522 2.522 0 0 1-.999-.255c-.293-.108-.487-.283-.582-.524-.142-.362-.102-.775.12-1.238.221-.463.605-.955 1.152-1.476 1.73-1.445 3.168-2.957 4.316-4.536a20.092 20.092 0 0 0 2.686-5.066c.643-1.799 1.013-3.727 1.109-5.784.135-2.1.014-4.372-.362-6.815-.458.64-.998 1.304-1.618 1.993-.62.69-1.284 1.32-1.993 1.89-.71.53-1.445 1-2.203 1.409-.76.368-1.489.57-2.184.607a4.34 4.34 0 0 1-1.739-.279c-.586-.215-1.184-.656-1.794-1.322a18.152 18.152 0 0 1-1.934-2.792 47.614 47.614 0 0 1-1.459-3.125 54.625 54.625 0 0 1-1.067-2.715c-.249-.807-.402-1.374-.46-1.7a2.803 2.803 0 0 1-.062-1.166c.062-.373.317-.611.762-.717.608-.155 1.183-.144 1.726.033.543.177.929.485 1.157.924.188.442.45 1.126.787 2.052.336.927.734 1.85 1.193 2.77.457.879.93 1.654 1.417 2.327.528.67 1.058.99 1.59.963.614-.032 1.314-.377 2.1-1.034.827-.659 1.603-1.5 2.329-2.523a15.28 15.28 0 0 0 1.792-3.357c.508-1.258.731-2.46.671-3.606a3.586 3.586 0 0 1 .077-.866c.064-.332.171-.645.319-.94a3.08 3.08 0 0 1 .51-.827c.233-.259.471-.415.714-.469a2.061 2.061 0 0 1 1.749.463c.554.381.843.797.867 1.247ZM155.639 14.365a362.106 362.106 0 0 1-.477 10.738c-.177 3.62-.508 7.045-.994 10.272-.122.786-.318 1.35-.587 1.693-.269.342-.667.589-1.192.74-.446.105-1.088-.005-1.926-.33a5.308 5.308 0 0 1-2.05-1.494l-2.434-2.95a47.065 47.065 0 0 0-2.762-3.303 56.819 56.819 0 0 0-3.071-3.349 33.086 33.086 0 0 0-3.301-3.028c.021 2.707.061 5.394.12 8.059.057 2.623.197 5.263.42 7.92.02.368-.298.57-.953.604-.777.04-1.432-.315-1.965-1.067-.535-.793-.865-1.596-.99-2.41-.166-.813-.289-1.976-.37-3.49a201.537 201.537 0 0 1-.196-4.854 1383.39 1383.39 0 0 1-.012-4.863c0-1.56.016-2.792.05-3.697.03-.987.217-1.715.562-2.184.385-.472.763-.697 1.134-.675.823.038 1.368.256 1.635.653.306.353.495.815.566 1.386a33.302 33.302 0 0 1 4.235 3.226 41.484 41.484 0 0 1 3.637 3.565 46.694 46.694 0 0 1 3.088 3.655c.966 1.18 1.864 2.263 2.696 3.245.361-2.482.605-5.244.73-8.288.167-3.046.326-6.235.478-9.568-.063-.407.162-.809.674-1.205.511-.437.992-.647 1.445-.63 1.15.022 1.754.565 1.81 1.629ZM174.68 17.061c1.252.386 2.311 1.008 3.177 1.865a9.381 9.381 0 0 1 2.128 2.967 9.947 9.947 0 0 1 .919 3.4c.145 1.182.081 2.294-.192 3.334a20.195 20.195 0 0 1-1.54 3.467 15.373 15.373 0 0 1-2.238 3.073 11.315 11.315 0 0 1-2.959 2.248c-1.118.592-2.373.925-3.764.998-1.679.088-3.111-.227-4.299-.945a8.325 8.325 0 0 1-2.861-2.867c-.72-1.193-1.224-2.562-1.511-4.107a17.864 17.864 0 0 1-.125-4.672c.103-1.155.31-2.274.622-3.358.351-1.126.812-2.115 1.382-2.966.568-.892 1.227-1.624 1.977-2.197.79-.575 1.697-.889 2.72-.943.573-.03 1.296.056 2.169.256.87.16 1.685.425 2.443.796.506-.52 1.157-.636 1.952-.349Zm-2.095 4.604a29.989 29.989 0 0 1-1.655-1.021c-.599-.461-1.124-.68-1.574-.656-.491.025-.971.276-1.438.752a8.258 8.258 0 0 0-1.143 1.66c-.297.59-.552 1.2-.765 1.826-.213.627-.351 1.127-.413 1.5-.09.62-.133 1.361-.129 2.223.005.861.112 1.718.322 2.569.207.81.554 1.55 1.041 2.223.526.63 1.267 1.062 2.224 1.3.582.133 1.257.098 2.026-.107a7.568 7.568 0 0 0 2.217-1.162c.751-.532 1.433-1.225 2.044-2.078a8.714 8.714 0 0 0 1.447-2.908c.346-1.208.281-2.436-.196-3.683-.438-1.29-1.266-2.192-2.483-2.702-.276.22-.557.337-.843.352-.287.015-.514-.014-.682-.088ZM208.302 35.37c-.304.467-.656.794-1.056.979a3.89 3.89 0 0 1-1.096.242 3.262 3.262 0 0 1-1.626-.47c-.51-.342-.837-.694-.979-1.056-.283-.683-.59-1.447-.922-2.291l-.997-2.534a38.21 38.21 0 0 0-.935-2.537c-.332-.844-.639-1.608-.922-2.29a89.17 89.17 0 0 0-2.101 4.48 103.24 103.24 0 0 1-2.219 4.611c-.376.636-.824 1.09-1.343 1.364-.521.232-.967.338-1.338.316-.534-.013-1.036-.192-1.506-.537a7.5 7.5 0 0 1-1.038-.992c-.489-.713-.989-1.631-1.501-2.753a77.028 77.028 0 0 1-1.484-3.617c-.438-1.29-.855-2.561-1.25-3.813a76.501 76.501 0 0 1-.984-3.458 5.307 5.307 0 0 1-.104-1.964c.131-.623.481-.99 1.05-1.102.694-.077 1.341.135 1.942.637.6.461.953.935 1.061 1.422.207.81.439 1.7.696 2.672.296.93.592 1.878.89 2.848.339.967.656 1.915.951 2.843.337.927.668 1.75.994 2.473a123.539 123.539 0 0 0 1.846-3.483c.709-1.351 1.379-2.638 2.012-3.861a74.32 74.32 0 0 1 1.734-3.293c.525-.93.946-1.506 1.263-1.728.236-.177.585-.175 1.047.006.459.14.799.369 1.021.686.996 1.753 1.838 3.7 2.527 5.84.727 2.095 1.425 4.05 2.096 5.861.534-.766 1.097-1.76 1.689-2.982a67.767 67.767 0 0 0 1.698-3.967 85.627 85.627 0 0 0 1.504-4.143 50.513 50.513 0 0 0 1.097-3.69c.269-1.122.691-1.678 1.266-1.667.741.043 1.389.256 1.943.637.554.382.781.8.682 1.257-.709 3.65-1.7 7.026-2.972 10.13a59.94 59.94 0 0 1-4.636 8.924ZM229.408 3.419c-.272 1.82-.567 3.62-.883 5.402-.275 1.78-.529 3.558-.763 5.335a58.782 58.782 0 0 0-.457 5.319 32.6 32.6 0 0 0 .219 5.283c.106.446.047.88-.177 1.302-.183.42-.414.7-.694.837-.883.375-1.55.184-2.001-.572a29.613 29.613 0 0 1-1.127-6.16 42.934 42.934 0 0 1 .107-6.1c.221-2.023.525-4.03.912-6.02.425-2.034.852-4.047 1.28-6.04.161-.829.465-1.296.911-1.401a2.302 2.302 0 0 1 1.296.055c.624.172 1.035.561 1.231 1.167.197.605.245 1.136.146 1.593Zm-.702 33.16c.024.45-.005 1.067-.086 1.851a8.65 8.65 0 0 1-.381 2.113c-.17.666-.449 1.214-.836 1.645-.347.428-.813.535-1.399.32-.339-.188-.687-.56-1.045-1.116-.357-.556-.529-1.08-.514-1.573.03-.987.183-1.96.461-2.918.277-.959.677-1.554 1.198-1.787.241-.095.507-.108.798-.042.332.065.626.193.882.385.255.15.47.345.647.582.175.196.266.376.275.54Z"
fill="#B80042"
/>
);
}
20 changes: 20 additions & 0 deletions src/app/components/FutureUpgrader/FutureUpgrader.scss
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
.future-upgrader-svg {
align-self: flex-end;
margin-inline: auto;
opacity: 0;
font-size: $p-font;
display: flex;

.mask {
fill: none;
stroke: #fff;
stroke-dasharray: 0;
stroke-dashoffset: 0;
}

@keyframes dash {
to {
stroke-dashoffset: 0;
}
}
}
77 changes: 77 additions & 0 deletions src/app/components/FutureUpgrader/FutureUpgrader.tsx
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,77 @@
import { RefObject } from 'react';
import './FutureUpgrader.scss';
import FutureUpgraderSVG from './FutureUpgraderSVG';
// Credit to: https://css-tricks.com/how-to-get-handwriting-animation-with-irregular-svg-strokes/

type FutureUpgraderTypes = {
futureSVGRef: RefObject<SVGSVGElement>;
};

export default function FutureUpgrader({ futureSVGRef }: FutureUpgraderTypes) {
return (
<>
{/* prettier-ignore */}
<svg className='future-upgrader-svg' ref={futureSVGRef} width="219" height="87" viewBox="0 0 219 87" fill="none" xmlns="http://www.w3.org/2000/svg">
<title>Future Upgrader</title>
<defs>
<mask id="future-masks">
{/* Future */}
<g id="future-mask-F">
<path className='mask' d="M7 14L12 39" stroke="black" strokeWidth="5"/>
<path className='mask' d="M0 13.5H22.5" stroke="black" strokeWidth="5"/>
<path className='mask' d="M8.5 26.5L24.5 24.5" stroke="black" strokeWidth="5"/>
</g>
<g id="future-mask-u1">
<path className='mask' d="M30.5 18L29.5 31L32 37.5L36.5 35.5L40.5 29L43.5 21L47.5 40" stroke="black" strokeWidth="5"/>
</g>
<g id="future-mask-t">
<path className='mask' d="M50.5 26L70 23.5" stroke="black" strokeWidth="5"/>
<path className='mask' d="M60 10V40.5L68.5 36L75.5 31" stroke="black" strokeWidth="5"/>
</g>
<g id="future-mask-u2">
<path className="mask" d="M80.5619 16.3324L80.0883 29.3622L82.849 35.7558L87 33L90.9984 26.9192L93.6726 18.8044L98 38" stroke="black" strokeWidth="5"/>
</g>
<g id="future-mask-r1">
<path className='mask' d="M103 13.5L109 35.5L109.5 24.5L113 17L121.5 11.5" stroke="black" strokeWidth="5"/>
</g>
<g id="future-mask-e1">
<path className='mask' d="M126 23L140 17.5L136.5 14.5L130.5 13.5L125.5 20L127 26.5L133 30.5L144 26" stroke="black" strokeWidth="5"/>
</g>
{/* Upgrader */}
<g id="future-mask-U">
<path className='mask' d="M10 60.5L7.5 78.5L12 81L17.5 80.5L25.5 74.5L24 58.5" stroke="black" strokeWidth="5"/>
</g>
<g id="future-mask-p">
<path className='mask' d="M38.5 57.5L41 72V85" stroke="black" strokeWidth="5"/>
<path className='mask' d="M28.5 57.8533L39 52.5L49.2577 53.7731L51.0886 57.8533L49.8594 63.3066L45.7164 66.6362L37.4999 74" stroke="black" strokeWidth="5"/>
</g>
<g id="future-mask-dash">
<path className='mask' d="M57 69.5L75.5 67" stroke="black" strokeWidth="5"/>
</g>
<g id="future-mask-g">
<path className='mask' d="M96.5 52L91 50L86 53.5L81 64V70.5L87.5 72.5L98 69V63L100.5 79.5" stroke="black" strokeWidth="5"/>
<path className='mask' d="M87 62.5L108 60" stroke="black" strokeWidth="5"/>
</g>
<g id="future-mask-r2">
<path className='mask' d="M111 56L117 78L117.5 67L121 59.5L129.5 54" stroke="black" strokeWidth="5"/>
</g>
<g id="future-mask-a">
<path className='mask' d="M132 60.5L141 52.5L146 54L147 73L139 77L135 74.5L136.5 68.5L141.5 65.5L152.5 73" stroke="black" strokeWidth="5"/>
</g>
<g id="future-mask-d">
<path className='mask' d="M165.5 41.5L173 75" stroke="black" strokeWidth="5"/>
<path className='mask' d="M167 56.5L158.5 60.5L156.5 68.5L163 72.5L172.5 71" stroke="black" strokeWidth="5"/>
</g>
<g id="future-mask-e2">
<path className='mask' d="M178.5 63.5L192.5 58L189 55L183 54L178 60.5L179.5 67L185.5 71L196 66" stroke="black" strokeWidth="5"/>
</g>
<g id="future-mask-r3">
<path className='mask' d="M199 51L204 73L205.5 62L208 55L217.5 49" stroke="black" strokeWidth="5"/>
</g>
</mask>
</defs>
<FutureUpgraderSVG />
</svg>
</>
);
}
9 changes: 9 additions & 0 deletions src/app/components/FutureUpgrader/FutureUpgraderSVG.tsx
View file

Large diffs are not rendered by default.

12 changes: 7 additions & 5 deletions src/app/components/Navbar/Hamburger/Hamburger.scss
View file
Original file line number Diff line number Diff line change
@@ -1,11 +1,12 @@
.hamburger {
$hamburger-height: 18px;
$hamburger-width: 30px;
$hamburger-height: 16px;
$hamburger-width: 25px;
$line-height: 4px;

position: absolute;
margin: $main-padding-mobile-block;
right: 0;
margin-block: $main-padding-mobile-block;
margin-inline: $main-padding-mobile-inline;
left: 0;
background: none;
outline-offset: 3px;
border: none;
Expand All @@ -18,7 +19,8 @@
z-index: 3;

@media (min-width: $mobile-breakpoint) {
margin: $main-padding-desktop-block;
margin-block: $main-padding-desktop-block;
margin-inline: $main-padding-desktop-inline;
}

.line {
Expand Down
Loading

0 comments on commit 79971c4

Please sign in to comment.