Skip to content

Commit

Permalink
Merge pull request #111 from Ayushvishwakarma04/homepage
Browse files Browse the repository at this point in the history 
Home page added
  • Loading branch information
@Durgesh4993
Durgesh4993 authored Jun 17, 2024
2 parents d8b0555 + 167a2ba commit d19f3e8
Show file tree
Hide file tree
Showing 4 changed files with 878 additions and 0 deletions.
Binary file added Screenshot (249).png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added Squard-line video.mp4
View file
Binary file not shown.
218 changes: 218 additions & 0 deletions home-page.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,218 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="style.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<link rel="website icon" type="png" href="favicon.ico">
<title>Squard-line</title>
<script src="https://kit.fontawesome.com/a076d05399.js" crossorigin="anonymous"></script>
</head>
<body>
<nav class="navbar">
<div class="navdiv"> <!-- The href tag can be updated later with the desired links -->
<div class="logo"><a href="#" style="color: beige; text-shadow: 1px 1px blue; cursor: text;">Squard-line</a></div>
<ul>
<li><a href="#game-info">Home</a></li>
<li><a href="#modes">Facts</a></li>
<li><a href="#leaderboard">Gameplay</a></li>
<a href="index.html" target="_blank"><button>Play Now</button></a>
</ul>
</div>
</nav>
<div class="head1">
<div class="text">
<h1>SQUARD-LINE</h1>
<p style="padding-left: 40px;">Squard-line: <span class="auto-type"></span></p>
</div>
<div class="video1">
<video controls loop autoplay muted src="Squard-line video.mp4"></video>
</div>
</div>
<div class="game-info" id="game-info">
<div class="image1">
<img style="height: 550px; border-radius: 15px;" src="Screenshot (249).png" alt="" srcset="">
<div class="content1">
<h1>Welcome to SQUARD-LINE <br>
Where Space Meets Cosmic Challenges!</h1>
<p>Step into the cosmic arena of SQUARD-LINE, where every move shapes your interstellar destiny. With five dynamic modes to explore and a diverse cast of blocky chums to command, strategic thinking and lightning-fast reflexes are your tickets to victory. Whether you're stacking up the fun in Classic, mastering the challenge of Penta, or exploring the cosmos in Mix, each round presents an opportunity to prove your cosmic prowess. With only one life per round, it's a race against time and your opponents to reign supreme in the stars.</p>
</div>
</div>
</div>
<div class="modes" id="modes">
<h2>Squared-Line Cosmic Facts</h2>
<div class="cards">
<div class="card">Stellar Tetris</div>
<div class="card">Gravity Defiers</div>
<div class="card">Galactic Novice</div>
<div class="card">Space Debris</div>
<div class="card">Cosmic Colors</div>
</div>
</div>
<div class="line"></div>
<div class="leaderboard" id="leaderboard">
<h2 style="color: #5c9fe1">Mastering Cosmic Gameplay</h2>
<div class="image2">
<p style="color: #5c9fe1">
🚀 Embark on your cosmic adventure in SQUARD-LINE by mastering its gameplay.
<br>🚀 Start by diving into our exciting, thrilling games, each offering a unique cosmic challenge.
<br>🚀 Next, strategically arrange your squared chums to conquer the lines, adapting your strategy as you navigate through cosmic obstacles.
<br>🚀 Compete globally to climb the leaderboard and prove your cosmic dominance.
<br><span style="font-weight: bold; font-size: 32px;"><a>🚀 Are you ready to conquer the cosmos?</a></span>
</p>
</div>
</div>
<section>
<div class="content">
<h2>Squard-line</h2>
<h2>Squard-line</h2>
</div>
</section>
<div class="line">
<a href="index.html" target="_blank">
<button>
PLAY NOW
<div class="star-1">
<svg
xmlns="http://www.w3.org/2000/svg"
xml:space="preserve"
version="1.1"
style="shape-rendering:geometricPrecision; text-rendering:geometricPrecision; image-rendering:optimizeQuality; fill-rule:evenodd; clip-rule:evenodd"
viewBox="0 0 784.11 815.53"
xmlns:xlink="http://www.w3.org/1999/xlink"
>
<defs></defs>
<g id="Layer_x0020_1">
<metadata id="CorelCorpID_0Corel-Layer"></metadata>
<path
class="fil0"
d="M392.05 0c-20.9,210.08 -184.06,378.41 -392.05,407.78 207.96,29.37 371.12,197.68 392.05,407.74 20.93,-210.06 184.09,-378.37 392.05,-407.74 -207.98,-29.38 -371.16,-197.69 -392.06,-407.78z"
></path>
</g>
</svg>
</div>
<div class="star-2">
<svg
xmlns="http://www.w3.org/2000/svg"
xml:space="preserve"
version="1.1"
style="shape-rendering:geometricPrecision; text-rendering:geometricPrecision; image-rendering:optimizeQuality; fill-rule:evenodd; clip-rule:evenodd"
viewBox="0 0 784.11 815.53"
xmlns:xlink="http://www.w3.org/1999/xlink"
>
<defs></defs>
<g id="Layer_x0020_1">
<metadata id="CorelCorpID_0Corel-Layer"></metadata>
<path
class="fil0"
d="M392.05 0c-20.9,210.08 -184.06,378.41 -392.05,407.78 207.96,29.37 371.12,197.68 392.05,407.74 20.93,-210.06 184.09,-378.37 392.05,-407.74 -207.98,-29.38 -371.16,-197.69 -392.06,-407.78z"
></path>
</g>
</svg>
</div>
<div class="star-3">
<svg
xmlns="http://www.w3.org/2000/svg"
xml:space="preserve"
version="1.1"
style="shape-rendering:geometricPrecision; text-rendering:geometricPrecision; image-rendering:optimizeQuality; fill-rule:evenodd; clip-rule:evenodd"
viewBox="0 0 784.11 815.53"
xmlns:xlink="http://www.w3.org/1999/xlink"
>
<defs></defs>
<g id="Layer_x0020_1">
<metadata id="CorelCorpID_0Corel-Layer"></metadata>
<path
class="fil0"
d="M392.05 0c-20.9,210.08 -184.06,378.41 -392.05,407.78 207.96,29.37 371.12,197.68 392.05,407.74 20.93,-210.06 184.09,-378.37 392.05,-407.74 -207.98,-29.38 -371.16,-197.69 -392.06,-407.78z"
></path>
</g>
</svg>
</div>
<div class="star-4">
<svg
xmlns="http://www.w3.org/2000/svg"
xml:space="preserve"
version="1.1"
style="shape-rendering:geometricPrecision; text-rendering:geometricPrecision; image-rendering:optimizeQuality; fill-rule:evenodd; clip-rule:evenodd"
viewBox="0 0 784.11 815.53"
xmlns:xlink="http://www.w3.org/1999/xlink"
>
<defs></defs>
<g id="Layer_x0020_1">
<metadata id="CorelCorpID_0Corel-Layer"></metadata>
<path
class="fil0"
d="M392.05 0c-20.9,210.08 -184.06,378.41 -392.05,407.78 207.96,29.37 371.12,197.68 392.05,407.74 20.93,-210.06 184.09,-378.37 392.05,-407.74 -207.98,-29.38 -371.16,-197.69 -392.06,-407.78z"
></path>
</g>
</svg>
</div>
<div class="star-5">
<svg
xmlns="http://www.w3.org/2000/svg"
xml:space="preserve"
version="1.1"
style="shape-rendering:geometricPrecision; text-rendering:geometricPrecision; image-rendering:optimizeQuality; fill-rule:evenodd; clip-rule:evenodd"
viewBox="0 0 784.11 815.53"
xmlns:xlink="http://www.w3.org/1999/xlink"
>
<defs></defs>
<g id="Layer_x0020_1">
<metadata id="CorelCorpID_0Corel-Layer"></metadata>
<path
class="fil0"
d="M392.05 0c-20.9,210.08 -184.06,378.41 -392.05,407.78 207.96,29.37 371.12,197.68 392.05,407.74 20.93,-210.06 184.09,-378.37 392.05,-407.74 -207.98,-29.38 -371.16,-197.69 -392.06,-407.78z"
></path>
</g>
</svg>
</div>
<div class="star-6">
<svg
xmlns="http://www.w3.org/2000/svg"
xml:space="preserve"
version="1.1"
style="shape-rendering:geometricPrecision; text-rendering:geometricPrecision; image-rendering:optimizeQuality; fill-rule:evenodd; clip-rule:evenodd"
viewBox="0 0 784.11 815.53"
xmlns:xlink="http://www.w3.org/1999/xlink"
>
<defs></defs>
<g id="Layer_x0020_1">
<metadata id="CorelCorpID_0Corel-Layer"></metadata>
<path
class="fil0"
d="M392.05 0c-20.9,210.08 -184.06,378.41 -392.05,407.78 207.96,29.37 371.12,197.68 392.05,407.74 20.93,-210.06 184.09,-378.37 392.05,-407.74 -207.98,-29.38 -371.16,-197.69 -392.06,-407.78z"
></path>
</g>
</svg>
</div>
</button>
</a>
</div>
<footer id="footer">
<ul class="social-icons"> <!-- The href tag can be updated later with the desired links -->
<li><a href="#footer" class="fa fa-linkedin"></a></li>
<li><a href="#footer" class="fa fa-twitter"></a></li>
<li><a href="#footer" class="fa fa-instagram"></a></li>
<li><a href="#footer" class="fa fa-youtube"></a></li>
</ul>
<h2>
SQUARD-LINE | Chrome Gaming
</h2>
<h3> <!-- The href tag can be updated later with the desired links -->
<a href="#footer">PRIVACY NOTICE</a> |<a href="#footer">TERMS OF SERVICE</a> |<a href="#footer">COOKIES INFO</a> |<a href="#footer">CHROME GAMING</a>
</h2>
</footer>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="https://unpkg.com/[email protected]/dist/typed.umd.js"></script>
<script>
var typed = new Typed(".auto-type",{
strings : ["A cosmic puzzle adventure awaits", " Explore the cosmos with blocky fun", "Conquer the stars in this cosmic challenge","Embark on a space odyssey like no other","Master the art of cosmic stacking","Join the cosmic adventure today"],
typeSpeed : 100,
backSpeed : 100,
loop : true
});
</script>
</body>
</html>
Loading

0 comments on commit d19f3e8

Please sign in to comment.