Added custom 404 page #410
Labels
No Label
a11y
Backlog
Blocked
Bug
Content
Dependencies
Design
Feature Request
Good First Issue
In Progress
Performance
Priority - High
Priority - Low
Priority - Medium
Untriaged
No Milestone
No project
No Assignees
4 Participants
Notifications
Due Date
No due date set.
Dependencies
No dependencies set.
Reference: www/www-new#410
Loading…
Reference in New Issue
No description provided.
Delete Branch "404page"
Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?
Closes #282
demo: https://csclub.uwaterloo.ca/~a3thakra/csc/404page/404/
there is a slight problem with the build on the staging enviroment, that the 404 page isnt actually used when vising an unknown page.
I think this is beacuse when you visit an undefined page, it is using the 404 page of the normal site, instead of this branch.
However, on local builds it works fine, thus I believe it would work as intended on the normal site?
A few minor comments
@ -0,0 +1,15 @@
.container{
Add space between
r
and{
(and also for thecodey
class)@ -0,0 +1,15 @@
.container{
display:flex;
Use 2 spaces for indentation rather than tab.
@ -0,0 +9,4 @@
return (
<div className={styles.container}>
<div className={styles.text}>
<Title>Error 404</Title>
I think title should be a bit more descriptive. Maybe something like "404: Page Not Found"?
@ -0,0 +11,4 @@
<div className={styles.text}>
<Title>Error 404</Title>
<h2>Error 404</h2>
<h1>We couldn't find the page you're looking for!</h1>
We use
’
on the get involved page, let's do the same thing here for consistency (and we also won't need to escape it in that case).@ -0,0 +14,4 @@
<h1>We couldn't find the page you're looking for!</h1>
<p>
We're working on it, but in the meantime,
<Link href="/"> click here to go back to the main page.</Link>
Very minor thing, but when you tab over this link it includes the space before "click". I think it would look better if we didn't include the space in the link
Some comments:
@ -0,0 +1,15 @@
.container {
display:flex;
There should be a space after the colon, ie.
display: flex
.@snedadah Are you using VS Code? For VS Code users, we should have some kind of "format on save" set up for this repo, in order to maintain a consistent formatting style across everyone's code. (If you're using a different editor, then we might need to look into how we can apply our formatting rules there.)
@ -0,0 +9,4 @@
padding: calc(20rem / 16);
padding-right: 0;
}
.heading {
Nitpick - there should be an empty line between lines 11 and 12.
@ -0,0 +17,4 @@
.container {
flex-direction: column;
}
.codey {
Nitpick again - there should be an empty line between lines 19 and 20.
@ -0,0 +5,4 @@
import { Title } from "@/components/Title";
import styles from "./404.module.css";
export default function Custom404() {
Another nitpick, there should probably be an empty line between lines 7 and 8 - we want to keep the imports and component visually separate. 😄
Just another small thing with padding: could we maybe sure the page has
60px
of padding at the bottom on desktop, and30px
of padding at the bottom on mobile? The text/Codey still look like they're a little close to the bottom, in my opinion. (I believe these are the numbers used on the home page and some of the other pages as well.)I think there's a prettier plugin for vim https://prettier.io/docs/en/vim.html (that's what we're using for formatting)
Thanks for working on this, Shahan! We can continue to discuss what the text should say, and edit it in the future if we want to change it, but otherwise this PR should be good to merge!