mirror of
https://github.com/emuplace/cytrus.emuplace.app.git
synced 2024-10-18 11:02:32 +02:00
Uploaded initial website
This commit is contained in:
parent
851804778a
commit
bff153e6d2
5
.firebaserc
Normal file
5
.firebaserc
Normal file
@ -0,0 +1,5 @@
|
|||||||
|
{
|
||||||
|
"projects": {
|
||||||
|
"default": "cytrus-adbe3"
|
||||||
|
}
|
||||||
|
}
|
20
.github/workflows/firebase-hosting-merge.yml
vendored
Normal file
20
.github/workflows/firebase-hosting-merge.yml
vendored
Normal file
@ -0,0 +1,20 @@
|
|||||||
|
# This file was auto-generated by the Firebase CLI
|
||||||
|
# https://github.com/firebase/firebase-tools
|
||||||
|
|
||||||
|
name: Deploy to Firebase Hosting on merge
|
||||||
|
on:
|
||||||
|
push:
|
||||||
|
branches:
|
||||||
|
- master
|
||||||
|
jobs:
|
||||||
|
build_and_deploy:
|
||||||
|
runs-on: ubuntu-latest
|
||||||
|
steps:
|
||||||
|
- uses: actions/checkout@v4
|
||||||
|
- run: npm ci && npm run build
|
||||||
|
- uses: FirebaseExtended/action-hosting-deploy@v0
|
||||||
|
with:
|
||||||
|
repoToken: ${{ secrets.GITHUB_TOKEN }}
|
||||||
|
firebaseServiceAccount: ${{ secrets.FIREBASE_SERVICE_ACCOUNT_CYTRUS_ADBE3 }}
|
||||||
|
channelId: live
|
||||||
|
projectId: cytrus-adbe3
|
21
.github/workflows/firebase-hosting-pull-request.yml
vendored
Normal file
21
.github/workflows/firebase-hosting-pull-request.yml
vendored
Normal file
@ -0,0 +1,21 @@
|
|||||||
|
# This file was auto-generated by the Firebase CLI
|
||||||
|
# https://github.com/firebase/firebase-tools
|
||||||
|
|
||||||
|
name: Deploy to Firebase Hosting on PR
|
||||||
|
on: pull_request
|
||||||
|
permissions:
|
||||||
|
checks: write
|
||||||
|
contents: read
|
||||||
|
pull-requests: write
|
||||||
|
jobs:
|
||||||
|
build_and_preview:
|
||||||
|
if: ${{ github.event.pull_request.head.repo.full_name == github.repository }}
|
||||||
|
runs-on: ubuntu-latest
|
||||||
|
steps:
|
||||||
|
- uses: actions/checkout@v4
|
||||||
|
- run: npm ci && npm run build
|
||||||
|
- uses: FirebaseExtended/action-hosting-deploy@v0
|
||||||
|
with:
|
||||||
|
repoToken: ${{ secrets.GITHUB_TOKEN }}
|
||||||
|
firebaseServiceAccount: ${{ secrets.FIREBASE_SERVICE_ACCOUNT_CYTRUS_ADBE3 }}
|
||||||
|
projectId: cytrus-adbe3
|
16
firebase.json
Normal file
16
firebase.json
Normal file
@ -0,0 +1,16 @@
|
|||||||
|
{
|
||||||
|
"hosting": {
|
||||||
|
"public": "dist",
|
||||||
|
"ignore": [
|
||||||
|
"firebase.json",
|
||||||
|
"**/.*",
|
||||||
|
"**/node_modules/**"
|
||||||
|
],
|
||||||
|
"rewrites": [
|
||||||
|
{
|
||||||
|
"source": "**",
|
||||||
|
"destination": "/index.html"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
}
|
4734
package-lock.json
generated
Normal file
4734
package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load Diff
@ -13,6 +13,7 @@
|
|||||||
"@mantine/core": "7.12.2",
|
"@mantine/core": "7.12.2",
|
||||||
"@mantine/hooks": "7.12.2",
|
"@mantine/hooks": "7.12.2",
|
||||||
"@mantine/vanilla-extract": "7.12.2",
|
"@mantine/vanilla-extract": "7.12.2",
|
||||||
|
"@tabler/icons-react": "^3.17.0",
|
||||||
"@vanilla-extract/css": "^1.15.3",
|
"@vanilla-extract/css": "^1.15.3",
|
||||||
"react": "^18.3.1",
|
"react": "^18.3.1",
|
||||||
"react-dom": "^18.3.1"
|
"react-dom": "^18.3.1"
|
||||||
|
33
src/App.module.css
Normal file
33
src/App.module.css
Normal file
@ -0,0 +1,33 @@
|
|||||||
|
.root {
|
||||||
|
border-radius: var(--mantine-radius-md);
|
||||||
|
background-color: light-dark(var(--mantine-color-gray-0), var(--mantine-color-dark-6));
|
||||||
|
}
|
||||||
|
|
||||||
|
.item {
|
||||||
|
background-color: light-dark(var(--mantine-color-gray-0), var(--mantine-color-dark-6));
|
||||||
|
border: 1px solid transparent;
|
||||||
|
position: relative;
|
||||||
|
z-index: 0;
|
||||||
|
transition: transform 150ms ease;
|
||||||
|
|
||||||
|
&[data-active] {
|
||||||
|
transform: scale(1.03);
|
||||||
|
z-index: 1;
|
||||||
|
background-color: var(--mantine-color-body);
|
||||||
|
border-color: light-dark(var(--mantine-color-gray-2), var(--mantine-color-dark-4));
|
||||||
|
box-shadow: var(--mantine-shadow-md);
|
||||||
|
border-radius: var(--mantine-radius-md);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.chevron {
|
||||||
|
&[data-rotate] {
|
||||||
|
transform: rotate(-90deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.control:hover {
|
||||||
|
&[data-active] {
|
||||||
|
background-color: var(--mantine-color-body);
|
||||||
|
}
|
||||||
|
}
|
159
src/App.tsx
159
src/App.tsx
@ -1,14 +1,161 @@
|
|||||||
import "@mantine/core/styles.css";
|
import "@mantine/core/styles.css";
|
||||||
import { MantineProvider } from "@mantine/core";
|
import {
|
||||||
|
Accordion, Anchor, Badge, Button, Container,
|
||||||
|
Flex, Group, List, MantineProvider, Menu,
|
||||||
|
Space, Stack, Text, Title, rem
|
||||||
|
} from "@mantine/core";
|
||||||
|
import {
|
||||||
|
IconDeviceMobile,
|
||||||
|
IconDeviceTablet,
|
||||||
|
IconDeviceLaptop,
|
||||||
|
} from '@tabler/icons-react';
|
||||||
|
import { useState } from "react";
|
||||||
import { theme } from "./theme";
|
import { theme } from "./theme";
|
||||||
import { Welcome } from "./Welcome/Welcome";
|
import classes from './App.module.css';
|
||||||
import { ColorSchemeToggle } from "./ColorSchemeToggle/ColorSchemeToggle";
|
|
||||||
|
|
||||||
export default function App() {
|
export default function App() {
|
||||||
|
const changes = [
|
||||||
|
{
|
||||||
|
text: 'v1.0.0',
|
||||||
|
sha: '1e97bb2',
|
||||||
|
isLatest: true,
|
||||||
|
isUpcoming: false,
|
||||||
|
details: [
|
||||||
|
{
|
||||||
|
system: "Android",
|
||||||
|
items: [
|
||||||
|
{
|
||||||
|
primaryText: "Rebranded original latest Citra code to Cytrus",
|
||||||
|
secondaryText: null
|
||||||
|
},
|
||||||
|
{
|
||||||
|
primaryText: "Added support for 16 KB page sizes in Android 15",
|
||||||
|
secondaryText: null
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
system: "Windows",
|
||||||
|
items: [
|
||||||
|
{
|
||||||
|
primaryText: "Rebranded original latest Citra code to Cytrus",
|
||||||
|
secondaryText: null
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
];
|
||||||
|
|
||||||
|
const items = changes.map((item) => {
|
||||||
|
const listItems = item.details.map((detail, index) => {
|
||||||
|
const detailItems = detail.items.map((item) => (
|
||||||
|
<>
|
||||||
|
<List.Item>
|
||||||
|
<Text>{item.primaryText}</Text>
|
||||||
|
<Text c={'dimmed'} size="sm" hidden={item.secondaryText == '' || item.secondaryText == null}>
|
||||||
|
{item.secondaryText}
|
||||||
|
</Text>
|
||||||
|
</List.Item>
|
||||||
|
</>
|
||||||
|
));
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<MantineProvider theme={theme}>
|
<>
|
||||||
<Welcome />
|
<Title order={3}>
|
||||||
<ColorSchemeToggle />
|
{detail.system}
|
||||||
|
</Title>
|
||||||
|
<List>
|
||||||
|
{detailItems}
|
||||||
|
</List>
|
||||||
|
<Space h={index === changes.length ? 0 : 'md'} />
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
});
|
||||||
|
|
||||||
|
return (
|
||||||
|
<Accordion.Item key={item.text} value={item.text}>
|
||||||
|
<Accordion.Control>
|
||||||
|
<Group justify='space-between' pr={'md'}>
|
||||||
|
<Group gap={'sm'}>
|
||||||
|
<Text>
|
||||||
|
{item.text}
|
||||||
|
</Text>
|
||||||
|
<Text c={'dimmed'}>
|
||||||
|
{`(${item.sha})`}
|
||||||
|
</Text>
|
||||||
|
</Group>
|
||||||
|
<Badge color={item.isLatest ? theme.primaryColor : item.isUpcoming ? 'dark' : 'red'}>
|
||||||
|
{item.isLatest ? 'Latest' : item.isUpcoming ? 'Upcoming' : 'Outdated'}
|
||||||
|
</Badge>
|
||||||
|
</Group>
|
||||||
|
</Accordion.Control>
|
||||||
|
<Accordion.Panel>
|
||||||
|
{...listItems}
|
||||||
|
</Accordion.Panel>
|
||||||
|
</Accordion.Item>
|
||||||
|
);
|
||||||
|
});
|
||||||
|
|
||||||
|
const [opened, setOpened] = useState(false);
|
||||||
|
|
||||||
|
const date = new Date();
|
||||||
|
|
||||||
|
return (
|
||||||
|
<MantineProvider theme={theme} forceColorScheme={date.getHours() >= 7 && date.getHours() <= 19 ? "light" : "dark"}>
|
||||||
|
<Container>
|
||||||
|
<Flex align={'center'} justify={'center'} h={'100vh'}>
|
||||||
|
<Stack>
|
||||||
|
<Anchor href='https://twitter.com/antique_codes' ta={'center'} target='_blank'>
|
||||||
|
@antique_codes
|
||||||
|
</Anchor>
|
||||||
|
<Title order={1} ta={'center'}>
|
||||||
|
Cytrus, a Nintendo 3DS emulator
|
||||||
|
</Title>
|
||||||
|
<Text c={'dimmed'} ta={'center'}>
|
||||||
|
Nintendo 3DS emulation, continued
|
||||||
|
</Text>
|
||||||
|
<Flex align={'center'} justify={'center'}>
|
||||||
|
<Group ta={'center'}>
|
||||||
|
<Button component="a" href={`https://github.com/cytrus-emu/cytrus/releases/download/${changes[0].text}/app-nightly-release.apk`} color="green" radius={'xl'} variant="filled">Android</Button>
|
||||||
|
<Menu opened={opened} onChange={setOpened}>
|
||||||
|
<Menu.Target>
|
||||||
|
<Button color="blue" radius={'xl'} variant="filled">Apple</Button>
|
||||||
|
</Menu.Target>
|
||||||
|
|
||||||
|
<Menu.Dropdown>
|
||||||
|
<Menu.Label>iOS, iPadOS</Menu.Label>
|
||||||
|
<Menu.Item component="a" href="https://folium.emuplace.app" leftSection={<IconDeviceTablet style={{ width: rem(14), height: rem(14) }} />}>
|
||||||
|
iPad
|
||||||
|
</Menu.Item>
|
||||||
|
<Menu.Item component="a" href="https://folium.emuplace.app" leftSection={<IconDeviceMobile style={{ width: rem(14), height: rem(14) }} />}>
|
||||||
|
iPhone
|
||||||
|
</Menu.Item>
|
||||||
|
<Menu.Divider />
|
||||||
|
<Menu.Label>macOS</Menu.Label>
|
||||||
|
<Menu.Item leftSection={<IconDeviceLaptop style={{ width: rem(14), height: rem(14) }} />} disabled>
|
||||||
|
Apple Silicon
|
||||||
|
</Menu.Item>
|
||||||
|
<Menu.Item leftSection={<IconDeviceLaptop style={{ width: rem(14), height: rem(14) }} />} disabled>
|
||||||
|
Intel
|
||||||
|
</Menu.Item>
|
||||||
|
</Menu.Dropdown>
|
||||||
|
</Menu>
|
||||||
|
<Button color="orange" radius={'xl'} variant="filled" disabled>Linux</Button>
|
||||||
|
<Button color="blue" component="a" href="https://github.com/cytrus-emu/cytrus/releases/download/v1.0.0/cytrus-windows-v1.0.0.7z" radius={'xl'} variant="filled">Windows</Button>
|
||||||
|
<Button color="gray" component="a" href="https://github.com/cytrus-emu/cytrus" radius={'xl'} variant="filled">Source Code</Button>
|
||||||
|
</Group>
|
||||||
|
</Flex>
|
||||||
|
<Space h={'md'} />
|
||||||
|
<Title order={2}>
|
||||||
|
Changes
|
||||||
|
</Title>
|
||||||
|
<Accordion classNames={classes} radius={'md'} variant="contained">
|
||||||
|
{items}
|
||||||
|
</Accordion>
|
||||||
|
</Stack>
|
||||||
|
</Flex>
|
||||||
|
</Container>
|
||||||
</MantineProvider>
|
</MantineProvider>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
@ -1,13 +0,0 @@
|
|||||||
import { Button, Group, useMantineColorScheme } from '@mantine/core';
|
|
||||||
|
|
||||||
export function ColorSchemeToggle() {
|
|
||||||
const { setColorScheme } = useMantineColorScheme();
|
|
||||||
|
|
||||||
return (
|
|
||||||
<Group justify="center" mt="xl">
|
|
||||||
<Button onClick={() => setColorScheme('light')}>Light</Button>
|
|
||||||
<Button onClick={() => setColorScheme('dark')}>Dark</Button>
|
|
||||||
<Button onClick={() => setColorScheme('auto')}>Auto</Button>
|
|
||||||
</Group>
|
|
||||||
);
|
|
||||||
}
|
|
@ -1,22 +0,0 @@
|
|||||||
import { style } from "@vanilla-extract/css";
|
|
||||||
import { vars } from "../theme";
|
|
||||||
import { rem } from "@mantine/core";
|
|
||||||
|
|
||||||
export const title = style({
|
|
||||||
color: vars.colors.black,
|
|
||||||
fontSize: rem(100),
|
|
||||||
fontWeight: 900,
|
|
||||||
letterSpacing: rem(-2),
|
|
||||||
|
|
||||||
selectors: {
|
|
||||||
[vars.darkSelector]: {
|
|
||||||
color: vars.colors.white,
|
|
||||||
},
|
|
||||||
},
|
|
||||||
|
|
||||||
"@media": {
|
|
||||||
[vars.smallerThan("md")]: {
|
|
||||||
fontSize: rem(50),
|
|
||||||
},
|
|
||||||
},
|
|
||||||
});
|
|
@ -1,28 +0,0 @@
|
|||||||
import { Title, Text, Anchor } from "@mantine/core";
|
|
||||||
import * as classes from "./Welcome.css";
|
|
||||||
|
|
||||||
export function Welcome() {
|
|
||||||
return (
|
|
||||||
<>
|
|
||||||
<Title className={classes.title} ta="center" mt={100}>
|
|
||||||
Welcome to{" "}
|
|
||||||
<Text
|
|
||||||
inherit
|
|
||||||
variant="gradient"
|
|
||||||
component="span"
|
|
||||||
gradient={{ from: "pink", to: "yellow" }}
|
|
||||||
>
|
|
||||||
Mantine
|
|
||||||
</Text>
|
|
||||||
</Title>
|
|
||||||
<Text color="dimmed" ta="center" size="lg" maw={580} mx="auto" mt="xl">
|
|
||||||
This starter Vite project includes a minimal setup, if you want to learn
|
|
||||||
more on Mantine + Vite integration follow{" "}
|
|
||||||
<Anchor href="https://mantine.dev/guides/vite/" size="lg">
|
|
||||||
this guide
|
|
||||||
</Anchor>
|
|
||||||
. To get started edit pages/Home.page.tsx file.
|
|
||||||
</Text>
|
|
||||||
</>
|
|
||||||
);
|
|
||||||
}
|
|
@ -1,5 +1,7 @@
|
|||||||
import { createTheme } from "@mantine/core";
|
import { createTheme } from "@mantine/core";
|
||||||
import { themeToVars } from "@mantine/vanilla-extract";
|
import { themeToVars } from "@mantine/vanilla-extract";
|
||||||
|
|
||||||
export const theme = createTheme({});
|
export const theme = createTheme({
|
||||||
|
primaryColor: 'yellow'
|
||||||
|
});
|
||||||
export const vars = themeToVars(theme);
|
export const vars = themeToVars(theme);
|
||||||
|
Loading…
Reference in New Issue
Block a user