mirror of
https://gitlab.com/skysthelimit.dev/selenite.git
synced 2025-06-15 10:12:06 -05:00
theme updates
This commit is contained in:
skysthelimitt
parent
387d25543b
commit
639553d948
@ -64,9 +64,10 @@
|
||||
<p><a href="https://github.com/js-cookie/js-cookie/">js-cookie</a>: working with cookies.</p>
|
||||
<p><a href="https://shoelace.style">Shoelace</a>: a lot of smaller styling, such as the safe mode alert</p>
|
||||
<p><a href="https://3kh0.net">3kh0</a>: a lot of games, the download/upload save feature, and the main inspiration</p>
|
||||
<p><a href="/backgrounds.html">View Background Credits</a></p>
|
||||
|
||||
<h2>Developers</h2>
|
||||
<a href="https://github.com/selenite-cc"><sl-avatar image="https://cdn.discordapp.com/avatars/1014608595263950848/fbc25e2f109d98e9f50c361342dbc4f7.webp" label="skysthelimitt"></sl-avatar> <p>Sky</p></a>
|
||||
<a href="https://github.com/skysthelimitt"><sl-avatar image="https://cdn.discordapp.com/avatars/1014608595263950848/fbc25e2f109d98e9f50c361342dbc4f7.webp" label="skysthelimitt"></sl-avatar> <p>Sky</p></a>
|
||||
|
||||
<h2>Supporters</h2>
|
||||
<a href="https://discord.com/users/731338278082445376"><sl-avatar image="https://cdn.discordapp.com/avatars/731338278082445376/1844d9f0f33f23cb385c6b412e3a6040.webp?size=80" label="skysthelimitt"></sl-avatar> <p>Caidn</p></a>
|
||||
|
||||
81
backgrounds.html
Normal file
81
backgrounds.html
Normal file
@ -0,0 +1,81 @@
|
||||
<!DOCTYPE html>
|
||||
<html class="sl-theme-dark" lang="en">
|
||||
<head>
|
||||
<!-- initialize theme vars
|
||||
https://coolors.co/10002b-240046-3c096c-5a189a-7b2cbf-9d4edd-c77dff-e0aaff -->
|
||||
|
||||
<!-- initialize externals -->
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
|
||||
<script src=" https://cdn.jsdelivr.net/npm/js-cookie@3.0.5/dist/js.cookie.min.js "></script>
|
||||
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@shoelace-style/shoelace@2.9.0/cdn/themes/dark.css" />
|
||||
<script type="module" src="https://cdn.jsdelivr.net/npm/@shoelace-style/shoelace@2.9.0/cdn/shoelace-autoloader.js"></script>
|
||||
|
||||
|
||||
|
||||
<!-- initialize my stuff -->
|
||||
<script src="/js/themes.js"></script>
|
||||
<script src="/js/all.js"></script>
|
||||
<script src="/js/main.js"></script>
|
||||
<link rel="stylesheet" href="/themes.css" />
|
||||
<link rel="stylesheet" href="/style.css" />
|
||||
|
||||
|
||||
|
||||
|
||||
<!-- seo + other things -->
|
||||
<title>Selenite</title>
|
||||
<link rel="icon" href="/favicon.ico" />
|
||||
<meta
|
||||
name="keywords"
|
||||
content="front-end web developer, unblocked, games, google sites, unblocked games mom, ublocked, code, coding, programmer, development, javascript, jquery, bootstrap, sass, less, git, gaming, internet, website, best, site, cool, free games"
|
||||
/>
|
||||
<meta property="og:title" content="Welcome to Selenite." />
|
||||
<meta property="og:site_name" content="https://selenite.cc" />
|
||||
<meta
|
||||
property="og:description"
|
||||
content="Welcome to the one and only option for unblocked games. Welcome to Selenite."
|
||||
/>
|
||||
<meta
|
||||
name="description"
|
||||
content="Welcome to the one and only option for unblocked games. Welcome to Selenite."
|
||||
/>
|
||||
<meta name="author" content="Website Creator" />
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1" />
|
||||
|
||||
<!-- toastify -->
|
||||
<script>
|
||||
</script>
|
||||
</head>
|
||||
<alerts>
|
||||
|
||||
</alerts>
|
||||
<body>
|
||||
<header>
|
||||
<a href="/index.html">Home</a>
|
||||
<a href="/bookmarklets.html">Bookmarklets</a>
|
||||
<a href="/projects.html">Games</a>
|
||||
<a href="/settings.html">Settings</a>
|
||||
<a href="/support.html">Support</a>
|
||||
<a href="/blank.html">Open Blank</a>
|
||||
<a href="/about.html">About</a>
|
||||
</header>
|
||||
<main id="main">
|
||||
<img src="themebgs/sunset_theme.jpg" class="img-credits">
|
||||
<a href="https://www.pixiv.net/en/users/10746425">邦乔彦</a>
|
||||
<img src="themebgs/mountains_theme.jpg" class="img-credits">
|
||||
<a href="https://www.mattvince.com/">Matt Vince</a>
|
||||
</main>
|
||||
|
||||
<footer>
|
||||
<a href="https://github.com/selenite-cc/Selenite">Source Code</a>
|
||||
<a id="panicmode">Panic Mode</a>
|
||||
<a href="/transfer.html">Transfer your data</a>
|
||||
<a href="/suggest.html">Bug Reports</a>
|
||||
<a href="https://discord.gg/7jyufnwJNf">Discord</a>
|
||||
<a href="/suggest.html">Suggestions</a>
|
||||
<a href="/contact.html">Contact</a>
|
||||
</footer>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@ -56,7 +56,7 @@
|
||||
</script>
|
||||
</head>
|
||||
<alerts>
|
||||
<sl-dialog label="Welcome to Selenite!" class="dialog-width" style="--width: 60vw;">
|
||||
<sl-dialog label="Welcome to Selenite!" class="dialog-width" style="--width: 60vw;display:none;">
|
||||
Thank you for choosing Selenite! You will be able to play over 140 high quality games, and we have many tools to make your experience better.
|
||||
<br>
|
||||
Wanting to transfer your data from another website? Try the transfer utility in the footer!
|
||||
|
||||
@ -31,7 +31,7 @@ function clearCloak() {
|
||||
document.cookie = "tabname=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;";
|
||||
var link = document.querySelector("link[rel~='icon']");
|
||||
link.remove();
|
||||
document.title = "Tab Cloak | e-gamepass";
|
||||
document.title = "Settings | Selenite";
|
||||
link = document.createElement("link");
|
||||
link.rel = "icon";
|
||||
document.head.appendChild(link);
|
||||
|
||||
31
js/main.js
31
js/main.js
@ -14,11 +14,31 @@ function check() {
|
||||
}
|
||||
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
if (localStorage.getItem("theme")) {
|
||||
document.body.setAttribute("theme", localStorage.getItem("theme"));
|
||||
const iconSetting = document.querySelector("input#discordIcon");
|
||||
if(localStorage.getItem("theme")) {
|
||||
localStorage.setItem("selenite.theme", localStorage.getItem("theme"));
|
||||
localStorage.removeItem("theme");
|
||||
}
|
||||
if (localStorage.getItem("selenite.theme")) {
|
||||
document.body.setAttribute("theme", localStorage.getItem("selenite.theme"));
|
||||
} else {
|
||||
document.body.setAttribute("theme", "main");
|
||||
}
|
||||
if(document.querySelector("widgetbot-crate")) {
|
||||
if(localStorage.getItem("selenite.discordIcon") == "true") {
|
||||
const widget = document.querySelector("widgetbot-crate");
|
||||
widget.setAttribute("style", "display:none");
|
||||
}
|
||||
}
|
||||
if(document.querySelector("input#discordIcon")) {
|
||||
if(localStorage.getItem("selenite.discordIcon") == "true") {
|
||||
iconSetting.checked = true;
|
||||
}
|
||||
iconSetting.addEventListener("click", () => {
|
||||
localStorage.setItem("selenite.discordIcon", iconSetting.checked)
|
||||
});
|
||||
}
|
||||
|
||||
check();
|
||||
checkAlert();
|
||||
});
|
||||
@ -29,6 +49,7 @@ function checkAlert() {
|
||||
const openButton = dialog.nextElementSibling;
|
||||
const closeButton = dialog.querySelector('sl-button[slot="footer"]');
|
||||
setTimeout(() => {
|
||||
dialog.removeAttribute("display");
|
||||
dialog.show();
|
||||
}, 250)
|
||||
closeButton.addEventListener('click', () => dialog.hide());
|
||||
@ -50,7 +71,7 @@ function copyToClipboard(text) {
|
||||
}
|
||||
|
||||
function setTheme(theme) {
|
||||
localStorage.setItem("theme", theme);
|
||||
localStorage.setItem("selenite.theme", theme);
|
||||
document.body.setAttribute("theme", theme);
|
||||
}
|
||||
function setPanicMode() {
|
||||
@ -60,3 +81,7 @@ function setPanicMode() {
|
||||
}
|
||||
document.cookie = "panicurl=" + $("#panic").val();
|
||||
}
|
||||
function customTheme() {
|
||||
const customMenu = document.querySelector('#customMenu');
|
||||
customMenu.removeAttribute("display");
|
||||
}
|
||||
@ -63,7 +63,7 @@
|
||||
<h3>Website Name</h3>
|
||||
<input type="text" id="webname" name="webname" placeholder="Selenite" /><br />
|
||||
<h3>Website Icon</h3>
|
||||
<input type="text" id="webicon" name="webicon" placeholder="https://selenite.pages.dev/" /><br />
|
||||
<input type="text" id="webicon" name="webicon" placeholder="https://selenite.cc/" /><br />
|
||||
<h3>Or select a preset:</h3>
|
||||
<select id="presetCloaks">
|
||||
<option value="google">Google</option>
|
||||
@ -77,13 +77,25 @@
|
||||
</form>
|
||||
<button onclick="javascript:clearCloak();">Clear your current tab cloak</button>
|
||||
<br />
|
||||
<div class="samerow">
|
||||
<input type="checkbox" id="discordIcon" name="discordIcon">
|
||||
<label for="discordIcon">Disable Discord Icon</label><br>
|
||||
</div>
|
||||
<h3>Themes</h3>
|
||||
<div class="samerow themebtns">
|
||||
<button onclick="setTheme('main')" style="background-color: #3c096c; color: #fff; border: 5px solid #5a189a">Selenite</button>
|
||||
<button onclick="setTheme('light')" style="background-color: #bbbbbb; color: #1a1a1a; border: 5px solid #e6e6e6">Light Mode</button>
|
||||
<button onclick="setTheme('dark')" style="background-color: #333333; color: #fff; border: 5px solid #444444">Dark Mode</button>
|
||||
<button onclick="setTheme('main')" style="background-color: #3c096c; color: #fff; border: 5px solid #5a189a">selenite</button>
|
||||
<button onclick="setTheme('light')" style="background-color: #bbbbbb; color: #1a1a1a; border: 5px solid #e6e6e6">light mode</button>
|
||||
<button onclick="setTheme('dark')" style="background-color: #333333; color: #fff; border: 5px solid #444444">dark mode</button>
|
||||
<button onclick="setTheme('egamepass')" style="background-color: #596eb1; color: #cbe0ff; border: 5px solid #5586e0">e-gamepass</button>
|
||||
<button onclick="setTheme('cools1te')" style="background-color: #a134dc; color: #d3a4fa; border: 5px solid #b153e3">cools1te</button>
|
||||
<button onclick="setTheme('sunset')" style="background-color: #537294; color: #fff; border: 5px solid #30719c">sunset</button>
|
||||
<button onclick="setTheme('mountains')" style="background-color: #d37f7f; color: #fff; border: 5px solid #e28a8a">mountains</button>
|
||||
<!-- <button onclick="customTheme()">custom</button>
|
||||
one day ill add this.. maybe -->
|
||||
</div>
|
||||
<div id="customMenu" style="display: none;">
|
||||
<p>Input Background Colors</p>
|
||||
<input type="color" id="inputbg" value="var(--uibg)" />
|
||||
</div>
|
||||
<br />
|
||||
<form action="javascript:setPanicMode();">
|
||||
|
||||
23
style.css
23
style.css
@ -21,8 +21,12 @@
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
background-color: var(--bg);
|
||||
background: var(--bg);
|
||||
color: var(--textcolor);
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
background-attachment: fixed;
|
||||
}
|
||||
header,
|
||||
footer {
|
||||
@ -78,16 +82,16 @@ main {
|
||||
main#main.noscroll {
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
p,
|
||||
a {
|
||||
a,
|
||||
label {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
text-shadow: var(--shadow);
|
||||
}
|
||||
|
||||
.samerow {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
@ -273,4 +277,15 @@ sl-icon-button {
|
||||
|
||||
h3#gametitle {
|
||||
font-size: 2rem;
|
||||
}
|
||||
|
||||
.img-credits {
|
||||
height: 40vh;
|
||||
width: auto;
|
||||
box-shadow: 0px 0px 20px rgba(255, 255, 255, 0.555)
|
||||
}
|
||||
|
||||
label {
|
||||
font-size: 20px;
|
||||
padding-left: 5px;
|
||||
}
|
||||
18
themes.css
18
themes.css
@ -39,4 +39,22 @@ body[theme=cools1te] {
|
||||
--uibg: #ab28cf;
|
||||
--textcolor: #d3a4fa;
|
||||
--bg: #8e14af;
|
||||
}
|
||||
body[theme=sunset] {
|
||||
--inputbg: #537294;
|
||||
--inputborder: #30719c;
|
||||
--uibg: #2a7491;
|
||||
--textcolor: #fff;
|
||||
--bg: url("themebgs/sunset_theme.jpg"), rgb(59, 67, 78);
|
||||
/* https://wallhaven.cc/w/jxl3qp */
|
||||
--shadow: 0px 0px 2px #a5dcf5;
|
||||
}
|
||||
body[theme=mountains] {
|
||||
--inputbg: #d37f7f;
|
||||
--inputborder: #e28a8a;
|
||||
--uibg: #d38493;
|
||||
--textcolor: #fff;
|
||||
--bg: url("themebgs/mountains_theme.jpg"), #bf7483;
|
||||
/* https://wallhaven.cc/w/l82kpr */
|
||||
--shadow: 0px 0px 3px #88726c;
|
||||
}
|
||||
Loading…
x
Reference in New Issue
Block a user