Skip to content

Commit

Permalink
ui fix
Browse files Browse the repository at this point in the history
  • Loading branch information
@j05u3
j05u3 committed Jan 24, 2024
0 parents commit b10841f
Show file tree
Hide file tree
Showing 7 changed files with 564 additions and 0 deletions.
35 changes: 35 additions & 0 deletions 404.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,35 @@
.not-found-container {
width: 100%;
display: flex;
overflow: auto;
min-height: 100vh;
align-items: center;
flex-direction: column;
justify-content: center;
}
.not-found-container1 {
display: flex;
position: relative;
align-items: center;
flex-direction: column;
justify-content: center;
}
.not-found-text1 {
color: rgb(38, 38, 38);
font-size: 252px;
margin-top: -20px;
font-weight: 900;
margin-bottom: -20px;
letter-spacing: -20px;
}
.not-found-container2 {
width: 421px;
display: flex;
align-items: center;
flex-direction: column;
justify-content: center;
}
.not-found-text2 {
text-align: center;
font-weight: 400;
}
89 changes: 89 additions & 0 deletions 404.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,89 @@
<!DOCTYPE html>
<html lang="en">
<head>
<title>404 - Not Found</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta charset="utf-8" />
<meta property="twitter:card" content="summary_large_image" />

<style data-tag="reset-style-sheet">
html { line-height: 1.15;}body { margin: 0;}* { box-sizing: border-box; border-width: 0; border-style: solid;}p,li,ul,pre,div,h1,h2,h3,h4,h5,h6,figure,blockquote,figcaption { margin: 0; padding: 0;}button { background-color: transparent;}button,input,optgroup,select,textarea { font-family: inherit; font-size: 100%; line-height: 1.15; margin: 0;}button,select { text-transform: none;}button,[type="button"],[type="reset"],[type="submit"] { -webkit-appearance: button;}button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner { border-style: none; padding: 0;}button:-moz-focus,[type="button"]:-moz-focus,[type="reset"]:-moz-focus,[type="submit"]:-moz-focus { outline: 1px dotted ButtonText;}a { color: inherit; text-decoration: inherit;}input { padding: 2px 4px;}img { display: block;}html { scroll-behavior: smooth }
</style>
<style data-tag="default-style-sheet">
html {
font-family: Inter;
font-size: 16px;
}

body {
font-weight: 400;
font-style:normal;
text-decoration: none;
text-transform: none;
letter-spacing: normal;
line-height: 1.15;
color: var(--dl-color-gray-black);
background-color: var(--dl-color-gray-white);

}
</style>
<link
rel="stylesheet"
href="https://unpkg.com/animate.css@4.1.1/animate.css"
/>
<link
rel="stylesheet"
href="https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&amp;display=swap"
data-tag="font"
/>
<link
rel="stylesheet"
href="https://unpkg.com/@teleporthq/teleport-custom-scripts/dist/style.css"
/>
</head>
<body>
<link rel="stylesheet" href="./style.css" />
<div>
<link href="./404.css" rel="stylesheet" />

<div class="not-found-container">
<h3>OOPS! PAGE NOT FOUND</h3>
<div class="not-found-container1">
<h1 class="not-found-text1">404</h1>
</div>
<div class="not-found-container2">
<h2 class="not-found-text2">
WE ARE SORRY, BUT THE PAGE YOU REQUESTED WAS NOT FOUND
</h2>
</div>
</div>
</div>
<script type="module">
// Import the functions you need from the SDKs you need
import { initializeApp } from "https://www.gstatic.com/firebasejs/10.7.2/firebase-app.js";
import { getAnalytics } from "https://www.gstatic.com/firebasejs/10.7.2/firebase-analytics.js";
// TODO: Add SDKs for Firebase products that you want to use
// https://firebase.google.com/docs/web/setup#available-libraries

// Your web app's Firebase configuration
// For Firebase JS SDK v7.20.0 and later, measurementId is optional
const firebaseConfig = {
apiKey: "AIzaSyDE4JHA1oCDAOEukmM-9yiERrYYKUqABok",
authDomain: "sudowoodo-xyz.firebaseapp.com",
projectId: "sudowoodo-xyz",
storageBucket: "sudowoodo-xyz.appspot.com",
messagingSenderId: "89989993628",
appId: "1:89989993628:web:acaaf1e3f1f7f16a940959",
measurementId: "G-HB3WFEW8JC"
};

// Initialize Firebase
const app = initializeApp(firebaseConfig);
const analytics = getAnalytics(app);
</script>
<script
defer=""
src="https://unpkg.com/@teleporthq/react-components/dist/animate-on-reveal.umd.js"
></script>
</body>
</html>
204 changes: 204 additions & 0 deletions index.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,204 @@
.home-container {
color: white;
width: 100%;
display: flex;
overflow: auto;
min-height: 100vh;
align-items: center;
flex-direction: column;
background-color: black;
}
.home-hero {
width: 100%;
display: flex;
padding: var(--dl-space-space-threeunits);
max-width: var(--dl-size-size-maxwidth);
min-height: 80vh;
align-items: center;
flex-direction: row;
justify-content: space-between;
}
.home-image {
width: 400px;
object-fit: cover;
}
.home-container1 {
display: flex;
margin-right: var(--dl-space-space-threeunits);
padding-right: var(--dl-space-space-threeunits);
flex-direction: column;
}
.home-text {
font-size: 2.1rem;
max-width: 450px;
font-weight: 500;
line-height: 1.3;
letter-spacing: 0.2rem;
}
.home-text01 {
text-decoration: underline;
}
.home-text03 {
text-decoration: underline;
}
.home-text05 {
text-decoration: inherit;
}
.home-text06 {
text-decoration: inherit;
}
.home-text07 {
text-decoration: inherit;
}
.home-text08 {
margin-top: var(--dl-space-space-twounits);
margin-bottom: var(--dl-space-space-twounits);
}
.home-btn-group {
display: flex;
align-items: center;
flex-direction: row;
}
.home-link {
color: var(--dl-color-gray-black);
transition: 0.3s;
font-family: "Courier New";
font-weight: 700;
margin-left: var(--dl-space-space-unit);
padding-top: var(--dl-space-space-unit);
border-color: transparent;
padding-left: var(--dl-space-space-twounits);
padding-right: var(--dl-space-space-twounits);
padding-bottom: var(--dl-space-space-unit);
text-decoration: none;
}
.home-link:hover {
border-color: var(--dl-color-gray-black);
}
@media(max-width: 991px) {
.home-hero {
flex-direction: column;
}
.home-container1 {
align-items: center;
margin-right: 0px;
margin-bottom: var(--dl-space-space-twounits);
padding-right: 0px;
}
.home-text {
font-size: 2.1rem;
text-align: center;
font-weight: 500;
line-height: 1.3;
letter-spacing: 0.2rem;
}
.home-text01 {
text-decoration: underline;
}
.home-text03 {
text-decoration: underline;
}
.home-text05 {
text-decoration: inherit;
}
.home-text06 {
text-decoration: inherit;
}
.home-text07 {
text-decoration: inherit;
}
.home-text08 {
text-align: center;
padding-left: var(--dl-space-space-threeunits);
padding-right: var(--dl-space-space-threeunits);
}
.home-link {
color: var(--dl-color-gray-black);
}
}
@media(max-width: 767px) {
.home-hero {
padding-left: var(--dl-space-space-twounits);
padding-right: var(--dl-space-space-twounits);
}
.home-image {
width: 80%;
}
.home-text {
font-size: 2.1rem;
font-weight: 500;
line-height: 1.3;
letter-spacing: 0.2rem;
}
.home-text01 {
text-decoration: underline;
}
.home-text03 {
text-decoration: underline;
}
.home-text05 {
text-decoration: inherit;
}
.home-text06 {
text-decoration: inherit;
}
.home-text07 {
text-decoration: inherit;
}
.home-text08 {
padding-left: var(--dl-space-space-unit);
padding-right: var(--dl-space-space-unit);
}
.home-link {
color: var(--dl-color-gray-black);
}
}
@media(max-width: 479px) {
.home-hero {
padding-top: var(--dl-space-space-twounits);
padding-left: var(--dl-space-space-unit);
padding-right: var(--dl-space-space-unit);
padding-bottom: var(--dl-space-space-twounits);
}
.home-container1 {
margin-bottom: var(--dl-space-space-unit);
}
.home-text {
font-size: 2.1rem;
font-weight: 500;
line-height: 1.3;
animation-name: none;
letter-spacing: 0.2rem;
animation-delay: 0s;
animation-duration: 300ms;
animation-direction: normal;
animation-iteration-count: 1;
animation-timing-function: ease;
}
.home-text01 {
text-decoration: underline;
}
.home-text03 {
text-decoration: underline;
}
.home-text05 {
text-decoration: inherit;
}
.home-text06 {
text-decoration: inherit;
}
.home-text07 {
text-decoration: inherit;
}
.home-btn-group {
flex-direction: column;
}
.home-link {
color: var(--dl-color-gray-black);
margin-top: var(--dl-space-space-unit);
font-family: Courier New;
font-weight: 700;
margin-left: 0px;
text-decoration: none;
}
}
Loading

0 comments on commit b10841f

Please sign in to comment.