finish up profiles, begin custom songs
This commit is contained in:
@ -30,3 +30,21 @@
|
||||
#infobox h2 {
|
||||
margin-right: auto;
|
||||
}
|
||||
.button {
|
||||
margin: 4px;
|
||||
padding: 2px;
|
||||
width: 7%;
|
||||
transition-duration: 0.25s;
|
||||
}
|
||||
.button:hover {
|
||||
filter: brightness(1.1);
|
||||
transform: scale(1.05);
|
||||
}
|
||||
.opposite {
|
||||
width: 50%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
margin: 12px;
|
||||
}
|
93
css/profile.css
Normal file
93
css/profile.css
Normal file
@ -0,0 +1,93 @@
|
||||
section {
|
||||
width: 90%;
|
||||
height: 240px;
|
||||
margin: 24px;
|
||||
background-color: color-mix(in srgb, var(--color-2) 40%, #00000000 60%);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
box-shadow: 0 0 10px var(--color-2);
|
||||
border-radius: 20px;
|
||||
backdrop-filter: blur(6px);
|
||||
}
|
||||
.controls {
|
||||
width: 48px !important;
|
||||
margin: 8px !important;
|
||||
cursor: pointer;
|
||||
}
|
||||
section img {
|
||||
height: 90%;
|
||||
aspect-ratio: 1 / 1;
|
||||
margin: 32px;
|
||||
border-radius: 16px;
|
||||
}
|
||||
.column {
|
||||
flex-direction: column;
|
||||
}
|
||||
right {
|
||||
margin-left: auto;
|
||||
margin-right: 16px;
|
||||
}
|
||||
.badges img {
|
||||
width: 32px;
|
||||
border-radius: 2px;
|
||||
margin: 8px;
|
||||
}
|
||||
p {
|
||||
font-size: 24px;
|
||||
letter-spacing: 0.5px;
|
||||
line-height: 36px;
|
||||
}
|
||||
div {
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
#enter {
|
||||
position: absolute;
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
background-color: color-mix(in srgb, #000000 60%, #00000000 40%);
|
||||
backdrop-filter: blur(16px);
|
||||
z-index: 9999999999;
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
transition-duration: 1s;
|
||||
}
|
||||
#edit {
|
||||
width: 48px;
|
||||
cursor: pointer;
|
||||
}
|
||||
#search {
|
||||
height: 36px !important;
|
||||
}
|
||||
results {
|
||||
display: flex;
|
||||
width: 95%;
|
||||
height: 120px;
|
||||
overflow-y: scroll;
|
||||
background-color: var(--color-4);
|
||||
bottom: 16px;
|
||||
flex-direction: column;
|
||||
}
|
||||
result {
|
||||
border-color: white;
|
||||
border-width: 4px;
|
||||
cursor: pointer;
|
||||
padding: 4px;
|
||||
margin: 2px;
|
||||
width: auto;
|
||||
text-align: left;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
result h2 {
|
||||
font-size: 16px;
|
||||
margin: 0px;
|
||||
}
|
||||
result p {
|
||||
font-size: 12px;
|
||||
margin: 0px;
|
||||
}
|
1
img/fullscreen.svg
Normal file
1
img/fullscreen.svg
Normal file
@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#e3e3e3"><path d="M120-120v-200h80v120h120v80H120Zm520 0v-80h120v-120h80v200H640ZM120-640v-200h200v80H200v120h-80Zm640 0v-120H640v-80h200v200h-80Z"/></svg>
|
After Width: | Height: | Size: 253 B |
1
img/fullscreen_exit.svg
Normal file
1
img/fullscreen_exit.svg
Normal file
@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#e3e3e3"><path d="M240-120v-120H120v-80h200v200h-80Zm400 0v-200h200v80H720v120h-80ZM120-640v-80h120v-120h80v200H120Zm520 0v-200h80v120h120v80H640Z"/></svg>
|
After Width: | Height: | Size: 253 B |
1
img/muted.svg
Normal file
1
img/muted.svg
Normal file
@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#e8eaed"><path d="M792-56 671-177q-25 16-53 27.5T560-131v-82q14-5 27.5-10t25.5-12L480-368v208L280-360H120v-240h128L56-792l56-56 736 736-56 56Zm-8-232-58-58q17-31 25.5-65t8.5-70q0-94-55-168T560-749v-82q124 28 202 125.5T840-481q0 53-14.5 102T784-288ZM650-422l-90-90v-130q47 22 73.5 66t26.5 96q0 15-2.5 29.5T650-422ZM480-592 376-696l104-104v208Zm-80 238v-94l-72-72H200v80h114l86 86Zm-36-130Z"/></svg>
|
After Width: | Height: | Size: 495 B |
1
img/pause.svg
Normal file
1
img/pause.svg
Normal file
@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#e8eaed"><path d="M520-200v-560h240v560H520Zm-320 0v-560h240v560H200Zm400-80h80v-400h-80v400Zm-320 0h80v-400h-80v400Zm0-400v400-400Zm320 0v400-400Z"/></svg>
|
After Width: | Height: | Size: 254 B |
1
img/play.svg
Normal file
1
img/play.svg
Normal file
@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#e8eaed"><path d="M320-200v-560l440 280-440 280Zm80-280Zm0 134 210-134-210-134v268Z"/></svg>
|
After Width: | Height: | Size: 190 B |
1
img/volume.svg
Normal file
1
img/volume.svg
Normal file
@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#e8eaed"><path d="M560-131v-82q90-26 145-100t55-168q0-94-55-168T560-749v-82q124 28 202 125.5T840-481q0 127-78 224.5T560-131ZM120-360v-240h160l200-200v640L280-360H120Zm440 40v-322q47 22 73.5 66t26.5 96q0 51-26.5 94.5T560-320ZM400-606l-86 86H200v80h114l86 86v-252ZM300-480Z"/></svg>
|
After Width: | Height: | Size: 378 B |
@ -108,7 +108,7 @@ function starEvent(e) {
|
||||
let newElement = element.cloneNode(true);
|
||||
document.getElementById("starredgames").appendChild(newElement);
|
||||
newElement.addEventListener("click", ()=>{
|
||||
location.href=`/loader.html?title=${encodeURIComponent(element.name)}&dir=${element.directory}&img=${element.image}`
|
||||
location.href=`/loader.html?title=${newElement.childNodes[1].childNodes[0].innerText}&dir=${newElement.getAttribute("data-target")}&img=${newElement.getAttribute("data-image")}`
|
||||
});
|
||||
})
|
||||
} else {
|
||||
@ -128,7 +128,7 @@ function starEvent(e) {
|
||||
let newElement = element.cloneNode(true);
|
||||
document.getElementById("starredgames").appendChild(newElement);
|
||||
newElement.addEventListener("click", ()=>{
|
||||
location.href=`/loader.html?title=${encodeURIComponent(element.name)}&dir=${element.directory}&img=${element.image}`
|
||||
location.href=`/loader.html?title=${newElement.childNodes[1].childNodes[0].innerText}&dir=${newElement.getAttribute("data-target")}&img=${newElement.getAttribute("data-image")}`
|
||||
});
|
||||
})
|
||||
}
|
||||
|
@ -12,7 +12,7 @@ function loadPJS() {
|
||||
script.src = "https://cdn.jsdelivr.net/particles.js/2.0.0/particles.min.js";
|
||||
document.head.appendChild(script);
|
||||
script.addEventListener("load", ()=>{
|
||||
particlesJS.load('particles-js', "js/particlesjs-config.json", ()=>{});
|
||||
particlesJS.load('particles-js', "/js/particlesjs-config.json", ()=>{});
|
||||
});
|
||||
}
|
||||
|
||||
|
69
profile.html
Executable file
69
profile.html
Executable file
@ -0,0 +1,69 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<!-- initialize theme vars
|
||||
https://coolors.co/10002b-240046-3c096c-5a189a-7b2cbf-9d4edd-c77dff-e0aaff -->
|
||||
|
||||
<!-- initialize externals -->
|
||||
<meta property="og:title" content="Selenite" />
|
||||
<meta property="description" content="Selenite is the best unblocked games site. With over 400 games and an account system, no other websites come close to Selenite." />
|
||||
<meta name="keywords" content="proxy, web proxy, unblock websites, unblock chromebook, free web proxy, proxy list, proxy sites, un block chromebook, online proxy, proxy server, proxysite, proxy youtube, bypass securly, bypass iboss, bypass lightspeed filter, chromebooks, unblock youtube, youtube proxy, unblocked youtube, youtube unblocked, unblock games, selenite, unblocked games, free games">
|
||||
<meta content="/favicon.png" property="og:image" />
|
||||
<meta content="#c77dff" data-react-helmet="true" name="theme-color" />
|
||||
<meta name="googlebot" content="index, follow, snippet" />
|
||||
<link rel="canonical" href="https://selenite.cc/" />
|
||||
<meta property="og:description" content="Selenite is the best unblocked games site. With over 400 games and an account system, no other websites come close to Selenite." />
|
||||
<meta property="og:title" content="Selenite">
|
||||
<meta property="og:type" content="website">
|
||||
|
||||
<script type="application/ld+json">
|
||||
{
|
||||
"@context": "https://schema.org",
|
||||
"@type": "Organization",
|
||||
"name": "Selenite",
|
||||
"alternateName": "selenite.cc",
|
||||
"url": "https://selenite.cc",
|
||||
"logo": "https://selenite.cc/favicon.png",
|
||||
"sameAs": [
|
||||
"https://github.com/selenite-cc",
|
||||
"https://youtube.com/@selenitecc",
|
||||
"https://tiktok.com/@selenitecc",
|
||||
"https://selenite.cc",
|
||||
]
|
||||
}
|
||||
</script>
|
||||
|
||||
<!-- initialize my stuff -->
|
||||
<script src="/js/all.js"></script>
|
||||
<script src="/js/main.js"></script>
|
||||
<!-- <script src="/js/widget.js"></script> -->
|
||||
|
||||
<link rel="stylesheet" href="/css/main.css" />
|
||||
<link rel="stylesheet" href="/css/pages.css" />
|
||||
<link rel="stylesheet" href="/css/profile.css" />
|
||||
<link rel="manifest" href="/manifest.json" />
|
||||
<!-- seo + other things -->
|
||||
<title>{{ name }}'s Profile | Selenite</title>
|
||||
<link rel="icon" href="/favicon.ico" />
|
||||
<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-3415518411898563" crossorigin="anonymous"></script>
|
||||
</head>
|
||||
<alerts> </alerts>
|
||||
<body>
|
||||
<section>
|
||||
<img src="{{ user_pfp }}" class="pfp" />
|
||||
<div>
|
||||
<h1>{{ name }}</h1>
|
||||
<p>/u/{{ username }}</p>
|
||||
<div class="badges">{{ badges }}</div>
|
||||
</div>
|
||||
<right>
|
||||
<h2>Joined {{ join_date }}</h2>
|
||||
<h2>Last online {{ online_time }}</h2>
|
||||
</right>
|
||||
</section>
|
||||
<section class="column">
|
||||
<h1>About Me</h1>
|
||||
<p>{{ about }}</p>
|
||||
</section>
|
||||
</body>
|
||||
</html>
|
@ -12,7 +12,6 @@
|
||||
<script src="/js/games.js"></script>
|
||||
<script src="/js/search.js"></script>
|
||||
<script src="/js/main.js"></script>
|
||||
<script src="/js/widget.js"></script>
|
||||
<script src="/js/themes.js"></script>
|
||||
<script src="/js/cookie.js"></script>
|
||||
|
||||
@ -34,23 +33,6 @@
|
||||
<script></script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="particles-js"></div>
|
||||
<!-- <input class="hiddenUpload" type="file" accept=".save" hidden /> -->
|
||||
<!-- -->
|
||||
<!-- <div class="samerow"> -->
|
||||
<!-- <button onclick="downloadMainSave()">Download Save</button> -->
|
||||
<!-- <button id="upload" onclick="uploadMainSave()">Upload Save</button> -->
|
||||
<!-- </div> -->
|
||||
<!-- <div class="samerow"> -->
|
||||
<!-- <button id="random" onclick="selectRandomGame()">Play a random game!</button> -->
|
||||
<!-- <button id="category" onclick="categoryChanger()">Game Categories</button> -->
|
||||
<!-- </div> -->
|
||||
<!-- -->
|
||||
<!-- <h2>Starred Games</h2> -->
|
||||
<!-- <p id="pinnedmessage">Star some games for things to show up here!</p>
|
||||
<div id="pinned"></div> -->
|
||||
|
||||
<!-- <h2>All Games</h2> -->
|
||||
<input type="text" class="searchbar" id="gamesearch" placeholder="Type here to search.." />
|
||||
<p id="starredHeader">starred games</p>
|
||||
<div id="starredgames">
|
||||
|
Reference in New Issue
Block a user