mirror of
https://codeberg.org/ashley/poke.git
synced 2024-11-10 10:58:25 +01:00
Merge pull request 'Update Gradient Background (Landing Page)' (#64) from Korbs/poketube:main into main
Reviewed-on: https://codeberg.org/ashley/poke/pulls/64
This commit is contained in:
commit
5b75ff995b
6 changed files with 166 additions and 117 deletions
BIN
css/bg-480.webm
Normal file
BIN
css/bg-480.webm
Normal file
Binary file not shown.
BIN
css/bg-720.webm
Normal file
BIN
css/bg-720.webm
Normal file
Binary file not shown.
BIN
css/bg-full.webm
Normal file
BIN
css/bg-full.webm
Normal file
Binary file not shown.
|
@ -1,5 +1,3 @@
|
||||||
|
|
||||||
|
|
||||||
/* cyrillic */
|
/* cyrillic */
|
||||||
@font-face {
|
@font-face {
|
||||||
font-family: "Ubuntu";
|
font-family: "Ubuntu";
|
||||||
|
@ -691,6 +689,7 @@ html {
|
||||||
}
|
}
|
||||||
|
|
||||||
body {
|
body {
|
||||||
|
background-color: #250717;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
font-family: ubuntu, sans-serif;
|
font-family: ubuntu, sans-serif;
|
||||||
margin: auto;
|
margin: auto;
|
||||||
|
@ -700,9 +699,6 @@ body {
|
||||||
min-height: 100vh;
|
min-height: 100vh;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
justify-content: flex-start;
|
justify-content: flex-start;
|
||||||
background-image: radial-gradient(circle, #231638, #2b160e, #09250e, #0f132b);
|
|
||||||
animation: gradient 64s ease infinite;
|
|
||||||
background-size: 400% 400%;
|
|
||||||
}
|
}
|
||||||
body {cursor: url('/static/cursor.ico'), default}
|
body {cursor: url('/static/cursor.ico'), default}
|
||||||
|
|
||||||
|
@ -717,17 +713,6 @@ span > a,
|
||||||
li > a {cursor: url('/static/cursor-pointer.ico'), pointer}
|
li > a {cursor: url('/static/cursor-pointer.ico'), pointer}
|
||||||
.btn {cursor: url('/static/cursor-pointer.ico'), pointer !important}
|
.btn {cursor: url('/static/cursor-pointer.ico'), pointer !important}
|
||||||
|
|
||||||
@keyframes gradient {
|
|
||||||
0% {
|
|
||||||
background-position: 0 50%;
|
|
||||||
}
|
|
||||||
50% {
|
|
||||||
background-position: 100% 50%;
|
|
||||||
}
|
|
||||||
100% {
|
|
||||||
background-position: 0 50%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@font-face {
|
@font-face {
|
||||||
font-family: "PokeTube Flex";
|
font-family: "PokeTube Flex";
|
||||||
src: url("https://p.poketube.fun/https://cdn.glitch.global/43b6691a-c8db-41d4-921c-8cf6aa0d9108/robotoflex.ttf?v=16683434286881");
|
src: url("https://p.poketube.fun/https://cdn.glitch.global/43b6691a-c8db-41d4-921c-8cf6aa0d9108/robotoflex.ttf?v=16683434286881");
|
||||||
|
@ -896,3 +881,28 @@ button[type="submit"]:hover {
|
||||||
margin: auto;
|
margin: auto;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
video {
|
||||||
|
position: fixed;
|
||||||
|
top: 0px;
|
||||||
|
left: 0px;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
object-fit: cover;
|
||||||
|
z-index: -1;
|
||||||
|
opacity: 0.2;
|
||||||
|
pointer-events: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
@media screen and (max-width: 1919px) {
|
||||||
|
#HD-BG {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media screen and (min-width: 1920px) {
|
||||||
|
#SD-BG {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
|
@ -20,7 +20,8 @@
|
||||||
--->
|
--->
|
||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html lang="en">
|
<html lang="en">
|
||||||
<head>
|
|
||||||
|
<head>
|
||||||
<title>Poke | The Ultimate Privacy App!</title>
|
<title>Poke | The Ultimate Privacy App!</title>
|
||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8">
|
||||||
<meta name="theme-color" content="#414161">
|
<meta name="theme-color" content="#414161">
|
||||||
|
@ -32,27 +33,32 @@
|
||||||
<link rel="manifest" href="/manifest.json">
|
<link rel="manifest" href="/manifest.json">
|
||||||
<meta name="darkreader-lock"> <!-- tells dark reader that the site has a dark theme and to turn itself off -->
|
<meta name="darkreader-lock"> <!-- tells dark reader that the site has a dark theme and to turn itself off -->
|
||||||
<meta content="▶▶ Poke - The Ultimate privacy App!" property=og:title>
|
<meta content="▶▶ Poke - The Ultimate privacy App!" property=og:title>
|
||||||
<meta content="Watch Silly videos or search the interwebs while being anonymous on poke!" property=twitter:description>
|
<meta content="Watch Silly videos or search the interwebs while being anonymous on poke!"
|
||||||
<meta content="https://cdn.glitch.global/d68d17bb-f2c0-4bc3-993f-50902734f652/aa70111e-5bcd-4379-8b23-332a33012b78.image.png?v=1701898829884" property="og:image" />
|
property=twitter:description>
|
||||||
|
<meta
|
||||||
|
content="https://cdn.glitch.global/d68d17bb-f2c0-4bc3-993f-50902734f652/aa70111e-5bcd-4379-8b23-332a33012b78.image.png?v=1701898829884"
|
||||||
|
property="og:image" />
|
||||||
<meta content="summary_large_image" name="twitter:card" />
|
<meta content="summary_large_image" name="twitter:card" />
|
||||||
<% if(isOldWindows) { %>
|
<% if(isOldWindows) { %>
|
||||||
<style>
|
<style>
|
||||||
@font-face {
|
@font-face {
|
||||||
font-family: 'Ginto Nord';
|
font-family: 'Ginto Nord';
|
||||||
font-weight: 800;
|
font-weight: 800;
|
||||||
src:url('https://cdn.statically.io/gh/brecert/discord-quote-generator/main/Ginto-Nord-800.woff') format("woff");
|
src: url('https://cdn.statically.io/gh/brecert/discord-quote-generator/main/Ginto-Nord-800.woff') format("woff");
|
||||||
}
|
}
|
||||||
|
|
||||||
h1 {
|
h1 {
|
||||||
font-family:"Ginto Nord" !important;
|
font-family: "Ginto Nord" !important;
|
||||||
}
|
}
|
||||||
</style> <% } %>
|
</style>
|
||||||
|
<% } %>
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
body {
|
body {
|
||||||
overflow-x: hidden;
|
overflow-x: hidden;
|
||||||
}
|
}
|
||||||
.subtitle {
|
|
||||||
|
.subtitle {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
color: #FFFF00;
|
color: #FFFF00;
|
||||||
text-shadow: 1px 1px 0px #000;
|
text-shadow: 1px 1px 0px #000;
|
||||||
|
@ -63,41 +69,56 @@ body {
|
||||||
animation: subtitle .25s;
|
animation: subtitle .25s;
|
||||||
animation-direction: alternate;
|
animation-direction: alternate;
|
||||||
animation-iteration-count: infinite;
|
animation-iteration-count: infinite;
|
||||||
}
|
}
|
||||||
|
|
||||||
@-webkit-keyframes subtitle {
|
@-webkit-keyframes subtitle {
|
||||||
0% {
|
0% {
|
||||||
transform: scale(0.875) rotate(-20deg)
|
transform: scale(0.875) rotate(-20deg)
|
||||||
}
|
}
|
||||||
|
|
||||||
100% {
|
100% {
|
||||||
transform: scale(1) rotate(-20deg)
|
transform: scale(1) rotate(-20deg)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
|
||||||
|
<body>
|
||||||
|
<video id="HD-BG" playsinline autoplay muted loop><source src="/bg-full.webm" type="video/webm"/></video>
|
||||||
|
<video id="SD-BG" playsinline autoplay muted loop><source src="/bg-480.webm" type="video/webm"/></video>
|
||||||
<div class="header">
|
<div class="header">
|
||||||
<div class="header-content">
|
<div class="header-content">
|
||||||
<div class="header-content-start">
|
<div class="header-content-start">
|
||||||
<a href="/" style="text-decoration:none;"><img style="width: 130px;" src="/css/logo-poke.svg"/><p class="subtitle"> <%- random %></p></a>
|
<a href="/" style="text-decoration:none;"><img style="width: 130px;" src="/css/logo-poke.svg" />
|
||||||
|
<p class="subtitle"> <%- random %></p>
|
||||||
|
</a>
|
||||||
</div>
|
</div>
|
||||||
<div class="header-content-center" style="margin-left: -30px;">
|
<div class="header-content-center" style="margin-left: -30px;">
|
||||||
<form action=/search><input class=search-bar autocomplete="on" id=fname name=query><button class="btn btn-success" type=submit><i class="fa-light fa-search"></i></button></form>
|
<form action=/search><input class=search-bar autocomplete="on" id=fname name=query><button
|
||||||
|
class="btn btn-success" type=submit><i class="fa-light fa-search"></i></button></form>
|
||||||
</div>
|
</div>
|
||||||
<div class="header-content-end">
|
<div class="header-content-end">
|
||||||
<a href="https://codeberg.org/Ashley/poketube/src/branch/main/instances.json"><i class="fa-sharp fa-solid fa-server"></i></a>
|
<a href="https://codeberg.org/Ashley/poketube/src/branch/main/instances.json"><i
|
||||||
|
class="fa-sharp fa-solid fa-server"></i></a>
|
||||||
<a href="/apps"><i class="fa-sharp fa-solid fa-grid-2"></i></a>
|
<a href="/apps"><i class="fa-sharp fa-solid fa-grid-2"></i></a>
|
||||||
<a href="/game-hub"><i class="fa-sharp fa-solid fa-gamepad-modern"></i></a>
|
<a href="/game-hub"><i class="fa-sharp fa-solid fa-gamepad-modern"></i></a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="features">
|
<div class="features">
|
||||||
<a style="color: white; text-decoration: none;" href="https://war.ukraine.ua/donate/"><p><i class="fa-duotone fa-handshake-angle"></i> Support Ukraine </p></a>
|
<a style="color: white; text-decoration: none;" href="https://war.ukraine.ua/donate/">
|
||||||
<a style="color: white; text-decoration: none;" href="https://buildpalestine.com/2021/05/15/trusted-organizations-to-donate-to-palestine/"><p><i class="fa-duotone fa-handshake-angle"></i> Support Palestine</p></a>
|
<p><i class="fa-duotone fa-handshake-angle"></i> Support Ukraine </p>
|
||||||
|
</a>
|
||||||
|
<a style="color: white; text-decoration: none;"
|
||||||
|
href="https://buildpalestine.com/2021/05/15/trusted-organizations-to-donate-to-palestine/">
|
||||||
|
<p><i class="fa-duotone fa-handshake-angle"></i> Support Palestine</p>
|
||||||
|
</a>
|
||||||
</div>
|
</div>
|
||||||
<div class="landing">
|
<div class="landing">
|
||||||
<h1>The Ultimate Privacy App</h1>
|
<h1>The Ultimate Privacy App</h1>
|
||||||
<p style="max-width: 800px; text-align: center; margin: 20px auto;"> Be Anonymous watching epic videos, searching thingys on the interwebs and listening to music on poketube - the free yt front end thats focused on ur privacy!!</p>
|
<p style="max-width: 800px; text-align: center; margin: 20px auto;"> Be Anonymous watching epic videos, searching
|
||||||
|
thingys on the interwebs and listening to music on poketube - the free yt front end thats focused on ur privacy!!
|
||||||
|
</p>
|
||||||
<div class="features">
|
<div class="features">
|
||||||
<p><i class="fa-sharp fa-solid fa-eye-low-vision"></i> No Tracking & Ads</p>
|
<p><i class="fa-sharp fa-solid fa-eye-low-vision"></i> No Tracking & Ads</p>
|
||||||
<p><i class="fa-sharp fa-solid fa-rabbit-running"></i>Very Fast</p>
|
<p><i class="fa-sharp fa-solid fa-rabbit-running"></i>Very Fast</p>
|
||||||
|
@ -105,30 +126,39 @@ body {
|
||||||
<p><i class="fa-sharp fa-solid fa-search"></i>Web Search</p>
|
<p><i class="fa-sharp fa-solid fa-search"></i>Web Search</p>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- source: https://picrew.me/share?cd=GD9wwCo5YY -->
|
<!-- source: https://picrew.me/share?cd=GD9wwCo5YY -->
|
||||||
<img src="/static/poke-chan-outfit-a.png" style="height: 400px;width: 369px;mask-image: none;margin-top: -14em;margin-left: -2em;margin-bottom: -13em;z-index: 999;position: absolute;-webkit-transform: scaleX(-1);transform: scaleX(-1);border-radius: 0px;" title="Poke-chan sitting :3">
|
<img src="/static/poke-chan-outfit-a.png"
|
||||||
<img src="/static/poke-screnshot-a.png"/>
|
style="height: 400px;width: 369px;mask-image: none;margin-top: -14em;margin-left: -2em;margin-bottom: -13em;z-index: 999;position: absolute;-webkit-transform: scaleX(-1);transform: scaleX(-1);border-radius: 0px;"
|
||||||
<style>@import url(https://ka-p.fontawesome.com/releases/v6.4.2/css/pro.min.css?token=fe06fc099b);@import url(https://ka-p.fontawesome.com/releases/v6.4.2/css/pro-v4-shims.min.css?token=fe06fc099b);@import url(https://ka-p.fontawesome.com/releases/v6.4.2/css/pro-v5-font-face.min.css?token=fe06fc099b);@import url(https://ka-p.fontawesome.com/releases/v6.4.2/css/pro-v4-font-face.min.css?token=fe06fc099b);@import url(https://ka-p.fontawesome.com/assets/fe06fc099b/108504408/custom-icons.css?token=fe06fc099b);</style>
|
title="Poke-chan sitting :3">
|
||||||
|
<img src="/static/poke-screnshot-a.png" />
|
||||||
|
<style>
|
||||||
|
@import url(https://ka-p.fontawesome.com/releases/v6.4.2/css/pro.min.css?token=fe06fc099b);
|
||||||
|
@import url(https://ka-p.fontawesome.com/releases/v6.4.2/css/pro-v4-shims.min.css?token=fe06fc099b);
|
||||||
|
@import url(https://ka-p.fontawesome.com/releases/v6.4.2/css/pro-v5-font-face.min.css?token=fe06fc099b);
|
||||||
|
@import url(https://ka-p.fontawesome.com/releases/v6.4.2/css/pro-v4-font-face.min.css?token=fe06fc099b);
|
||||||
|
@import url(https://ka-p.fontawesome.com/assets/fe06fc099b/108504408/custom-icons.css?token=fe06fc099b);
|
||||||
|
</style>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
// @license magnet:?xt=urn:btih:1f739d935676111cfff4b4693e3816e664797050&dn=gpl-3.0.txt GPL-3.0-or-later
|
// @license magnet:?xt=urn:btih:1f739d935676111cfff4b4693e3816e664797050&dn=gpl-3.0.txt GPL-3.0-or-later
|
||||||
if ('serviceWorker' in navigator) {
|
if ('serviceWorker' in navigator) {
|
||||||
navigator.serviceWorker.getRegistrations().then(function(registrations) {
|
navigator.serviceWorker.getRegistrations().then(function (registrations) {
|
||||||
for (let registration of registrations) {
|
for (let registration of registrations) {
|
||||||
registration.unregister();
|
registration.unregister();
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
if ('caches' in window) {
|
if ('caches' in window) {
|
||||||
caches.keys().then(function(cacheNames) {
|
caches.keys().then(function (cacheNames) {
|
||||||
cacheNames.forEach(function(cacheName) {
|
cacheNames.forEach(function (cacheName) {
|
||||||
caches.delete(cacheName);
|
caches.delete(cacheName);
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
// @license-end
|
// @license-end
|
||||||
</script>
|
</script>
|
||||||
</div>
|
</div>
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
</html>
|
</html>
|
|
@ -166,6 +166,15 @@ module.exports = function (app, config, renderTemplate) {
|
||||||
app.get("/favicon.ico", function (req, res) {
|
app.get("/favicon.ico", function (req, res) {
|
||||||
res.sendFile("favicon.ico", { root: cssDir });
|
res.sendFile("favicon.ico", { root: cssDir });
|
||||||
});
|
});
|
||||||
|
app.get("/bg-full.webm", function (req, res) {
|
||||||
|
res.sendFile("bg-full.webm", { root: cssDir });
|
||||||
|
});
|
||||||
|
app.get("/bg-720.webm", function (req, res) {
|
||||||
|
res.sendFile("bg-720.webm", { root: cssDir });
|
||||||
|
});
|
||||||
|
app.get("/bg-480.webm", function (req, res) {
|
||||||
|
res.sendFile("bg-480.webm", { root: cssDir });
|
||||||
|
});
|
||||||
|
|
||||||
app.get("/css/:id", (req, res) => {
|
app.get("/css/:id", (req, res) => {
|
||||||
const filePath = path.join(cssDir, req.params.id);
|
const filePath = path.join(cssDir, req.params.id);
|
||||||
|
|
Loading…
Reference in a new issue