diff --git a/here.html b/here.html new file mode 100644 index 0000000..8f224f5 --- /dev/null +++ b/here.html @@ -0,0 +1,29 @@ + + + + + Successfully Registered + + + + +
+
+
+
+ illustration +

Successfully Registered

+
+ +

Welcome to PHYSI-C-TECH hope you will enjoy our service.

+ + +
+
+
+
+
+ + + + diff --git a/index.html b/index.html index 887ce9d..8d4a93f 100644 --- a/index.html +++ b/index.html @@ -1,5 +1,202 @@ + + + + + + + Physi-c Tech + + + + + + + + + + + +
+ + + + + +
+
+
+ + + + + + +
+
+

Physi-c
Tech

+
+ PLAY
+ NEW GAME
+ SOUND ON
+ ABOUT
+
+
+
+ +
+
+

100% COMPLETE!

+

🏆

+

NEW GAME? +
+
+
+
+ + + +
+
+
+
+

0/0 discovered

+
+
+
🏅 +
0/13
+
+
+ +
+
🚮
+
+ +
+
+
+
+
+
+
.
+
+
+
+ +
+ +
+ + + + + + + + + + + + +======= @@ -189,4 +386,5 @@ + diff --git a/logIn.css b/logIn.css new file mode 100644 index 0000000..b31de0a --- /dev/null +++ b/logIn.css @@ -0,0 +1,238 @@ +:root { + --background: #1a1a2e; + --color: #ffffff; + --primary-color: #0f3460; +} + +* { + box-sizing: border-box; +} + +html { + scroll-behavior: smooth; +} + +body { + margin: 0; + box-sizing: border-box; + font-family: "poppins"; + background: var(--background); + color: var(--color); + letter-spacing: 1px; + transition: background 0.2s ease; + -webkit-transition: background 0.2s ease; + -moz-transition: background 0.2s ease; + -ms-transition: background 0.2s ease; + -o-transition: background 0.2s ease; +} + +a { + text-decoration: none; + color: var(--color); +} + +h1 { + font-size: 2.5rem; + animation: jumping 1s infinite; +} + +.container { + display: flex; + justify-content: center; + align-items: center; + height: 100vh; +} + +.login-container { + position: relative; + width: 22.2rem; +} + +.form-container { + border: 1px solid hsla(0, 0%, 65%, 0.158); + box-shadow: 0 0 36px 1px rgba(0, 0, 0, 0.2); + border-radius: 10px; + backdrop-filter: blur(20px); + z-index: 99; + padding: 2rem; + -webkit-border-radius: 10px; + -moz-border-radius: 10px; + -ms-border-radius: 10px; + -o-border-radius: 10px; +} + +.login-container form input { + display: block; + padding: 14.5px; + width: 100%; + margin: 2rem 0; + color: var(--color); + outline: none; + background-color: #9191911f; + border: none; + border-radius: 5px; + font-weight: 500; + letter-spacing: 0.8px; + font-size: 15px; + backdrop-filter: blur(15px); + -webkit-border-radius: 5px; + -moz-border-radius: 5px; + -ms-border-radius: 5px; + -o-border-radius: 5px; +} + +.login-container form input:focus { + box-shadow: 0 0 16px 1px rgba(0, 0, 0, 0.2); + animation: wobble 0.3s ease-in; + -webkit-animation: wobble 0.3s ease-in; +} + +.login-container form button { + background-color: var(--primary-color); + color: var(--color); + display: block; + padding: 13px; + border-radius: 5px; + outline: none; + font-size: 18px; + letter-spacing: 1.5px; + font-weight: bold; + width: 100%; + cursor: pointer; + margin-bottom: 2rem; + transition: all 0.1s ease-in-out; + border: none; + -webkit-border-radius: 5px; + -moz-border-radius: 5px; + -ms-border-radius: 5px; + -o-border-radius: 5px; + -webkit-transition: all 0.1s ease-in-out; + -moz-transition: all 0.1s ease-in-out; + -ms-transition: all 0.1s ease-in-out; + -o-transition: all 0.1s ease-in-out; +} + +.login-container form button:hover { + box-shadow: 0 0 10px 1px rgba(0, 0, 0, 0.15); + transform: scale(1.02); + -webkit-transform: scale(1.02); + -moz-transform: scale(1.02); + -ms-transform: scale(1.02); + -o-transform: scale(1.02); +} + +.circle { + width: 8rem; + height: 8rem; + background: var(--primary-color); + border-radius: 50%; + -webkit-border-radius: 50%; + -moz-border-radius: 50%; + -ms-border-radius: 50%; + -o-border-radius: 50%; + position: absolute; +} + +.illustration { + position: absolute; + top: -14%; + right: -2px; + width: 90%; + animation: movingUpDown 3s infinite ease-in-out; +} + +.circle-one { + top: 0; + left: 0; + z-index: -1; + transform: translate(-45%, -45%); + -webkit-transform: translate(-45%, -45%); + -moz-transform: translate(-45%, -45%); + -ms-transform: translate(-45%, -45%); + -o-transform: translate(-45%, -45%); +} + +.circle-two { + bottom: 0; + right: 0; + z-index: -1; + transform: translate(45%, 45%); + -webkit-transform: translate(45%, 45%); + -moz-transform: translate(45%, 45%); + -ms-transform: translate(45%, 45%); + -o-transform: translate(45%, 45%); +} + +.register-forget { + margin: 1rem 0; + display: flex; + justify-content: space-between; +} + +.opacity { + opacity: 0.6; +} + +.theme-btn-container { + position: absolute; + left: 0; + bottom: 2rem; +} + +.theme-btn { + cursor: pointer; + transition: all 0.3s ease-in; +} + +.theme-btn:hover { + width: 40px !important; +} + +@keyframes wobble { + 0% { + transform: scale(1.025); + -webkit-transform: scale(1.025); + -moz-transform: scale(1.025); + -ms-transform: scale(1.025); + -o-transform: scale(1.025); + } + 25% { + transform: scale(1); + -webkit-transform: scale(1); + -moz-transform: scale(1); + -ms-transform: scale(1); + -o-transform: scale(1); + } + 75% { + transform: scale(1.025); + -webkit-transform: scale(1.025); + -moz-transform: scale(1.025); + -ms-transform: scale(1.025); + -o-transform: scale(1.025); + } + 100% { + transform: scale(1); + -webkit-transform: scale(1); + -moz-transform: scale(1); + -ms-transform: scale(1); + -o-transform: scale(1); + } +} + +@keyframes jumping { + 0%, 100% { + transform: translateY(0); + } + 50% { + transform: translateY(-10px); + } +} + +@keyframes movingUpDown { + 0%, 100% { + transform: translateY(0); + } + 50% { + transform: translateY(-10px); + } +} \ No newline at end of file diff --git a/logIn.html b/logIn.html new file mode 100644 index 0000000..311f892 --- /dev/null +++ b/logIn.html @@ -0,0 +1,34 @@ + + + + + Login + + + + + +
+ +
+
+ + + + diff --git a/node.js b/node.js new file mode 100644 index 0000000..e69de29 diff --git a/script.js b/script.js new file mode 100644 index 0000000..b8bcf7f --- /dev/null +++ b/script.js @@ -0,0 +1,81 @@ +const themes = [ + { + background: "#1A1A2E", + color: "#FFFFFF", + primaryColor: "#0F3460" + }, + { + background: "#461220", + color: "#FFFFFF", + primaryColor: "#E94560" + }, + { + background: "#192A51", + color: "#FFFFFF", + primaryColor: "#967AA1" + }, + { + background: "#F7B267", + color: "#000000", + primaryColor: "#F4845F" + }, + { + background: "#F25F5C", + color: "#000000", + primaryColor: "#642B36" + }, + { + background: "#231F20", + color: "#FFF", + primaryColor: "#BB4430" + } +]; + +const setTheme = (theme) => { + const root = document.querySelector(":root"); + root.style.setProperty("--background", theme.background); + root.style.setProperty("--color", theme.color); + root.style.setProperty("--primary-color", theme.primaryColor); + root.style.setProperty("--glass-color", theme.glassColor); +}; + +const displayThemeButtons = () => { + const btnContainer = document.querySelector(".theme-btn-container"); + themes.forEach((theme) => { + const div = document.createElement("div"); + div.className = "theme-btn"; + div.style.cssText = background: ${theme.background}; width: 25px; height: 25px; + btnContainer.appendChild(div); + div.addEventListener("click", () => setTheme(theme)); + }); +}; + +displayThemeButtons(); + +const express = require('express'); +const bodyParser = require('body-parser'); +const app = express(); +const PORT = process.env.PORT || 3000; + +app.use(bodyParser.urlencoded({ extended: true })); + +// Serve static files (e.g., your login page, CSS, JS) +app.use(express.static('public')); + +// Handle login form submission +app.post('/login', (req, res) => { + const { username, password } = req.body; + + // Implement your authentication logic here + if (username === 'admin' && password === 'password') { + // Example success response + res.send('Login successful!'); + } else { + // Example failure response + res.send('Invalid username or password'); + } +}); + +app.listen(PORT, () => { + console.log(`Server is running on port ${PORT}`); +}); diff --git a/signup.html b/signup.html new file mode 100644 index 0000000..3d88fa9 --- /dev/null +++ b/signup.html @@ -0,0 +1,39 @@ + + + + + Signup + + + + + + +
+ +
+
+ + + + + + \ No newline at end of file diff --git a/thanks.html b/thanks.html new file mode 100644 index 0000000..4939486 --- /dev/null +++ b/thanks.html @@ -0,0 +1,29 @@ + + + + + Welcome Back + + + + +
+ +
+
+ + + +