www
/
www-new
12
3
Fork 5
Code Issues 58 Pull Requests 42 Projects Releases Wiki Activity

Added custom 404 page #409

Closed
snedadah wants to merge 5 commits from 404page into main
pull from: 404page
merge into: www:main
Conversation 0 Commits 5 Files Changed 3 +84
3 changed files with 84 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

45
images/codey-404.svg Normal file
View File

@ -0,0 +1,45 @@
<svg width="480" height="416" viewBox="0 0 480 416" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M166.918 7.91559C166.918 7.91559 184.826 16.1016 193.668 24.6978C206.257 36.9356 215.094 64.2196 215.094 64.2196L149.959 80.0505C149.959 80.0505 146.445 51.6036 152.013 34.8221C155.795 23.421 166.918 7.91559 166.918 7.91559Z" fill="#5CAFF9"/>
<path d="M170.859 24.7429C170.859 24.7429 183.512 29.7276 189.681 35.1358C198.463 42.8351 204.303 60.3358 204.303 60.3358L157.482 71.7153C157.482 71.7153 155.467 53.3692 159.738 42.4133C162.64 34.97 170.859 24.7429 170.859 24.7429Z" fill="white"/>
<path d="M281.362 7.91559C281.362 7.91559 263.455 16.1016 254.612 24.6978C242.024 36.9356 233.186 64.2196 233.186 64.2196L298.322 80.0505C298.322 80.0505 301.836 51.6036 296.268 34.8221C292.485 23.421 281.362 7.91559 281.362 7.91559Z" fill="#5CAFF9"/>
<path d="M276.563 25.1122C276.563 25.1122 262.974 30.8878 256.307 37.0476C246.817 45.8169 240.331 65.5507 240.331 65.5507L290.192 77.6692C290.192 77.6692 292.603 57.04 288.195 44.7977C285.199 36.4804 276.563 25.1122 276.563 25.1122Z" fill="white"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M300.336 359.985C285.82 369.339 269.243 374.504 251.048 374.504C183.31 374.504 111.13 335.804 118.798 210.175C120.306 200.605 121.688 191.413 123.011 182.604C136.843 90.5749 144.371 40.4868 224.183 40.4868C290.203 40.4868 310.472 91.2457 331.248 143.276C337.699 159.43 344.198 175.707 352.131 190.626C399.105 207.947 423.715 244.388 423.715 287.576C423.715 343.447 378.468 358.072 300.336 359.985Z" fill="#5CAFF9"/>
<path d="M200.985 272.845L160.568 313.262C160.568 313.262 65.5689 212.419 65.6735 209.04C65.7782 205.66 86.2028 183.926 90.9341 183.779C93.5513 183.698 130.802 214.04 159.161 239.383C188.401 261.654 200.985 272.845 200.985 272.845Z" fill="#5CAFF9"/>
<mask id="mask0_5845_1072" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="117" y="40" width="307" height="335">
<path fill-rule="evenodd" clip-rule="evenodd" d="M299.78 359.985C285.264 369.339 268.687 374.504 250.492 374.504C182.753 374.504 110.573 335.804 118.241 210.175C119.749 200.605 121.131 191.413 122.455 182.604C136.286 90.5749 143.814 40.4868 223.626 40.4868C289.647 40.4868 309.915 91.2457 330.691 143.276C337.142 159.431 343.642 175.708 351.575 190.626C398.548 207.948 423.157 244.389 423.157 287.576C423.157 343.447 377.911 358.072 299.78 359.985Z" fill="#5CAFF9"/>
</mask>
<g mask="url(#mask0_5845_1072)">
<path d="M213.537 259.912C218.509 331.539 257.001 398.321 193.206 371.721C177.005 370.476 153.413 331.539 148.442 259.912C143.47 188.284 158.12 124.183 204.506 120.964C229.719 119.214 257.937 134.433 250.754 177.582C247.204 198.901 211.86 235.743 213.537 259.912Z" fill="white"/>
</g>
<ellipse cx="418.354" cy="223.273" rx="61.3259" ry="67.2798" fill="#5CAFF9"/>
<circle cx="256.407" cy="103.004" r="41.6778" stroke="#2A2A62" stroke-width="5.95397"/>
<path d="M195.08 116.102C195.08 116.102 202.286 114.316 206.988 114.316C211.69 114.316 218.896 116.102 218.896 116.102V123.247C218.896 123.247 211.662 122.056 206.988 122.056C202.314 122.056 195.08 123.247 195.08 123.247V116.102Z" fill="#2A2A62"/>
<path d="M359.365 261.668L424.858 291.438C424.858 291.438 426.049 320.017 409.973 342.046C393.898 364.076 368.296 370.625 368.296 370.625C368.296 370.625 283.932 397.672 281.344 396.282C278.755 394.891 263.863 369.058 264.172 364.956C264.342 362.686 286.154 341.061 308.16 326.566C312.328 261.668 359.365 261.668 359.365 261.668Z" fill="#5CAFF9"/>
<path d="M214.691 273.162L278.436 283.275C278.436 283.275 256.89 389.312 253.859 390.661C250.828 392.011 217.469 387.451 214.019 384.341C212.11 382.621 212.508 344.907 214.774 315.252C213.734 286.298 214.691 273.162 214.691 273.162Z" fill="#5CAFF9"/>
<path d="M237.353 153.017C239.14 159.567 220.871 170.082 205.68 166.895C190.489 163.708 180.092 151.979 182.459 140.697C184.826 129.416 199.059 122.854 214.251 126.041C221.278 129.201 222.453 132.733 226.636 136.942C231.544 141.878 233.068 145.46 237.353 153.017Z" fill="white"/>
<ellipse cx="248.666" cy="117.889" rx="9.52635" ry="10.7171" fill="#2A2A62"/>
<ellipse cx="204.012" cy="132.179" rx="11.3125" ry="7.14476" fill="#2A2A62"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M236.929 156.209C233.895 158.597 229.958 160.481 226.04 161.949C221.03 163.826 216.25 165.608 209.964 164.926C193.946 163.187 183.817 153.386 185.041 142.107C185.933 133.894 193.585 127.56 203.864 125.395C190.096 125.182 181.957 132.757 180.749 143.885C179.436 155.981 191.357 167.196 207.376 168.934C220.565 170.366 232.42 164.927 236.929 156.209Z" fill="#2A2A62"/>
<path d="M196.999 131.526C196.999 161.626 166.505 183.811 156.069 167.026C199.004 167.026 106 190.5 111 161.114C116 131.728 131.825 59.1138 151.431 59.1138C167.431 59.1137 196.999 101.427 196.999 131.526Z" fill="#5CAFF9"/>
<ellipse rx="9.52635" ry="5.95397" transform="matrix(-0.982198 0.18785 0.18785 0.982198 245.801 97.4397)" fill="white"/>
<path d="M113.618 168.697L92.898 151.815L47.9401 206.994C43.2782 212.715 44.1374 221.133 49.8591 225.795C55.5808 230.457 63.9983 229.598 68.6602 223.876L113.618 168.697Z" fill="#525284"/>
<path d="M113.618 168.697L92.898 151.815L47.9401 206.994C43.2782 212.715 44.1374 221.133 49.8591 225.795C55.5808 230.457 63.9983 229.598 68.6602 223.876L113.618 168.697Z" fill="url(#paint0_linear_5845_1072)"/>
<path d="M113.618 168.697L92.898 151.815L47.9401 206.994C43.2782 212.715 44.1374 221.133 49.8591 225.795C55.5808 230.457 63.9983 229.598 68.6602 223.876L113.618 168.697Z" fill="url(#paint1_linear_5845_1072)"/>
<rect width="11.6204" height="60.4262" rx="5.04898" transform="matrix(-0.775252 -0.631652 -0.631652 0.775252 101.345 171.809)" fill="#2A2A62"/>
<ellipse cx="174.91" cy="124.091" rx="12.3635" ry="13.909" fill="#2A2A62"/>
<ellipse cx="174.595" cy="96.9121" rx="12.3635" ry="7.72721" transform="rotate(10.8273 174.595 96.9121)" fill="white"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M98.164 168.2C70.17 145.391 65.9664 104.208 88.7751 76.2136C111.584 48.2196 152.768 44.016 180.762 66.8247C208.756 89.6334 212.959 130.817 190.15 158.811C167.342 186.805 126.158 191.009 98.164 168.2ZM105.441 159.269C82.379 140.479 78.9161 106.552 97.7061 83.4901C116.496 60.4284 150.424 56.9655 173.485 75.7555C196.547 94.5455 200.01 128.473 181.22 151.535C162.43 174.597 128.502 178.059 105.441 159.269Z" fill="#2B2B62"/>
<circle cx="139.5" cy="117.026" r="55.5" fill="white" fill-opacity="0.5"/>
<path d="M204.268 139.178C204.268 139.178 205.568 157.32 191.591 149.696" stroke="#2A2A62" stroke-width="4.06935" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M217.372 151.002C214.959 152.809 209.01 155.097 202.358 150.972C203.928 148.913 206.122 146.438 208.573 144.402C211.82 141.706 215.016 140.194 217.616 140.592C218.924 140.793 219.436 141.271 219.683 141.674C219.98 142.158 220.143 142.942 220.015 144.107C219.769 146.345 218.551 149.053 217.372 151.002Z" fill="#FFB8B8" stroke="#2A2A62" stroke-width="4.06935"/>
<defs>
<linearGradient id="paint0_linear_5845_1072" x1="39.2784" y1="234.412" x2="86.1367" y2="174.343" gradientUnits="userSpaceOnUse">
<stop offset="0.431264" stop-color="#2A2A62"/>
<stop offset="1" stop-color="#2A2A62" stop-opacity="0"/>
</linearGradient>
<linearGradient id="paint1_linear_5845_1072" x1="115.828" y1="144.829" x2="74.7721" y2="201.577" gradientUnits="userSpaceOnUse">
<stop offset="0.431264" stop-color="#2A2A62"/>
<stop offset="1" stop-color="#2A2A62" stop-opacity="0"/>
</linearGradient>
</defs>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 7.3 KiB

15
pages/404.module.css Normal file
View File

@ -0,0 +1,15 @@
.container{
display:flex;
align-items: center;
justify-content: center;
}
.codey{
width: calc(380rem / 16);
}
@media only screen and (max-width: calc(768rem / 16)) {
.container{
flex-direction: column;
}
}

24
pages/404.tsx Normal file
View File

@ -0,0 +1,24 @@
import React from "react";
import { Image } from "@/components/Image";
import { Link } from "@/components/Link";
import { Title } from "@/components/Title";
import styles from "./404.module.css";
export default function Custom404() {
return (
<div className={styles.container}>
<div className={styles.text}>
<Title>Error 404</Title>
<h2>Error 404</h2>
<h1>We couldn&apos;t find the page you&apos;re looking for!</h1>
<p>
We&apos;re working on it, but in the meantime,
<Link href="/"> click here to go back to the main page.</Link>
</p>
</div>
<Image src="images/codey-404.svg" className={styles.codey} />
</div>
);
}