-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Created a custom 404 page to enhance user experience for non-existent routes.
- Loading branch information
Showing
26 changed files
with
166 additions
and
47 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
File renamed without changes
File renamed without changes
File renamed without changes
File renamed without changes
File renamed without changes
File renamed without changes
File renamed without changes
File renamed without changes.
File renamed without changes.
File renamed without changes.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,2 @@ | ||
import '../scss/404.scss'; | ||
import "./analytics.js"; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,22 @@ | ||
import { initializeApp } from "firebase/app"; | ||
import { getAnalytics, logEvent } from "firebase/analytics"; | ||
|
||
// See: https://firebase.google.com/docs/web/learn-more#config-object | ||
const firebaseConfig = { | ||
apiKey: "AIzaSyDJMVkse8Mla3rqrVak1qkfXYxlh2AmUd8", | ||
authDomain: "bvarga-fe600.firebaseapp.com", | ||
projectId: "bvarga-fe600", | ||
storageBucket: "bvarga-fe600.appspot.com", | ||
messagingSenderId: "443364341536", | ||
appId: "1:443364341536:web:d7b91d4ecfa7618f594945", | ||
measurementId: "G-PB70YSPDG1" | ||
}; | ||
|
||
// Initialize Firebase | ||
const app = initializeApp(firebaseConfig); | ||
|
||
// Initialize Analytics and get a reference to the service | ||
const analytics = getAnalytics(app); | ||
|
||
// Export analytics | ||
module.exports = analytics; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,62 @@ | ||
@import "poppins"; | ||
@import "variables"; | ||
|
||
// Reset | ||
body, html { | ||
margin: 0; | ||
padding: 0; | ||
font-family: $font-family; | ||
background-color: $background-color; | ||
color: $text-color; | ||
height: 100%; | ||
display: flex; | ||
justify-content: center; | ||
align-items: center; | ||
} | ||
|
||
// Main container | ||
.error-container { | ||
text-align: center; | ||
max-width: 640px; | ||
margin: auto; | ||
padding: $gap; | ||
|
||
header h1 { | ||
font-size: $font-size-large; | ||
margin-bottom: $gap; | ||
color: $text-color; | ||
} | ||
|
||
header p { | ||
font-size: $font-size-medium; | ||
margin-bottom: $gap; | ||
} | ||
|
||
img { | ||
width: 300px; | ||
height: 270px; | ||
margin-bottom: $gap; | ||
filter: brightness(0) saturate(100%) invert(20%) sepia(97%) saturate(1590%) hue-rotate(193deg) brightness(95%) contrast(102%); | ||
} | ||
|
||
.action p { | ||
font-size: $font-size-small; | ||
margin-bottom: calc($gap / 2); // Smaller gap for less important text | ||
} | ||
|
||
.home-link { | ||
display: inline-block; | ||
padding: calc($gap / 2) $gap; // Padding with gap-based scaling | ||
font-size: $font-size-link; | ||
font-weight: bold; | ||
color: $link-color; | ||
background-color: $primary-color; | ||
text-decoration: none; | ||
border-radius: 5px; | ||
transition: background-color 0.3s ease; | ||
|
||
&:hover { | ||
background-color: $hover-color; | ||
} | ||
} | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,15 @@ | ||
$font-family: 'Poppins', 'Arial', sans-serif; | ||
$background-color: #D9E2EC; | ||
$text-color: #00509E; | ||
$primary-color: #4B5563; | ||
$hover-color: #3CB371; | ||
$link-color: #FFF; | ||
$error-color: #f44336; | ||
$border-radius: 4px; | ||
$gap: 16px; | ||
$button-padding: 24px; | ||
|
||
$font-size-large: 48px; // Large font size for main heading | ||
$font-size-medium: 24px; // Medium font size for subheading | ||
$font-size-small: 16px; // Small font size for additional text | ||
$font-size-link: 16px; // Font size for link text |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,25 @@ | ||
<!DOCTYPE html> | ||
<html lang="en"> | ||
<head> | ||
<meta charset="UTF-8"> | ||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> | ||
<title>404 - Page not found - Oops!</title> | ||
</head> | ||
<body> | ||
<div class="error-container"> | ||
<header> | ||
<h1>Page not found</h1> | ||
<p>Oops! Looks like you’ve hit a dead end.</p> | ||
</header> | ||
<picture> | ||
<!-- Source of the image: https://www.cleanpng.com/png-http-404-error-user-interface-design-google-chrome-2045552/ --> | ||
<source type="image/webp" srcset="../assets/images/confused-robot.png?as=webp"> | ||
<img src="../assets/images/confused-robot.png" alt="Confused robot looking for the page" width="300" height="270" /> | ||
</picture> | ||
<div class="action"> | ||
<p>Don't worry, even robots get lost sometimes.</p> | ||
<a href="/" class="home-link">Take Me Home</a> | ||
</div> | ||
</div> | ||
</body> | ||
</html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters