MinPluto/poke-on-astro-experiment
Archived
1
0
Fork 0
Code Issues Pull requests Activity

update

Browse source
This commit is contained in:
Korbs 2024-06-27 20:41:50 -04:00
parent cb25aa741f
commit 85f787725e
No known key found for this signature in database
3 changed files with 24 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
README.md
View file

@ -54,6 +54,11 @@ This repo is only a proof of concept to see how Poke will run in Astro. A lot of
- [ ] Import/Export Poke User Settings - [ ] Import/Export Poke User Settings
- [x] Add Twitch Support, use [SafeTwitch Backend](https://codeberg.org/SafeTwitch/safetwitch-backend) - [x] Add Twitch Support, use [SafeTwitch Backend](https://codeberg.org/SafeTwitch/safetwitch-backend)
## Known Issuse
- End-user must reload page again after switch language (May be caused by ViewTransition API)
- i18n doesn't activiate after 1 or 2 seconds when launching Poke (Does it matter? Not that much, but I'll like to fix that)
- Searching from a video doesn't work. Error: `SyntaxError: Unexpected end of JSON input` (URL isn't set correctly)
## Build ## Build
> Instructions assume you're using Bun as the package manager, which is preferred for Astro projects. > Instructions assume you're using Bun as the package manager, which is preferred for Astro projects.

19
src/layouts/Error.astro
View file

@ -5,6 +5,7 @@ const { ErrorMessage } = Astro.props
// i18n // i18n
import i18next, { t } from "i18next"; import i18next, { t } from "i18next";
import { Trans, HeadHrefLangs } from "astro-i18next/components"; import { Trans, HeadHrefLangs } from "astro-i18next/components";
import { EmojiSad } from "@iconoir/vue";
--- ---
<html> <html>
@ -15,8 +16,9 @@ import { Trans, HeadHrefLangs } from "astro-i18next/components";
<meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no, viewport-fit=cover" /> <meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no, viewport-fit=cover" />
</head> </head>
<body> <body>
<video playsinline autoplay muted loop class="landing-background" src="/flurry-background.webm" type="video/webm"/>
<div class="error"> <div class="error">
<h2>An error occured</h2> <h2><EmojiSad/> Something Happened!</h2>
<p>{ErrorMessage}</p> <p>{ErrorMessage}</p>
</div> </div>
</body> </body>
@ -30,9 +32,20 @@ body {
font-family: arial; font-family: arial;
max-width: 600px; max-width: 600px;
} }
video {
filter: saturate(0);
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
object-fit: cover;
z-index: -1;
opacity: .27;
pointer-events: none;
}
body::before { body::before {
background: linear-gradient(0deg, rgba(115, 32, 67, 1), rgba(17, 17, 17, 1)); background: black;
background-repeat: no-repeat;
content: ""; content: "";
position: fixed; position: fixed;
bottom: 0px; bottom: 0px;

6
src/pages/index.astro
View file

@ -107,9 +107,9 @@ import Chan from '@assets/chan/v2.png'
<style lang="scss" is:global> <style lang="scss" is:global>
header { header {
background: transparent !important; background: transparent !important;
border: none !important; border: none !important;
backdrop-filter: blur(1px); backdrop-filter: blur(1px);
} }
video { video {
position: fixed; position: fixed;