File size: 4,808 Bytes
26c453d b70bee7 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 |
<!DOCTYPE html>
<html lang="en">
<head>
<!-- meta tags -->
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="theme-color" content="#0A7B79" />
<!-- required -->
<link rel="icon" type="image/png" href="assets/images/sanket-logo.png">
<title>Sanket - Home</title>
<!-- page loader stuff -->
<style>
#loader {
width: 70px;
height: 70px;
animation: spin 1s linear infinite;
}
@keyframes spin {
100% {
transform: rotate(360deg);
}
}
.center {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
margin: auto;
}
</style>
<script>
// temp page redirect to actual up domain
// window.location.href = "https://sanket.key2innovation.repl.co/";
document.onreadystatechange = function() {
if (document.readyState !== "complete") {
document.querySelector(
"body").style.visibility = "hidden";
document.querySelector(
"#loader").style.visibility = "visible";
} else {
document.querySelector(
"#loader").style.display = "none";
document.querySelector(
"body").style.visibility = "visible";
}
};
</script>
<!-- custom styles -->
<link rel="stylesheet" href="style.css">
<!-- fonts-import -->
<!-- <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=Aclonica&family=Poppins:wght@400;500;600&display=swap" rel="stylesheet"> -->
<!-- icons -->
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:opsz,wght,FILL,GRAD@48,400,1,0" />
<!-- sw/pwa -->
<link rel="manifest" href="manifest.webmanifest" />
<script>
if ("serviceWorker" in navigator) {
window.addEventListener("load", () => {
navigator.serviceWorker && navigator.serviceWorker.register("sw.js");
});
}
</script>
</head>
<body>
<!-- loader -->
<img src="assets/images/sanket-logo.png" id="loader" class="center" alt="loader" srcset="">
<!-- top navbar cum header -->
<nav>
<div class="nav-cointainer">
<div class="nav-left-content-wrapper">
<h2>Welcome</h3>
<h4>@Key2Innovation</h4>
<div id="user-name-underline"></div>
</div>
<div class="nav-right-content-wrapper">
<a href="/">
<img id="user-pfp" src="assets/images/demo-pfp.png">
<span class="notification-badge"></span>
</a>
</div>
</div>
</nav>
<!-- sanket-heading -->
<div class="sanket-heading-cointainer">
<h1 id="heading">SANKET</h1>
<span id="underline"></span>
<p id="sub-heading">The Voice Of The Unheard</p>
</div>
<!-- home-option-cards -->
<div class="home-options-wrapper">
<div class="row-1">
<button class="option-card" id="translate-card">
<img src="assets/images/translate-option-btn-img.png" alt="Translate">
</button>
<button class="option-card" id="learn-card">
<img src="assets/images/learn-option-btn-img.png" alt="Learn">
</button>
</div>
<div class="row-2">
<button class="option-card" id="contribute-card">
<img src="assets/images/contribute-option-btn-img.png" alt="Contribute">
</button>
<button class="option-card" id="contact-us-card">
<img src="assets/images/contact-us-option-btn-img.png" alt="Contact Us">
</button>
</div>
</div>
<!-- bottom-nav -->
<div class="bottom-nav-bar">
<button class="nav-btn active-nav-btn" id="nav-home">
<span class="material-symbols-rounded">Home</span>
<p>Home</p>
</button>
<button class="nav-btn" id="nav-translate">
<span class="material-symbols-rounded">translate</span>
<p>Translate</p>
</button>
<button class="nav-btn" id="nav-settings">
<span class="material-symbols-rounded">settings_suggest</span>
<p>Settings</p>
</button>
</div>
<script src="app.js"></script>
</body>
</html>
|