A Startpage inspired by TB-96's Evening Startpage and Tobias-Schoch's startpage-wave. https://start.yandols.xyz
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
Startpage-Composite/index.html

181 lines
8.0 KiB

<!doctype html>
<!--
*
* Yandols' Startpage
* Inspired by https://github.com/TB-96/Evening-Startpage and https://github.com/Tobias-Schoch/startpage-wave
* Uses additional scripts such as Unsplash Source for daily wallpaper change (https://source.unsplash.com/)
*
-->
<html lang="en">
<head>
<title>Startpage</title>
<meta charset="utf-8"/>
<meta name="viewport" content="width=device-width, initial-scale=0.4">
<meta name="description" content="A composite startpage made by YandolsZX.">
<link rel="apple-touch-icon" sizes="180x180" href="./assets/img/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="./assets/img/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="./assets/img/favicon-16x16.png">
<link rel="manifest" href="./assets/img/site.webmanifest">
<link rel="mask-icon" href="./assets/img/safari-pinned-tab.svg" color="#212121">
<link rel="shortcut icon" href="./assets/img/favicon.ico">
<meta name="msapplication-TileColor" content="#212121">
<meta name="msapplication-config" content="./assets/img/browserconfig.xml">
<meta name="theme-color" content="#212121">
<link type="text/css" rel="stylesheet" href="./assets/css/style.css" media="screen, projection"/>
<link type="text/css" rel="stylesheet" href="./assets/css/searcher.css" media="screen, projection"/>
<!--<link type="text/css" rel="stylesheet" href="./assets/css/wave.css" media="screen, projection"/>-->
<script src="./assets/js/iconify.js" type="text/javascript"></script>
<script src="./assets/js/jquery.js" type="text/javascript"></script>
<link href="https://fonts.googleapis.com/css?family=Open+Sans" rel="stylesheet">
</head>
<body>
<main id="container" class="fade">
<section id="header">
<h1 id="header-time">00:00</h1>
<h2 id="header-date">Retrieving Datetime</h2>
<form method="GET" action="https://www.google.com/search">
<input name="as_q" class="search-field" autocomplete="off" placeholder="Type here to search on Google" autofocus>
<button type="submit" class="search-submit" value="" aria-label="Submit Search" style="fill: white"></button>
</form>
<div class="randompic"> </div>
</section>
<section id="apps">
<h3>> Mainstream Websites</h3>
<div id="apps-container">
<a id="link" class="apps-item" href="https://www.reddit.com/" rel="noopener noreferrer">
<div class="apps-icon">
<span class="iconify icon" data-icon="mdi-reddit"></span>
</div>
<div class="apps-text">
<span>Reddit</span>
<span>reddit.com</span>
</div>
</a>
<a id="link" class="apps-item" href="https://twitter.com/" rel="noopener noreferrer">
<div class="apps-icon">
<span class="iconify icon" data-icon="mdi-twitter"></span>
</div>
<div class="apps-text">
<span>Twitter</span>
<span>twitter.com</span>
</div>
</a>
<a id="link" class="apps-item" href="https://boards.4channel.org/" rel="noopener noreferrer">
<div class="apps-icon">
<span class="iconify icon" data-icon="mdi-clover"></span>
</div>
<div class="apps-text">
<span>4chan</span>
<span>boards.4channel.org</span>
</div>
</a>
<a id="link" class="apps-item" href="https://store.steampowered.com/" rel="noopener noreferrer">
<div class="apps-icon">
<span class="iconify icon" data-icon="mdi-steam"></span>
</div>
<div class="apps-text">
<span>Steam Store</span>
<span>store.steampowered.com</span>
</div>
</a>
<a id="link" class="apps-item" href="https://www.youtube.com/" rel="noopener noreferrer">
<div class="apps-icon">
<span class="iconify icon" data-icon="mdi-youtube"></span>
</div>
<div class="apps-text">
<span>Youtube</span>
<span>youtube.com</span>
</div>
</a>
<a id="link" class="apps-item" href="https://www.twitch.tv/" rel="noopener noreferrer">
<div class="apps-icon">
<span class="iconify icon" data-icon="mdi-twitch"></span>
</div>
<div class="apps-text">
<span>Twitch</span>
<span>twitch.tv</span>
</div>
</a>
<a id="link" class="apps-item" href="https://mail.google.com" rel="noopener noreferrer">
<div class="apps-icon">
<span class="iconify icon" data-icon="mdi-gmail"></span>
</div>
<div class="apps-text">
<span>Gmail</span>
<span>gmail.com</span>
</div>
</a>
<a id="link" class="apps-item" href="https://github.com/" rel="noopener noreferrer">
<div class="apps-icon">
<span class="iconify icon" data-icon="mdi-github"></span>
</div>
<div class="apps-text">
<span>GitHub</span>
<span>github.com</span>
</div>
</a>
</div>
</section>
<section id="links">
<a id="togglebookmarks"><h3>> More Websites</h3></a>
<div id="links-container">
<div class="links-item">
<h4>Services by Yandols</h4>
<a id="link" href="https://imeji.yandols.xyz/">Imeji</a>
<a id="link" href="https://git.yandols.xyz/">GitArea</a>
<a id="link" href="https://bin.yandols.xyz/">YandBin</a>
</div>
<div class="links-item">
<h4>Stories & Comics Sites</h4>
<a id="link" href="https://www.webnovel.com/" rel="noopener noreferrer">Webnovel</a>
<a id="link" href="https://tapas.io/" rel="noopener noreferrer">Tapastic</a>
<a id="link" href="https://www.webtoons.com/en/" rel="noopener noreferrer">LINE Webtoons</a>
<a id="link" href="https://kemono.cafe/" rel="noopener noreferrer">Kemono Cafe</a>
<!-- <a id="link" href="https://studiokhimera.com/" rel="noopener noreferrer">Studio Khimera</a> -->
</div>
<div class="links-item">
<h4>Art Sites</h4>
<a id="link" href="https://deviantart.com/" rel="noopener noreferrer">DeviantArt</a>
<a id="link" href="https://pixiv.net/" rel="noopener noreferrer">Pixiv</a>
<a id="link" href="https://www.artstation.com/" rel="noopener noreferrer">Artstation</a>
<a id="link" href="https://cgsociety.org/" rel="noopener noreferrer">CGSociety</a>
</div>
<div class="links-item">
<h4>News Sites</h4>
<a id="link" href="https://news.google.com/" rel="noopener noreferrer">Google News</a>
<a id="link" href="https://www.thestar.co.uk/" rel="noopener noreferrer">The Star (UK)</a>
<a id="link" href="https://arstechnica.com/" rel="noopener noreferrer">Ars Technica</a>
<a id="link" href="https://lowyat.net/" rel="noopener noreferrer">Lowyat</a>
</div>
<div id="hiddenbookmarks" style="display: none;">
<div class="links-item">
<h4>Other Stuff</h4>
<a id="link" href="https://google.com/" rel="noopener noreferrer">Placeholder</a>
<a id="link" href="https://google.com/" rel="noopener noreferrer">Placeholder</a>
<a id="link" href="https://google.com/" rel="noopener noreferrer">Placeholder</a>
</div>
</div>
</div>
</section>
<section id="footer">
<h5></h5>
<h5>Any searches made are not logged, all queries are sent directly to Google.</h5>
<h5>Daily randomized backgrounds (when available) are provided for free by <a href="https://unsplash.com">Unsplash</a>.</h5>
<h5></h5>
<h5>Copyright © 2020 YandolsZX, Locaria Technologies.</h5>
</section>
</main>
<div class="wave-container">
<div class="wave wave1"></div>
<div class="wave wave2"></div>
<div class="wave wave3"></div>
<div class="wave wave4"></div>
</div>
<script src="./assets/js/script.js" type="text/javascript"></script>
</body>
</html>