forked from nin0/website
Compare commits
4 commits
| Author | SHA1 | Date | |
|---|---|---|---|
| 058139a8d7 | |||
| 49803ba398 | |||
| 7271006f49 | |||
|
96194316d3 |
7 changed files with 67 additions and 2 deletions
|
Before Width: | Height: | Size: 5.2 KiB After Width: | Height: | Size: 5.2 KiB |
31
src/components/AssBrowser.astro
Normal file
31
src/components/AssBrowser.astro
Normal file
|
|
@ -0,0 +1,31 @@
|
||||||
|
---
|
||||||
|
import GroupBox from "@components/GroupBox.astro";
|
||||||
|
---
|
||||||
|
|
||||||
|
<style is:global>
|
||||||
|
.ua {
|
||||||
|
font-family: monospace;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
<ass-browser>
|
||||||
|
<GroupBox>
|
||||||
|
<p>
|
||||||
|
<h2>YOUR BROWSER IS ASS</h2>
|
||||||
|
<span>
|
||||||
|
Your browser, <span class="ua"></span> does not support the full
|
||||||
|
set of web features which means that nin0.dev may not work as well
|
||||||
|
as it would on a non-ass browser.
|
||||||
|
<br />
|
||||||
|
<br />
|
||||||
|
Consider switching to a browser that is not ass such as <a
|
||||||
|
href="https://www.apple.com/ca/safari/">Safari</a
|
||||||
|
>, <a href="https://brave.com/">Brave</a>, or if you really have
|
||||||
|
no option, <a href="https://www.google.com/intl/en_ca/chrome/"
|
||||||
|
>Chrome</a
|
||||||
|
>. (these are personal preferences and I am not paid to say
|
||||||
|
this)
|
||||||
|
</span>
|
||||||
|
</p>
|
||||||
|
</GroupBox>
|
||||||
|
</ass-browser>
|
||||||
|
|
@ -1,12 +1,11 @@
|
||||||
---
|
---
|
||||||
import { Image } from "astro:assets";
|
import { Image } from "astro:assets";
|
||||||
import logo from "@assets/logo.png";
|
|
||||||
---
|
---
|
||||||
|
|
||||||
<div class="avatar-wrapper">
|
<div class="avatar-wrapper">
|
||||||
<Image
|
<Image
|
||||||
alt="My profile picture"
|
alt="My profile picture"
|
||||||
src={logo}
|
src={"/logo.png"}
|
||||||
class="avatar"
|
class="avatar"
|
||||||
width={80}
|
width={80}
|
||||||
height={80}
|
height={80}
|
||||||
|
|
|
||||||
|
|
@ -3,6 +3,28 @@ import LastFMIcon from "@assets/svg/fm.svg";
|
||||||
import HeartIcon from "@assets/svg/heart.svg";
|
import HeartIcon from "@assets/svg/heart.svg";
|
||||||
---
|
---
|
||||||
|
|
||||||
|
<style is:global>
|
||||||
|
ass-browser {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
.ass-browser {
|
||||||
|
ass-browser {
|
||||||
|
display: block !important;
|
||||||
|
}
|
||||||
|
.spotify-card {
|
||||||
|
background-color: #2b2b3b !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.spotify-card-wrapper {
|
||||||
|
background-color: #2b2b3b !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.spotify-card-background {
|
||||||
|
display: none !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
<div class="spotify-card-wrapper-shadow">
|
<div class="spotify-card-wrapper-shadow">
|
||||||
<h3 style="margin-bottom: 10px;">Listening to</h3>
|
<h3 style="margin-bottom: 10px;">Listening to</h3>
|
||||||
<div class="spotify-card-wrapper">
|
<div class="spotify-card-wrapper">
|
||||||
|
|
|
||||||
|
|
@ -13,6 +13,7 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.spotify-card-wrapper {
|
.spotify-card-wrapper {
|
||||||
background: var(--album-color);
|
background: var(--album-color);
|
||||||
position: relative;
|
position: relative;
|
||||||
|
|
|
||||||
|
|
@ -9,6 +9,7 @@ const { tabTitle } = Astro.props;
|
||||||
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
|
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
|
||||||
<meta name="viewport" content="width=device-width" />
|
<meta name="viewport" content="width=device-width" />
|
||||||
<meta name="generator" content={Astro.generator} />
|
<meta name="generator" content={Astro.generator} />
|
||||||
|
<meta name="darkreader-lock">
|
||||||
<title>{tabTitle}</title>
|
<title>{tabTitle}</title>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
|
@ -19,6 +20,15 @@ const { tabTitle } = Astro.props;
|
||||||
document
|
document
|
||||||
.querySelectorAll(".window")
|
.querySelectorAll(".window")
|
||||||
.forEach(window => WindowManager.observe(window));
|
.forEach(window => WindowManager.observe(window));
|
||||||
|
|
||||||
|
const isBrowserAss = () =>
|
||||||
|
["Firefox"].some(ass => navigator.userAgent.includes(ass));
|
||||||
|
if (isBrowserAss()) document.body.classList.add("ass-browser");
|
||||||
|
|
||||||
|
document
|
||||||
|
.querySelectorAll(".ua")
|
||||||
|
// @ts-ignore
|
||||||
|
.forEach(u => (u.innerText = navigator.userAgent));
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
</body>
|
</body>
|
||||||
|
|
|
||||||
|
|
@ -3,10 +3,12 @@ import Noscript from "@components/Noscript.astro";
|
||||||
import MainWindow from "@components/windows/main/MainWindow.astro";
|
import MainWindow from "@components/windows/main/MainWindow.astro";
|
||||||
import BaseLayout from "../layouts/BaseLayout.astro";
|
import BaseLayout from "../layouts/BaseLayout.astro";
|
||||||
import CodeWindow from "@components/windows/code/CodeWindow.astro";
|
import CodeWindow from "@components/windows/code/CodeWindow.astro";
|
||||||
|
import AssBrowser from "@components/AssBrowser.astro";
|
||||||
---
|
---
|
||||||
|
|
||||||
<BaseLayout tabTitle="nin0.dev">
|
<BaseLayout tabTitle="nin0.dev">
|
||||||
<Noscript />
|
<Noscript />
|
||||||
|
<AssBrowser />
|
||||||
<MainWindow />
|
<MainWindow />
|
||||||
<CodeWindow />
|
<CodeWindow />
|
||||||
</BaseLayout>
|
</BaseLayout>
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue