titaniumnet-mirror/Nebula
1
0
Fork 0
mirror of https://github.com/NebulaServices/Nebula.git synced 2025-05-14 12:20:01 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

Prettier and replace class with ClassName

Browse source
This commit is contained in:
incognitotgt 2024-01-01 19:00:00 -05:00
parent ddc2f47f97
commit d0ef235c24
18 changed files with 122 additions and 101 deletions
Download patch file Download diff file Expand all files Collapse all files

38
public/themes/catppuccinFrappe.css
View file

@ -1,29 +1,29 @@
@import url("https://fonts.googleapis.com/css2?family=Dongle&family=Roboto:wght@100&display=swap");
:root {
--background-primary: #303446 !important;
--background-lighter: #232634 !important;
--navbar-color: #232634 !important;
--navbar-height: 60px !important;
--navbar-text-color: #ca9ee6 !important;
--navbar-link-color: #8caaee !important;
--navbar-link-hover-color: #ca9ee6 !important;
--navbar-font: "Roboto" !important;
--input-text-color: #c6d0f5 !important;
--input-placeholder-color: #b5bfe2 !important;
--input-background-color: #292c3c !important;
--input-border-color: #ca9ee6 !important;
--input-border-size: 1.3px !important;
--navbar-logo-filter: none !important;
--dropdown-option-hover-color: #232634 !important;
--tab-color: #414559 !important;
--background-primary: #303446 !important;
--background-lighter: #232634 !important;
--navbar-color: #232634 !important;
--navbar-height: 60px !important;
--navbar-text-color: #ca9ee6 !important;
--navbar-link-color: #8caaee !important;
--navbar-link-hover-color: #ca9ee6 !important;
--navbar-font: "Roboto" !important;
--input-text-color: #c6d0f5 !important;
--input-placeholder-color: #b5bfe2 !important;
--input-background-color: #292c3c !important;
--input-border-color: #ca9ee6 !important;
--input-border-size: 1.3px !important;
--navbar-logo-filter: none !important;
--dropdown-option-hover-color: #232634 !important;
--tab-color: #414559 !important;
}
.font-inter {
font-family: "Inter", sans-serif;
font-weight: 300;
font-family: "Inter", sans-serif;
font-weight: 300;
}
.font-roboto {
font-family: "Roboto";
font-family: "Roboto";
}

38
public/themes/catppuccinMacchiato.css
View file

@ -1,29 +1,29 @@
@import url("https://fonts.googleapis.com/css2?family=Dongle&family=Roboto:wght@100&display=swap");
:root {
--background-primary: #24273a !important;
--background-lighter: #181926 !important;
--navbar-color: #181926 !important;
--navbar-height: 60px !important;
--navbar-text-color: #c6a0f6 !important;
--navbar-link-color: #8aadf4 !important;
--navbar-link-hover-color: #c6a0f6 !important;
--navbar-font: "Roboto" !important;
--input-text-color: #cad3f5 !important;
--input-placeholder-color: #b8c0e0 !important;
--input-background-color: #1e2030 !important;
--input-border-color: #c6a0f6 !important;
--input-border-size: 1.3px !important;
--navbar-logo-filter: none !important;
--dropdown-option-hover-color: #181926 !important;
--tab-color: #363a4f;
--background-primary: #24273a !important;
--background-lighter: #181926 !important;
--navbar-color: #181926 !important;
--navbar-height: 60px !important;
--navbar-text-color: #c6a0f6 !important;
--navbar-link-color: #8aadf4 !important;
--navbar-link-hover-color: #c6a0f6 !important;
--navbar-font: "Roboto" !important;
--input-text-color: #cad3f5 !important;
--input-placeholder-color: #b8c0e0 !important;
--input-background-color: #1e2030 !important;
--input-border-color: #c6a0f6 !important;
--input-border-size: 1.3px !important;
--navbar-logo-filter: none !important;
--dropdown-option-hover-color: #181926 !important;
--tab-color: #363a4f;
}
.font-inter {
font-family: "Inter", sans-serif;
font-weight: 300;
font-family: "Inter", sans-serif;
font-weight: 300;
}
.font-roboto {
font-family: "Roboto";
font-family: "Roboto";
}

4
src/LoadSuspense.tsx
View file

@ -2,7 +2,7 @@ import "./Suspense.css";
export function LoadSuspense() {
return (
<div class="suspenseContainer">
<div className="suspenseContainer">
<svg
xmlns="http://www.w3.org/2000/svg"
version="1.2"
@ -10,7 +10,7 @@ export function LoadSuspense() {
width="400"
height="400"
fill="#5e17eb"
class="animate-pulse-brighter"
className="animate-pulse-brighter"
>
<g id="svgg">
<path

2
src/components/Header.tsx
View file

@ -18,7 +18,7 @@ export function Header() {
id="navbar"
className="flex h-16 flex-row items-center justify-between bg-navbar-color px-4"
>
<Link href="/" class="w-1/8">
<Link href="/" className="w-1/8">
<div className="relative flex flex-row items-center">
<img
src="/logo.png"

6
src/components/HeaderRoute.tsx
View file

@ -2,10 +2,10 @@ import { Header } from "./Header";
export function HeaderRoute(props: { children: any }) {
return (
<div class="flex h-screen flex-col">
<div className="flex h-screen flex-col">
<Header />
<div class="flex-1 bg-primary">
<main class="h-full">{props.children}</main>
<div className="flex-1 bg-primary">
<main className="h-full">{props.children}</main>
</div>
</div>
);

4
src/components/iframe/IframeHeader.tsx
View file

@ -32,7 +32,7 @@ export function IframeHeader(props: { url: string }) {
id="iframeNav"
className="flex h-16 flex-row items-center justify-between gap-3 bg-navbar-color px-4"
>
<Link href="/" class="w-1/8">
<Link href="/" className="w-1/8">
<div className="flex flex-row items-center">
<img
src="/logo.png"
@ -74,7 +74,7 @@ export function IframeHeader(props: { url: string }) {
}}
/>
</div>
<div id="navItems" class="w-1/8">
<div id="navItems" className="w-1/8">
<div className="mr-4 flex flex-row items-center justify-end gap-3">
<IoCodeSlashSharp
className="duration-0500 h-6 w-6 cursor-pointer text-navbar-text-color transition-all hover:scale-110 hover:brightness-125"

14
src/pages/Home.tsx
View file

@ -43,18 +43,18 @@ export function Home() {
originalTitle={t("titles.home")}
originalFavicon="/logo.png"
/>
<div class="flex h-full flex-col items-center justify-center">
<div class="font-inter absolute bottom-0 left-0 p-4 text-sm italic text-input-text">
<div className="flex h-full flex-col items-center justify-center">
<div className="font-inter absolute bottom-0 left-0 p-4 text-sm italic text-input-text">
Nebula &copy; Nebula Services {new Date().getUTCFullYear()}
</div>
<a href="https://github.com/NebulaServices/Nebula">
<div class="font-inter absolute bottom-0 right-0 p-4 text-sm text-input-text">
<div className="font-inter absolute bottom-0 right-0 p-4 text-sm text-input-text">
GitHub
</div>
</a>
<form
onSubmit={handleSubmit}
class="flex h-full w-full flex-col items-center justify-center"
className="flex h-full w-full flex-col items-center justify-center"
>
<input
onFocus={() => {
@ -78,8 +78,8 @@ export function Home() {
placeholder={isFocused ? "" : t("home.placeholder")}
/>
<div class="relative flex w-10/12 flex-col items-center md:w-3/12">
<div class="absolute w-full text-center">
<div className="relative flex w-10/12 flex-col items-center md:w-3/12">
<div className="absolute w-full text-center">
{showSuggestions &&
suggestions.map((suggestion, index) => (
<a
@ -108,7 +108,7 @@ export function Home() {
Array.from({ length: 10 }, (_, index) => (
<div
key={index}
class="font-roboto w-110 hover:bg-dropdown-option-hover-colo flex h-8 flex-none shrink-0 items-center justify-center border border-input-border-color p-2 text-2xl"
className="font-roboto w-110 hover:bg-dropdown-option-hover-colo flex h-8 flex-none shrink-0 items-center justify-center border border-input-border-color p-2 text-2xl"
>
Example suggestion
</div>

2
src/pages/ProxyFrame.tsx
View file

@ -102,7 +102,7 @@ export function ProxyFrame(props: { url: string }) {
}
return (
<div class="h-screen w-screen bg-primary">
<div className="h-screen w-screen bg-primary">
<CloakedHead
originalTitle={t("titles.home")}
originalFavicon="/logo.png"

2
src/pages/Radon.tsx
View file

@ -10,7 +10,7 @@ export function Radon() {
window.__uv$config.prefix +
window.__uv$config.encodeUrl("https://radon.games")
}
class="h-full w-full"
className="h-full w-full"
></iframe>
</HeaderRoute>
);

4
src/pages/Settings/CloakPreset.tsx
View file

@ -17,11 +17,11 @@ const CloakPreset = (props: Props) => {
return (
<div
onClick={cloak}
class="cursor-pointer rounded-full border border-input-border-color bg-lighter"
className="cursor-pointer rounded-full border border-input-border-color bg-lighter"
>
<img
src={props.faviconUrl === "none" ? "/logo.png" : props.faviconUrl}
class="h-16 w-16 p-4"
className="h-16 w-16 p-4"
/>
</div>
);

11
src/pages/Settings/Customization.tsx
View file

@ -3,7 +3,6 @@ import { tabContentVariant, settingsPageVariant } from "./Variants";
import { useTranslation } from "react-i18next";
import Dropdown from "./Dropdown";
function Customization({ id, active }) {
const { t } = useTranslation();
@ -28,9 +27,13 @@ function Customization({ id, active }) {
variants={settingsPageVariant}
className="content-card flex w-full flex-col items-center justify-center text-center"
>
<div class="flex h-64 w-80 flex-col flex-wrap content-center items-center rounded-lg border border-input-border-color bg-lighter p-7 text-center">
<div class="p-2 text-3xl font-bold text-input-text">{t("settings.theme.title")}</div>
<div class="text-md p-4 font-bold text-input-text">{t("settings.theme.subtitle")}</div>
<div className="flex h-64 w-80 flex-col flex-wrap content-center items-center rounded-lg border border-input-border-color bg-lighter p-7 text-center">
<div className="p-2 text-3xl font-bold text-input-text">
{t("settings.theme.title")}
</div>
<div className="text-md p-4 font-bold text-input-text">
{t("settings.theme.subtitle")}
</div>
<Dropdown storageKey="theme" options={themes} refresh={true} />
</div>
</motion.div>

6
src/pages/Settings/Dropdown.tsx
View file

@ -35,11 +35,11 @@ const Dropdown = ({
onClick={() => setIsOpen(!isOpen)}
>
<div className="flex h-full w-full select-none flex-row items-center">
<div class="h-full w-1/4"></div>
<div class="flex w-2/4 flex-col items-center">
<div className="h-full w-1/4"></div>
<div className="flex w-2/4 flex-col items-center">
{options.find((o) => o.id === choice)?.label}
</div>
<div class="flex w-1/4 flex-col items-center">
<div className="flex w-1/4 flex-col items-center">
<FaAngleDown />
</div>
</div>

10
src/pages/Settings/Misc.tsx
View file

@ -25,9 +25,13 @@ const Misc = ({ id, active }) => {
variants={settingsPageVariant}
className="content-card flex w-full flex-row flex-wrap justify-center gap-4"
>
<div class="flex h-64 w-80 flex-col flex-wrap content-center items-center rounded-lg border border-input-border-color bg-lighter p-7 text-center">
<div class="text-3xl font-bold text-input-text">{t("settings.languages.title")}</div>
<div class="text-md font-bold text-input-text">{t("settings.languages.subtitle")}</div>
<div className="flex h-64 w-80 flex-col flex-wrap content-center items-center rounded-lg border border-input-border-color bg-lighter p-7 text-center">
<div className="text-3xl font-bold text-input-text">
{t("settings.languages.title")}
</div>
<div className="text-md font-bold text-input-text">
{t("settings.languages.subtitle")}
</div>
<Dropdown
storageKey="i18nextLng"
options={languages}

30
src/pages/Settings/Proxy.tsx
View file

@ -38,23 +38,35 @@ const Proxy = ({ id, active }) => {
variants={settingsPageVariant}
className="content-card flex w-full flex-row flex-wrap justify-center gap-4"
>
<div class="flex h-64 w-80 flex-col flex-wrap content-center items-center rounded-lg border border-input-border-color bg-lighter p-7 text-center">
<div class="p-2 text-3xl font-bold text-input-text">{t("settings.proxy.title")}</div>
<div class="text-md p-4 font-bold text-input-text">{t("settings.proxy.subtitle")}</div>
<div className="flex h-64 w-80 flex-col flex-wrap content-center items-center rounded-lg border border-input-border-color bg-lighter p-7 text-center">
<div className="p-2 text-3xl font-bold text-input-text">
{t("settings.proxy.title")}
</div>
<div className="text-md p-4 font-bold text-input-text">
{t("settings.proxy.subtitle")}
</div>
<Dropdown storageKey="proxy" options={engines} refresh={false} />
</div>
<div class="flex h-64 w-80 flex-col flex-wrap content-center items-center rounded-lg border border-input-border-color bg-lighter p-7 text-center">
<div class="p-2 text-3xl font-bold text-input-text">{t("settings.proxymodes.title")}</div>
<div class="text-md p-4 font-bold text-input-text">{t("settings.proxymodes.subtitle")}</div>
<div className="flex h-64 w-80 flex-col flex-wrap content-center items-center rounded-lg border border-input-border-color bg-lighter p-7 text-center">
<div className="p-2 text-3xl font-bold text-input-text">
{t("settings.proxymodes.title")}
</div>
<div className="text-md p-4 font-bold text-input-text">
{t("settings.proxymodes.subtitle")}
</div>
<Dropdown
storageKey="proxyMode"
options={proxyModes}
refresh={false}
/>
</div>
<div class="flex h-64 w-80 flex-col flex-wrap content-center items-center rounded-lg border border-input-border-color bg-lighter p-7 text-center">
<div class="p-2 text-3xl font-bold text-input-text">{t("settings.search.title")}</div>
<div class="text-md p-4 font-bold text-input-text">{t("settings.search.subtitle")}</div>
<div className="flex h-64 w-80 flex-col flex-wrap content-center items-center rounded-lg border border-input-border-color bg-lighter p-7 text-center">
<div className="p-2 text-3xl font-bold text-input-text">
{t("settings.search.title")}
</div>
<div className="text-md p-4 font-bold text-input-text">
{t("settings.search.subtitle")}
</div>
<Dropdown
storageKey="searchEngine"
options={searchEngines}

2
src/pages/Settings/TabComponent.tsx
View file

@ -69,7 +69,7 @@ const TabComponent = ({ tabs, defaultIndex = 0 }) => {
const { t } = useTranslation();
return (
<div class="flex h-full w-full flex-col items-center">
<div className="flex h-full w-full flex-col items-center">
<div className="container h-full w-full">
<div className="tabs-component">
<ul className="tab-links" role="tablist">

10
src/pages/Settings/TabSettings.tsx
View file

@ -20,13 +20,13 @@ const TabSettings = ({ id, active }) => {
variants={settingsPageVariant}
className="content-card flex w-full flex-col items-center justify-center text-center"
>
<div class="text-3xl font-bold text-input-text">
<div className="text-3xl font-bold text-input-text">
{t("settings.cloaking.title")}
</div>
<div class="text-md pb-5 font-bold text-input-text">
<div className="text-md pb-5 font-bold text-input-text">
{t("settings.cloaking.subtitle")}
</div>
<div class="flex flex-row space-x-4">
<div className="flex flex-row space-x-4">
<CloakPreset faviconUrl="none" title="none" />
<CloakPreset
faviconUrl="https://t1.gstatic.com/faviconV2?client=SOCIAL&type=FAVICON&fallback_opts=TYPE,SIZE,URL&url=http://google.com&size=32"
@ -49,9 +49,9 @@ const TabSettings = ({ id, active }) => {
title="Schoology"
/>
</div>
<div class="relative p-4">
<div className="relative p-4">
<button
class="font-roboto h-14 w-56 rounded-2xl border border-input-border-color bg-input p-2 text-center text-xl font-bold text-input-text placeholder:text-input-text focus:outline-none"
className="font-roboto h-14 w-56 rounded-2xl border border-input-border-color bg-input p-2 text-center text-xl font-bold text-input-text placeholder:text-input-text focus:outline-none"
onClick={() => {
let newWindow = window.open("about:blank");
let iframe = document.createElement("iframe");

14
src/pages/_404.tsx
View file

@ -12,15 +12,15 @@ export function NotFound() {
originalTitle={t("titles.404")}
originalFavicon="/logo.png"
/>
<section class="h-full">
<div class="flex h-full flex-col items-center justify-center">
<img src="/404.png" class="h-72"></img>
<div class="flex flex-col items-center p-6">
<p class="font-roboto text-4xl font-bold">{t("404.text")}</p>
<span class="font-roboto text-3xl">404</span>
<section className="h-full">
<div className="flex h-full flex-col items-center justify-center">
<img src="/404.png" className="h-72"></img>
<div className="flex flex-col items-center p-6">
<p className="font-roboto text-4xl font-bold">{t("404.text")}</p>
<span className="font-roboto text-3xl">404</span>
</div>
<Link href="/">
<button class="font-roboto h-14 w-44 rounded-2xl border border-input-border-color bg-input p-2 text-center text-xl placeholder:text-input-text focus:outline-none">
<button className="font-roboto h-14 w-44 rounded-2xl border border-input-border-color bg-input p-2 text-center text-xl placeholder:text-input-text focus:outline-none">
{t("404.return")}
</button>
</Link>

22
src/pages/discord.tsx
View file

@ -11,23 +11,25 @@ export function DiscordPage() {
originalTitle={t("titles.discord")}
originalFavicon="/logo.png"
/>
<section class="h-full">
<div class="flex h-full flex-col items-center justify-center">
<img src="/services.png" class="h-72 w-72"></img>
<div class="flex flex-col items-center p-6">
<p class="font-roboto text-4xl font-bold">{t("discord.title")}</p>
<span class="font-roboto text-3xl">{t("discord.sub")}</span>
<section className="h-full">
<div className="flex h-full flex-col items-center justify-center">
<img src="/services.png" className="h-72 w-72"></img>
<div className="flex flex-col items-center p-6">
<p className="font-roboto text-4xl font-bold">
{t("discord.title")}
</p>
<span className="font-roboto text-3xl">{t("discord.sub")}</span>
</div>
<a href="https://discord.gg/unblocker" class="p-6">
<button class="font-roboto h-14 w-56 rounded-2xl border border-input-border-color bg-input p-2 text-center text-xl placeholder:text-input-text focus:outline-none">
<a href="https://discord.gg/unblocker" className="p-6">
<button className="font-roboto h-14 w-56 rounded-2xl border border-input-border-color bg-input p-2 text-center text-xl placeholder:text-input-text focus:outline-none">
{t("discord.button1")}
</button>
</a>
<a
href="/~/uv/https%3A%2F%2Fdiscord.com%2Finvite%2Funblocker"
class="p-6"
className="p-6"
>
<button class="font-roboto h-14 w-56 rounded-2xl border border-input-border-color bg-input p-2 text-center text-xl placeholder:text-input-text focus:outline-none">
<button className="font-roboto h-14 w-56 rounded-2xl border border-input-border-color bg-input p-2 text-center text-xl placeholder:text-input-text focus:outline-none">
{t("discord.button2")}
</button>
</a>