Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

LogIn/SignUp Page #158

Open
wants to merge 2 commits into
base: main
Choose a base branch
from
Open

LogIn/SignUp Page #158

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
8392586
LogIn/SignUp Page
hritika2409 Jun 2, 2024
c80671a
Merge branch 'main' into LogIn
hritika2409 Jun 2, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
29 changes: 29 additions & 0 deletions here.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,29 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Successfully Registered</title>
<link rel="stylesheet" href="./logIn.css">
</head>
<body>
<!-- partial:index.partial.html -->
<section class="container">
<div class="login-container">
<div class="circle circle-one"></div>
<div class="form-container">
<img src="https://raw.githubusercontent.com/hicodersofficial/glassmorphism-login-form/master/assets/illustration.png" alt="illustration" class="illustration" />
<h1 class="opacity">Successfully Registered</h1>
<form action="/login" method="POST">

<h3 class="opacity">Welcome to PHYSI-C-TECH hope you will enjoy our service.</h3>
<button type="submit" class="opacity"><a href="./index.html"> Start Playing</a></button>

</div>
<div class="circle circle-two"></div>
</div>
<div class="theme-btn-container"></div>
</section>
<!-- partial -->
<script src="./script.js"></script>
</body>
</html>
198 changes: 198 additions & 0 deletions index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,202 @@
<!DOCTYPE html>
<html>


<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="monetization" content="$ilp.uphold.com/U9iHfppnha6L">
<title>Physi-c Tech</title>

<link rel="stylesheet" href="style.css">
<!-- google fonts link -->
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Jaro:[email protected]&family=Jersey+20&family=Jersey+25+Charted&family=Micro+5+Charted&family=Salsa&family=Silkscreen:wght@400;700&family=Tac+One&display=swap" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.2/css/all.min.css" integrity="sha512-SnH5WK+bZxgPHs44uWIX+LLJAJ9/2PkPKZ5QiAj6Ta86w+fsb2TkcmfRyVX3pBnMFcV7oQPJkl9QevSCWr3W6A==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<link rel="icon" href="./atom.png" type="image/png"/>
<style>
.preloader {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: black;
display: flex;
justify-content: center;
align-items: center;
z-index: 9999; /* Ensure the preloader is above all other content */
}

.circle {
width: 200px;
height: 200px;
background-color: black;
border-radius: 50%;
animation: circleAnimation 2s infinite linear, glowingBorder 2s infinite linear;
box-shadow: 0 0 20px 10px rgba(255, 0, 0, 0.8); /* Adjusted shadow values */
}

.circle:before {
content: "";
position: absolute;
top: 5px;
left: 5px;
right: 5px;
bottom: 5px;
border-radius: 50%;
border: 3px solid transparent;
border-top-color: hsl(357, 87%, 38%);
animation: circleAnimation 2s infinite linear, glowingBorder 2s infinite linear;
}

.circle:after {
content: "";
position: absolute;
top: 15px;
left: 15px;
right: 15px;
bottom: 15px;
border-radius: 50%;
border: 3px solid transparent;
border-top-color: hsl(357, 93%, 49%);
animation: circleAnimation 2s infinite linear, glowingBorder 2s infinite linear;
}

@keyframes circleAnimation {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}

@keyframes glowingBorder {
0% {
box-shadow: 0 0 20px 10px rgba(255, 0, 0, 0.8); /* Adjusted shadow values */
}
50% {
box-shadow: 0 0 40px 20px rgba(255, 0, 0, 1); /* Adjusted shadow values */
}
100% {
box-shadow: 0 0 20px 10px rgba(255, 0, 0, 0.8); /* Adjusted shadow values */
}
}
</style>
</head>
<body>
<div class="preloader">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.2/css/all.min.css"
integrity="sha512-SnH5WK+bZxgPHs44uWIX+LLJAJ9/2PkPKZ5QiAj6Ta86w+fsb2TkcmfRyVX3pBnMFcV7oQPJkl9QevSCWr3W6A=="
crossorigin="anonymous" referrerpolicy="no-referrer" />
<link rel="icon" href="./atom.png" type="image/png" />
</head>

<body>
<div class="preloader">
<div class="circle"></div>
</div>



<canvas id="ctmp" width="100" height="100" style="display:none"></canvas>
<canvas id="homecanvas" width="400" height="600" style="display:none"></canvas>

<div id="home"
style="background-image: url(https://i.pinimg.com/originals/e6/c9/e3/e6c9e3d891aa56637847ba09c28fa00c.jpg); background-size: cover;">
<div id="homecontent">
<h1 class="focusin" style="padding-top: 150px;">Physi-c<br>Tech</h1>
<div class="buttons">
<span id="playbutton" class="btn" onclick="play()">PLAY</span><br>
<span id="newgamebutton" class="btn" onclick="newgame()">NEW GAME</span><br>
<span id="soundbutton" class="btn" onclick="toggleSound()">SOUND ON</span><br>
<span class="btn" onclick="window.location.href='about.html'">ABOUT</span><br>
</div>
</div>
</div>

<div id="collection" class="trophy">
<div id="wincontent" class="trophy">
<h1>100% COMPLETE!</h1>
<h1>🏆</h1>
<h2 id="moves"></h2><span id="newgamebutton2">NEW GAME?</span>
</div>
<div id="collectioncontent" class="trophy"></div>
<div id="finalcontent" class="trophy"></div>
</div>

<div id="modal" class="modal">
<div id="modalcontent" class="modal">
<div class="cross">
<div class="upper-cross" style="padding: 4px;">
<button
onclick="document.getElementById('modal').style.display='none'">
<i class="fa-solid fa-xmark fa-beat" style="color: white;">
</i></button>
</div>
</div>
<h1 id="discovery" class="modal"></h1>
<div class="modal"><img id="discoveryimage" class="modal" src="" width="100" height="100"></div>
<h2 class="modal" id="discoverydesc" style="padding:10%"></h2>
</div>
</div>

<div class="outer">
<div class="upper">
<div id="btnhome"><button id="homebutton" style="cursor: pointer;">🛖</button></div>
<div id="title">
<h1><span id="score">0</span>/<span id="max">0</span> discovered</h1>
</div>
<div id="btnhint"><button id="hint" style="opacity:.3;font-size:30px;cursor: pointer;">💡</button></div>
<div id="btncollection"><span id="collectionbutton" style="cursor: pointer;">🏅</span>
<div id="collectionnumbers">0/13</div>
</div>
</div>

<div id="forge" class="forge drop move">
<div id="trash" style="cursor: pointer;">🚮</div>
</div>

<div class="lower">
<div class="nav">
<div><button><img id="upbutton" width=40 height="80"></button></div>
<div><button><img id="downbutton" width=40 height="80"></button></div>
</div>
<div id="pantry" class="copy">
<div style="position:relative;top:5000px" id="spacer">.</div>
</div>
</div>
</div>

<div class="pop-up-container">
<div class="pop-up" style="display: none;">
<div class="upper-cross" style="padding: 4px;">
<button onclick="cross()"><i class="fa-solid fa-xmark fa-beat" style="color: white;"></i></button>
</div>
<div class="lower-content">
<img src="scientist.png" alt="" style="height: 90px;width: 90px;">
<p id="speech-text">Hello, tech-enthusiasts!</p>
</div>
<div class="lower-button">
<button onclick="nextSpeech()"><i class="fa-solid fa-forward fa-bounce fa-lg"></i></button>
</div>
</div>
</div>

<button id="feedbackButton" onclick="handleFeedback()">Facing an Issue? Help Us Improve!</button>

<script src="preloader.js"></script>
<script src="elements.js"></script>
<script src="game.js"></script>
<script src="music.js"></script>
<script src="svg.js"></script>
<script src="index.js"></script>
<script src="description.js"></script>
</body>

=======
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
Expand Down Expand Up @@ -189,4 +386,5 @@ <h2 class="modal" id="discoverydesc" style="padding: 10%"></h2>
<script src="index.js"></script>
<script src="description.js"></script>
</body>

</html>
Loading