Added initial website
27
.firebase/hosting.ZGlzdA.cache
Normal file
@ -0,0 +1,27 @@
|
|||||||
|
index.html,1724150865950,36bf694283661da8a383fc293740c6eacb230ad30982d4acbca572ca093d07b0
|
||||||
|
favicon.svg,1724150865785,adc7e10f9bbcf8f9f82633c10dff6adf766bb3b521a127257964852e54d40a7f
|
||||||
|
Icon_Favicon.png,1724150865785,bbe01a02150c6613c61a46825cc56efd7f9b8bdfde2cfa9045a067d9f30df4f8
|
||||||
|
rewrite/index.html,1724150865959,8e8c8eda6d3076ae3c8d3fb133de0234e37e68a9eebfb9f077961f1bfe1401a3
|
||||||
|
privacypolicy/index.html,1724150865950,af79c7b82f7bd2467ad474777bcdeddb3f98d3746a0e159a3ab03f8f1b066c37
|
||||||
|
assets/privacypolicy-DmHm4XD7.js,1724150865950,afb69f2e27557fd4d578d2760e1e957484a770d2efe9da9ac0cacd13c51403d6
|
||||||
|
assets/rewrite-DQvOf9hT.js,1724150865950,7fd513e1e92b61fd631ab850c28f105470660ee87b2272491d5d9bd936c093ff
|
||||||
|
assets/privacypolicy-CgDeaZox.css,1724150865950,365af215932a3b9f4d0ab994bb764044534be07e1a625db529637c5add2b5f2f
|
||||||
|
assets/Space-Bt6J9gIj.js,1724150865950,e6156cd91b77a65c38ec9e0770feb3487324743e07e8c065c9e1a2cd536b2f23
|
||||||
|
assets/index-D2CsErMz.js,1724150865950,3de642ba136ee18144d9ef0567870c2cece3ffcd3cc76f610c4cb4071de044c6
|
||||||
|
assets/Button-CqNtQ4v5.js,1724150865950,4af81a4eca8c1d5ad292711b9c45613820d9619f72bdde3be6d30d1096dc1c7a
|
||||||
|
assets/theme-Dl6AsU4L.css,1724150865950,b9c0cc5e686d3ded86588178e77631a80e95ba8e331f55ae2d2cd3916c3896f6
|
||||||
|
rewrite/authentication.png,1724150865803,28bc8b2ae33cfdc9e9e51300e578f090961606c4b5759d3bc64d8f47094a97fd
|
||||||
|
rewrite/archive.png,1724150865803,2fde90526c20baad0e6cf84796af2137052863cf8f3566ebd6ee97c50cdd08d4
|
||||||
|
assets/theme-BZwQ3l9Y.js,1724150865950,41f4f54294aa6bd890d35dc451367df99434593ff4f4353149745b8f58f7cbed
|
||||||
|
rewrite/cytrus_settings.png,1724150865803,f76460e380d7ed7022c779f1330db708c3234a79e73811f96aaa12239b93eaa9
|
||||||
|
rewrite/search.png,1724150865803,6c3b0836ea38572fb821565171c3cf5d798e40595224dc0002d1b77448fb8fb5
|
||||||
|
rewrite/grape.png,1724150865803,c4f1d78e2d3656b25b58eaabf6fe3dfb4cc5a3677d89fbf08c1d4a063551d64f
|
||||||
|
three.png,1724150865813,47ca5746a6e5e2ba1017a9f121e8d0b04a35c647352496a35e43a0c2cd3bdce4
|
||||||
|
rewrite/cytrus.png,1724150865803,0671f60315bf26e5fb8711e878869e1c2ae5a79df79148c5a57fbe87125fc821
|
||||||
|
rewrite/library.png,1724150865803,af9ea574d29d2a906e29634af7bb6fc9ac1b78207c5413633fe45518493d73c6
|
||||||
|
one.png,1724150865803,12faad801d3c8c2ef1303b051c9f12b360ad1a76c57873de15518b84d07b6c5c
|
||||||
|
four.png,1724150865785,7d346f574b0d4ce8756ecfbff6bbf36a6bd867d232146887d2b185e9e08e52cd
|
||||||
|
two.png,1724150865840,ff90e4f097bc234cd65f778995947f04fb46ca8decf2fbd46de1ab90e976ea47
|
||||||
|
rewrite/settings.png,1724150865813,0834ef2d654bd26ea1d8e1617a1f801ce16f0e1d953795ecd02456c74d3cd185
|
||||||
|
Icon.png,1724150865785,70699363f0a9ead886690eef35b2d1883d8927e9c7c2560914bd1d7cf606abe5
|
||||||
|
ipas/Folium-v1.6-Sideload.ipa.zip,1724150865794,d16ebbf593ae76f284091104d713af5f8d808817a124a3a8b5e33546fc9fd320
|
5
.firebaserc
Normal file
@ -0,0 +1,5 @@
|
|||||||
|
{
|
||||||
|
"projects": {
|
||||||
|
"default": "folium-45df2"
|
||||||
|
}
|
||||||
|
}
|
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:
|
||||||
|
- main
|
||||||
|
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_FOLIUM_45DF2 }}
|
||||||
|
channelId: live
|
||||||
|
projectId: folium-45df2
|
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_FOLIUM_45DF2 }}
|
||||||
|
projectId: folium-45df2
|
3
.vscode/settings.json
vendored
Normal file
@ -0,0 +1,3 @@
|
|||||||
|
{
|
||||||
|
"editor.detectIndentation": false
|
||||||
|
}
|
16
firebase.json
Normal file
@ -0,0 +1,16 @@
|
|||||||
|
{
|
||||||
|
"hosting": {
|
||||||
|
"public": "dist",
|
||||||
|
"ignore": [
|
||||||
|
"firebase.json",
|
||||||
|
"**/.*",
|
||||||
|
"**/node_modules/**"
|
||||||
|
],
|
||||||
|
"rewrites": [
|
||||||
|
{
|
||||||
|
"source": "**",
|
||||||
|
"destination": "/index.html"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
}
|
24
index.html
@ -1,16 +1,16 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html lang="en">
|
<html lang="en">
|
||||||
<head>
|
|
||||||
|
<head>
|
||||||
<meta charset="UTF-8" />
|
<meta charset="UTF-8" />
|
||||||
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
|
<link rel="icon" type="image/svg+xml" href="/Icon_Favicon.png" />
|
||||||
<meta
|
<meta name="viewport" content="minimum-scale=1, initial-scale=1, width=device-width, user-scalable=no" />
|
||||||
name="viewport"
|
<title>Folium</title>
|
||||||
content="minimum-scale=1, initial-scale=1, width=device-width, user-scalable=no"
|
</head>
|
||||||
/>
|
|
||||||
<title>Mantine Vite template</title>
|
<body>
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<div id="root"></div>
|
<div id="root"></div>
|
||||||
<script type="module" src="/src/main.tsx"></script>
|
<script type="module" src="src/NewHome/newhome_main.tsx"></script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
|
||||||
|
</html>
|
5970
package-lock.json
generated
Normal file
75
package.json
@ -1,37 +1,42 @@
|
|||||||
{
|
{
|
||||||
"name": "vite-min-template",
|
"name": "vite-min-template",
|
||||||
"private": true,
|
"private": true,
|
||||||
"version": "0.0.0",
|
"version": "0.0.0",
|
||||||
"type": "module",
|
"type": "module",
|
||||||
"scripts": {
|
"scripts": {
|
||||||
"dev": "vite dev",
|
"dev": "vite dev",
|
||||||
"build": "tsc && vite build",
|
"build": "tsc && vite build",
|
||||||
"lint": "eslint src --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
|
"lint": "eslint src --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
|
||||||
"preview": "vite preview"
|
"preview": "vite preview"
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@mantine/core": "7.10.0",
|
"@mantine/carousel": "^7.12.1",
|
||||||
"@mantine/hooks": "7.10.0",
|
"@mantine/core": "^7.10.0",
|
||||||
"@mantine/vanilla-extract": "7.10.0",
|
"@mantine/hooks": "7.10.0",
|
||||||
"@vanilla-extract/css": "^1.14.1",
|
"@mantine/vanilla-extract": "7.10.0",
|
||||||
"react": "^18.2.0",
|
"@tabler/icons-react": "^3.12.0",
|
||||||
"react-dom": "^18.2.0"
|
"@vanilla-extract/css": "^1.14.1",
|
||||||
},
|
"embla-carousel-react": "^7.1.0",
|
||||||
"devDependencies": {
|
"react": "^18.2.0",
|
||||||
"@types/react": "^18.2.65",
|
"react-dom": "^18.2.0",
|
||||||
"@types/react-dom": "^18.2.21",
|
"react-markdown": "^9.0.1",
|
||||||
"@typescript-eslint/eslint-plugin": "^7.2.0",
|
"react-tweet-embed": "^2.0.0"
|
||||||
"@typescript-eslint/parser": "^7.2.0",
|
},
|
||||||
"@vanilla-extract/vite-plugin": "^4.0.6",
|
"devDependencies": {
|
||||||
"@vitejs/plugin-react": "^4.2.1",
|
"@types/react": "^18.2.65",
|
||||||
"eslint": "^8.57.0",
|
"@types/react-dom": "^18.2.21",
|
||||||
"eslint-plugin-react-hooks": "^4.6.0",
|
"@typescript-eslint/eslint-plugin": "^7.2.0",
|
||||||
"eslint-plugin-react-refresh": "^0.4.5",
|
"@typescript-eslint/parser": "^7.2.0",
|
||||||
"postcss": "^8.4.35",
|
"@vanilla-extract/vite-plugin": "^4.0.6",
|
||||||
"postcss-preset-mantine": "1.15.0",
|
"@vitejs/plugin-react": "^4.2.1",
|
||||||
"postcss-simple-vars": "^7.0.1",
|
"eslint": "^8.57.0",
|
||||||
"typescript": "^5.4.2",
|
"eslint-plugin-react-hooks": "^4.6.0",
|
||||||
"vite": "^5.1.6"
|
"eslint-plugin-react-refresh": "^0.4.5",
|
||||||
},
|
"postcss": "^8.4.35",
|
||||||
"packageManager": "yarn@4.2.2"
|
"postcss-preset-mantine": "1.15.0",
|
||||||
|
"postcss-simple-vars": "^7.0.1",
|
||||||
|
"typescript": "^5.4.2",
|
||||||
|
"vite": "^5.1.6"
|
||||||
|
},
|
||||||
|
"packageManager": "yarn@4.2.2"
|
||||||
}
|
}
|
||||||
|
16
privacypolicy/index.html
Normal file
@ -0,0 +1,16 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8" />
|
||||||
|
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
|
||||||
|
<meta name="viewport" content="minimum-scale=1, initial-scale=1, width=device-width, user-scalable=no" />
|
||||||
|
<title>Privacy Policy</title>
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
<div id="root"></div>
|
||||||
|
<script type="module" src="../src/PrivacyPolicy/privacypolicy_main.tsx"></script>
|
||||||
|
</body>
|
||||||
|
|
||||||
|
</html>
|
BIN
public/Icon.png
Normal file
After Width: | Height: | Size: 4.0 MiB |
BIN
public/Icon_Favicon.png
Normal file
After Width: | Height: | Size: 5.4 KiB |
BIN
public/four.png
Normal file
After Width: | Height: | Size: 3.3 MiB |
BIN
public/ipas/Folium-v1.6-Sideload.ipa.zip
Normal file
BIN
public/one.png
Normal file
After Width: | Height: | Size: 3.2 MiB |
BIN
public/rewrite/archive.png
Normal file
After Width: | Height: | Size: 113 KiB |
BIN
public/rewrite/authentication.png
Normal file
After Width: | Height: | Size: 85 KiB |
BIN
public/rewrite/cytrus.png
Normal file
After Width: | Height: | Size: 2.7 MiB |
BIN
public/rewrite/cytrus_settings.png
Normal file
After Width: | Height: | Size: 247 KiB |
BIN
public/rewrite/grape.png
Normal file
After Width: | Height: | Size: 905 KiB |
BIN
public/rewrite/library.png
Normal file
After Width: | Height: | Size: 2.9 MiB |
BIN
public/rewrite/mango.png
Normal file
After Width: | Height: | Size: 454 KiB |
BIN
public/rewrite/search.png
Normal file
After Width: | Height: | Size: 730 KiB |
BIN
public/rewrite/settings.png
Normal file
After Width: | Height: | Size: 6.2 MiB |
BIN
public/three.png
Normal file
After Width: | Height: | Size: 2.4 MiB |
BIN
public/two.png
Normal file
After Width: | Height: | Size: 3.6 MiB |
16
rewrite/index.html
Normal file
@ -0,0 +1,16 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8" />
|
||||||
|
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
|
||||||
|
<meta name="viewport" content="minimum-scale=1, initial-scale=1, width=device-width, user-scalable=no" />
|
||||||
|
<title>Rewrite (v1.7)</title>
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
<div id="root"></div>
|
||||||
|
<script type="module" src="../src/Rewrite/rewrite_main.tsx"></script>
|
||||||
|
</body>
|
||||||
|
|
||||||
|
</html>
|
14
src/App.tsx
@ -1,14 +0,0 @@
|
|||||||
import "@mantine/core/styles.css";
|
|
||||||
import { MantineProvider } from "@mantine/core";
|
|
||||||
import { theme } from "./theme";
|
|
||||||
import { Welcome } from "./Welcome/Welcome";
|
|
||||||
import { ColorSchemeToggle } from "./ColorSchemeToggle/ColorSchemeToggle";
|
|
||||||
|
|
||||||
export default function App() {
|
|
||||||
return (
|
|
||||||
<MantineProvider theme={theme}>
|
|
||||||
<Welcome />
|
|
||||||
<ColorSchemeToggle />
|
|
||||||
</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>
|
|
||||||
);
|
|
||||||
}
|
|
40
src/Home/Home.tsx
Normal file
@ -0,0 +1,40 @@
|
|||||||
|
import '@mantine/carousel/styles.css';
|
||||||
|
import "@mantine/core/styles.css";
|
||||||
|
import { Container, MantineProvider, Space } from "@mantine/core";
|
||||||
|
import { theme } from "../theme";
|
||||||
|
// import { CardsCarousel } from './CardsCarousel/CardsCarousel';
|
||||||
|
// import { DoubleHeader } from "./DoubleHeader/DoubleHeader";
|
||||||
|
// import { FAQSimple } from "./FAQSimple/FAQSimple";
|
||||||
|
// import { FooterSimple } from "./FooterSimple/FooterSimple";
|
||||||
|
// import { NintendoFeaturesTitle } from "./FeaturesTitles/NintendoFeaturesTitle";
|
||||||
|
// import { PlayStationFeaturesTitle } from "./FeaturesTitles/PlayStationFeaturesTitle";
|
||||||
|
// import { SEGAFeaturesTitle } from './FeaturesTitles/SEGAFeaturesTitle';
|
||||||
|
// // import { HeroText } from "./HeroText/HeroText";
|
||||||
|
// import { Welcome } from "./Welcome/Welcome";
|
||||||
|
//
|
||||||
|
// import { HomeGameplayCarousel } from './HomeGameplayCarousel/HomeGameplayCarousel';
|
||||||
|
// import { DeveloperFooter } from './DeveloperFooter/DeveloperFooter';
|
||||||
|
|
||||||
|
import { HomeHero } from './HomeHero/HomeHero';
|
||||||
|
import { HomeCores } from './HomeCores/HomeCores';
|
||||||
|
import { HomeScreenshots } from './HomeScreenshots/HomeScreenshots';
|
||||||
|
import { HomeFAQ } from './HomeFAQ/HomeFAQ';
|
||||||
|
import { HomeFooter } from './HomeFooter/HomeFooter';
|
||||||
|
|
||||||
|
export default function Home() {
|
||||||
|
return (
|
||||||
|
<MantineProvider theme={theme}>
|
||||||
|
<Container pt={100}>
|
||||||
|
<HomeHero />
|
||||||
|
<Space h={'xl'} />
|
||||||
|
<HomeCores />
|
||||||
|
<Space h={'xl'} />
|
||||||
|
<HomeScreenshots />
|
||||||
|
<Space h={'xl'} />
|
||||||
|
<HomeFAQ />
|
||||||
|
<Space h={'xl'} />
|
||||||
|
<HomeFooter />
|
||||||
|
</Container>
|
||||||
|
</MantineProvider>
|
||||||
|
);
|
||||||
|
}
|
104
src/Home/HomeCores/HomeCoreCard.tsx
Normal file
@ -0,0 +1,104 @@
|
|||||||
|
import {
|
||||||
|
Badge, SimpleGrid,
|
||||||
|
Space, Text, ThemeIcon,
|
||||||
|
Title, useMantineTheme
|
||||||
|
} from '@mantine/core';
|
||||||
|
import { Icon, IconProps } from '@tabler/icons-react';
|
||||||
|
import { ForwardRefExoticComponent, RefAttributes } from 'react';
|
||||||
|
|
||||||
|
interface HomeCoreFeatures {
|
||||||
|
icon: ForwardRefExoticComponent<Omit<IconProps, "ref"> & RefAttributes<Icon>>;
|
||||||
|
title: string;
|
||||||
|
subtitle: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
export enum Availability {
|
||||||
|
AVAILABLE = 0,
|
||||||
|
COMING_SOON = 1
|
||||||
|
}
|
||||||
|
|
||||||
|
interface HomeCoreCardProps {
|
||||||
|
availability: Availability;
|
||||||
|
features: Array<HomeCoreFeatures>;
|
||||||
|
subtitle: string;
|
||||||
|
title: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
export function HomeCoreCard({ title, subtitle, availability, features }: HomeCoreCardProps) {
|
||||||
|
const theme = useMantineTheme();
|
||||||
|
|
||||||
|
const map = features.map((feature) => (
|
||||||
|
<div key={feature.title}>
|
||||||
|
<ThemeIcon radius='md' size={'lg'}>
|
||||||
|
<feature.icon style={{ height: '66%', width: '66%' }} />
|
||||||
|
</ThemeIcon>
|
||||||
|
<Space h={'md'} />
|
||||||
|
<Title order={3}>
|
||||||
|
{feature.title}
|
||||||
|
</Title>
|
||||||
|
<Text c={'dimmed'}>
|
||||||
|
{feature.subtitle}
|
||||||
|
</Text>
|
||||||
|
</div>
|
||||||
|
));
|
||||||
|
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<Title order={2}>
|
||||||
|
{title}
|
||||||
|
</Title>
|
||||||
|
<Text c={'dimmed'}>
|
||||||
|
{subtitle}
|
||||||
|
</Text>
|
||||||
|
<Space h={'md'} />
|
||||||
|
<Badge color={availability == Availability.AVAILABLE ? theme.primaryColor : 'orange'}>
|
||||||
|
{availability == Availability.AVAILABLE ? 'Available Now' : 'Coming Soon'}
|
||||||
|
</Badge>
|
||||||
|
<Space h={'lg'} />
|
||||||
|
<SimpleGrid cols={{ base: 1, sm: 2 }}>
|
||||||
|
{map}
|
||||||
|
</SimpleGrid>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
|
||||||
|
/*
|
||||||
|
const items = features.map((feature) => (
|
||||||
|
<div key={feature.title}>
|
||||||
|
<ThemeIcon
|
||||||
|
size={'xl'}
|
||||||
|
radius="md"
|
||||||
|
color={'black'}
|
||||||
|
>
|
||||||
|
<feature.icon style={{ width: rem(26), height: rem(26) }} stroke={2} />
|
||||||
|
</ThemeIcon>
|
||||||
|
<Text fz="lg" mt="sm" fw={500}>
|
||||||
|
{feature.title}
|
||||||
|
</Text>
|
||||||
|
<Text c="dimmed" fz="sm">
|
||||||
|
{feature.subtitle}
|
||||||
|
</Text>
|
||||||
|
</div>
|
||||||
|
));
|
||||||
|
|
||||||
|
return (
|
||||||
|
<Grid gutter={80}>
|
||||||
|
<Grid.Col span={{ base: 12, md: 5 }}>
|
||||||
|
<Title className={classes.title} order={2}>
|
||||||
|
{title}
|
||||||
|
</Title>
|
||||||
|
<Text c="dimmed">
|
||||||
|
{subtitle}
|
||||||
|
</Text>
|
||||||
|
<Text c={availability == 'Available Now' ? 'green' : 'orange'}>
|
||||||
|
{availability}
|
||||||
|
</Text>
|
||||||
|
</Grid.Col>
|
||||||
|
<Grid.Col span={{ base: 12, md: 7 }}>
|
||||||
|
<SimpleGrid cols={{ base: 1, md: 2 }} spacing={30}>
|
||||||
|
{items}
|
||||||
|
</SimpleGrid>
|
||||||
|
</Grid.Col>
|
||||||
|
</Grid>
|
||||||
|
);*/
|
||||||
|
}
|
23
src/Home/HomeCores/HomeCores.module.css
Normal file
@ -0,0 +1,23 @@
|
|||||||
|
.wrapper {
|
||||||
|
position: relative;
|
||||||
|
margin-bottom: rem(120px);
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
.title {
|
||||||
|
font-family:
|
||||||
|
Greycliff CF,
|
||||||
|
var(--mantine-font-family);
|
||||||
|
font-size: rem(36px);
|
||||||
|
font-weight: 900;
|
||||||
|
line-height: 1.1;
|
||||||
|
margin-bottom: var(--mantine-spacing-md);
|
||||||
|
color: light-dark(var(--mantine-color-black), var(--mantine-color-white));
|
||||||
|
}
|
||||||
|
|
||||||
|
.control {
|
||||||
|
&[data-inactive] {
|
||||||
|
opacity: 0;
|
||||||
|
cursor: default;
|
||||||
|
}
|
||||||
|
}
|
155
src/Home/HomeCores/HomeCores.tsx
Normal file
@ -0,0 +1,155 @@
|
|||||||
|
/*
|
||||||
|
import { Carousel } from '@mantine/carousel';
|
||||||
|
import { Container, rem } from '@mantine/core';
|
||||||
|
import {
|
||||||
|
IconDeviceGamepad, IconDeviceGamepad2, IconBrandGithub,
|
||||||
|
IconMicrophone, IconVolume, IconCircleArrowLeft,
|
||||||
|
IconCircleArrowRight
|
||||||
|
} from '@tabler/icons-react';
|
||||||
|
import { HomeCoreCard } from './HomeCoreCard';
|
||||||
|
import classes from './HomeCores.module.css';
|
||||||
|
*/
|
||||||
|
|
||||||
|
import { Tabs, Space, Title } from "@mantine/core";
|
||||||
|
import {
|
||||||
|
IconDeviceGamepad, IconDeviceGamepad2, IconBrandGithub,
|
||||||
|
IconMicrophone, IconVolume
|
||||||
|
} from '@tabler/icons-react';
|
||||||
|
import { Availability, HomeCoreCard } from './HomeCoreCard';
|
||||||
|
|
||||||
|
const data = [
|
||||||
|
{
|
||||||
|
availability: Availability.AVAILABLE,
|
||||||
|
features: [
|
||||||
|
{
|
||||||
|
icon: IconDeviceGamepad,
|
||||||
|
title: 'Full Controller Support',
|
||||||
|
subtitle: 'Supports Backbone One, PlayStation DualShock 4, PlayStation 5 DualSense, Xbox Series S and Xbox Series X controllers'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
icon: IconBrandGithub,
|
||||||
|
title: 'Fully Open Source',
|
||||||
|
subtitle: 'Licensed under GPLv3 to maintain full transparency and to give people the opportunity to build Folium for themselves'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
icon: IconMicrophone,
|
||||||
|
title: 'Audio Input',
|
||||||
|
subtitle: 'Making use of OpenAL, Folium provides supported cores with crystal clear audio input'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
icon: IconVolume,
|
||||||
|
title: 'Native Audio Output',
|
||||||
|
subtitle: 'Making use of Apple\'s CoreAudio API, Folium provides a seamless audio listening experience'
|
||||||
|
}
|
||||||
|
],
|
||||||
|
title: 'Nintendo',
|
||||||
|
subtitle: 'Emulate the Game Boy Advance, Nintendo 3DS and Nintendo DS'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
availability: Availability.COMING_SOON,
|
||||||
|
features: [
|
||||||
|
{
|
||||||
|
icon: IconDeviceGamepad2,
|
||||||
|
title: 'Full Controller Support',
|
||||||
|
subtitle: 'Supports Backbone One, PlayStation DualShock 4, PlayStation 5 DualSense, Xbox Series S and Xbox Series X controllers'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
icon: IconBrandGithub,
|
||||||
|
title: 'Fully Open Source',
|
||||||
|
subtitle: 'Licensed under GPLv3 to maintain full transparency and to give people the oppurtunity to build Folium for themselves'
|
||||||
|
}
|
||||||
|
],
|
||||||
|
title: 'PlayStation',
|
||||||
|
subtitle: 'Emulate the PlayStation 1 and PlayStation 2'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
availability: Availability.COMING_SOON,
|
||||||
|
features: [
|
||||||
|
{
|
||||||
|
icon: IconDeviceGamepad,
|
||||||
|
title: 'Full Controller Support',
|
||||||
|
subtitle: 'Supports Backbone One, PlayStation DualShock 4, PlayStation 5 DualSense, Xbox Series S and Xbox Series X controllers'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
icon: IconBrandGithub,
|
||||||
|
title: 'Fully Open Source',
|
||||||
|
subtitle: 'Licensed under GPLv3 to maintain full transparency and to give people the oppurtunity to build Folium for themselves'
|
||||||
|
}
|
||||||
|
],
|
||||||
|
title: 'SEGA',
|
||||||
|
subtitle: 'Emulate the SEGA Genesis'
|
||||||
|
}
|
||||||
|
];
|
||||||
|
|
||||||
|
export function HomeCores() {
|
||||||
|
const tabValues = [
|
||||||
|
{
|
||||||
|
disabled: false,
|
||||||
|
id: 'nintendo',
|
||||||
|
title: 'Nintendo'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
disabled: true,
|
||||||
|
id: 'playstation',
|
||||||
|
title: 'PlayStation'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
disabled: true,
|
||||||
|
id: 'sega',
|
||||||
|
title: 'SEGA'
|
||||||
|
}
|
||||||
|
];
|
||||||
|
|
||||||
|
const tabs = tabValues.map((tab) => (
|
||||||
|
<Tabs.Tab disabled={tab.disabled} value={tab.id}>{tab.title}</Tabs.Tab>
|
||||||
|
));
|
||||||
|
|
||||||
|
const panels = tabValues.map((tab, index) => (
|
||||||
|
<Tabs.Panel value={tab.id}>
|
||||||
|
<HomeCoreCard {...data[index]} />
|
||||||
|
</Tabs.Panel>
|
||||||
|
));
|
||||||
|
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<Title order={1}>
|
||||||
|
Cores
|
||||||
|
</Title>
|
||||||
|
<Space h={'md'} />
|
||||||
|
<Tabs defaultValue={tabValues[0].id} radius={'xl'} variant="pills">
|
||||||
|
<Tabs.List>
|
||||||
|
{tabs}
|
||||||
|
</Tabs.List>
|
||||||
|
<Space h={'md'} />
|
||||||
|
{...panels}
|
||||||
|
</Tabs>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
|
||||||
|
/*
|
||||||
|
const slides = data.map((item) => (
|
||||||
|
<Carousel.Slide key={item.title}>
|
||||||
|
<HomeCoreCard {...item} />
|
||||||
|
</Carousel.Slide>
|
||||||
|
));
|
||||||
|
|
||||||
|
return (
|
||||||
|
<Container className={classes.wrapper}>
|
||||||
|
<Carousel
|
||||||
|
align={'start'}
|
||||||
|
classNames={classes}
|
||||||
|
slideSize={'100%'}
|
||||||
|
slideGap={{ base: rem(2), sm: 'xl' }}
|
||||||
|
nextControlIcon={
|
||||||
|
<IconCircleArrowRight size={'lg'} />
|
||||||
|
}
|
||||||
|
previousControlIcon={
|
||||||
|
<IconCircleArrowLeft size={'lg'} />
|
||||||
|
}
|
||||||
|
>
|
||||||
|
{slides}
|
||||||
|
</Carousel>
|
||||||
|
</Container>
|
||||||
|
);
|
||||||
|
*/
|
||||||
|
}
|
86
src/Home/HomeFAQ/HomeFAQ.tsx
Normal file
@ -0,0 +1,86 @@
|
|||||||
|
import { Space, Title, Accordion } from '@mantine/core';
|
||||||
|
import { IconMoneybag, IconFileImport, IconPaint } from '@tabler/icons-react';
|
||||||
|
|
||||||
|
/*
|
||||||
|
const questions = [
|
||||||
|
{
|
||||||
|
value: 'purchase-price-and-type',
|
||||||
|
answer: 'Folium will cost a one-time payment of $4.99 USD',
|
||||||
|
question: 'What will Folium cost on the App Store?'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: 'games-and-system-files',
|
||||||
|
answer: 'Games and system files must be dumped from a console or handheld you own',
|
||||||
|
question: 'How do we get games and system files?'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: 'supported-and-upcoming-cores',
|
||||||
|
answer: 'Currently the Game Boy Advance, Nintendo 3DS and Nintendo DS are supported with plans for a handful of other retro consoles and handhelds to be added',
|
||||||
|
question: 'What consoles and handhelds are and will be supported?'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: 'is-jit-supported',
|
||||||
|
answer: 'No. Apple does not allow JIT for apps on both the App Store and TestFlight',
|
||||||
|
question: 'Does Folium on the App Store or TestFlight support JIT?'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: 'game-compatibility',
|
||||||
|
answer: 'Folium has a high compatibility for most games in most of the cores however, some games work better than others and the device it is being played on plays a significant role in compatibility',
|
||||||
|
question: 'Do all games work on all cores within Folium?'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: 'missing-features-and-functionality',
|
||||||
|
answer: 'Folium is still very much a work-in-progress, a lot of features and functionality do exist within the app but there is still a lot more that need to be added',
|
||||||
|
question: 'Does Folium contain all features and functionality?'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: 'cheats-mods-and-saves',
|
||||||
|
answer: 'The Cytrus core supports all 3 however, some need to be done manually through Files. Grape supports saves but neither cheats nor mods at this time',
|
||||||
|
question: 'Does Folium support cheats, mods and saves?'
|
||||||
|
},
|
||||||
|
];
|
||||||
|
*/
|
||||||
|
|
||||||
|
const questions = [
|
||||||
|
{
|
||||||
|
icon: IconMoneybag,
|
||||||
|
id: 'pricing',
|
||||||
|
question: 'How much does Folium cost on the App Store?',
|
||||||
|
answer: 'Folium costs a one-time payment of $4.99 USD'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
icon: IconFileImport,
|
||||||
|
id: 'file-types',
|
||||||
|
question: 'What file extensions does Folium support?',
|
||||||
|
answer: 'Folium currently supports .3ds, .app, .cia, .cci and .cxi for Cytrus and .gba, .ds and .nds for Grape'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
icon: IconPaint,
|
||||||
|
id: 'skins',
|
||||||
|
question: 'How does someone make a skin for Folium?',
|
||||||
|
answer: 'Skins can be made by following the guide here: https://official-antique.gitbook.io/folium'
|
||||||
|
}
|
||||||
|
];
|
||||||
|
|
||||||
|
export function HomeFAQ() {
|
||||||
|
const map = questions.map((question) => (
|
||||||
|
<Accordion.Item value={question.id}>
|
||||||
|
<Accordion.Control icon={<question.icon size={20} />}>
|
||||||
|
{question.question}
|
||||||
|
</Accordion.Control>
|
||||||
|
<Accordion.Panel>{question.answer}</Accordion.Panel>
|
||||||
|
</Accordion.Item>
|
||||||
|
));
|
||||||
|
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<Title order={1}>
|
||||||
|
Frequently Asked Questions
|
||||||
|
</Title>
|
||||||
|
<Space h={'md'} />
|
||||||
|
<Accordion radius={'md'} variant="contained">
|
||||||
|
{map}
|
||||||
|
</Accordion>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
}
|
21
src/Home/HomeFooter/HomeFooter.module.css
Normal file
@ -0,0 +1,21 @@
|
|||||||
|
.footer {
|
||||||
|
border-top: rem(1px) solid light-dark(var(--mantine-color-gray-2), var(--mantine-color-dark-5));
|
||||||
|
}
|
||||||
|
|
||||||
|
.inner {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
padding-top: var(--mantine-spacing-xl);
|
||||||
|
padding-bottom: var(--mantine-spacing-xl);
|
||||||
|
|
||||||
|
@media (max-width: $mantine-breakpoint-xs) {
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.links {
|
||||||
|
@media (max-width: $mantine-breakpoint-xs) {
|
||||||
|
margin-top: var(--mantine-spacing-md);
|
||||||
|
}
|
||||||
|
}
|
50
src/Home/HomeFooter/HomeFooter.tsx
Normal file
@ -0,0 +1,50 @@
|
|||||||
|
import { Container, Group, ActionIcon, Title } from '@mantine/core';
|
||||||
|
import {
|
||||||
|
IconBrandReddit, IconBrandTwitch,
|
||||||
|
IconBrandTwitter, IconBrandYoutube
|
||||||
|
} from '@tabler/icons-react';
|
||||||
|
import classes from './HomeFooter.module.css';
|
||||||
|
|
||||||
|
export function HomeFooter() {
|
||||||
|
return (
|
||||||
|
<div className={classes.footer}>
|
||||||
|
<Container className={classes.inner}>
|
||||||
|
<Title order={2}>
|
||||||
|
Folium
|
||||||
|
</Title>
|
||||||
|
<Group className={classes.links} justify="flex-end" wrap="nowrap">
|
||||||
|
{/*<ActionIcon onClick={(event) => {
|
||||||
|
window.open('https://youtube.com/watch?v=dQw4w9WgXcQ', '_blank');
|
||||||
|
event.preventDefault();
|
||||||
|
}} color='blue' size="lg" variant="transparent">
|
||||||
|
<IconBrandOnlyfans style={{ width: '70%', height: '70%' }} stroke={2} />
|
||||||
|
</ActionIcon>*/}
|
||||||
|
<ActionIcon onClick={(event) => {
|
||||||
|
window.open('https://reddit.com/u/antique_codes', '_blank');
|
||||||
|
event.preventDefault();
|
||||||
|
}} color='orange' size="lg" variant="transparent">
|
||||||
|
<IconBrandReddit style={{ width: '70%', height: '70%' }} stroke={2} />
|
||||||
|
</ActionIcon>
|
||||||
|
<ActionIcon onClick={(event) => {
|
||||||
|
window.open('https://twitch.tv/antique_codes', '_blank');
|
||||||
|
event.preventDefault();
|
||||||
|
}} color='violet' size="lg" variant="transparent">
|
||||||
|
<IconBrandTwitch style={{ width: '70%', height: '70%' }} stroke={2} />
|
||||||
|
</ActionIcon>
|
||||||
|
<ActionIcon onClick={(event) => {
|
||||||
|
window.open('https://twitter.com/antique_codes', '_blank');
|
||||||
|
event.preventDefault();
|
||||||
|
}} color='blue' size="lg" variant="transparent">
|
||||||
|
<IconBrandTwitter style={{ width: '70%', height: '70%' }} stroke={2} />
|
||||||
|
</ActionIcon>
|
||||||
|
<ActionIcon onClick={(event) => {
|
||||||
|
window.open('https://www.youtube.com/@antique_plays', '_blank');
|
||||||
|
event.preventDefault();
|
||||||
|
}} color='red' size="lg" variant="transparent">
|
||||||
|
<IconBrandYoutube style={{ width: '70%', height: '70%' }} stroke={2} />
|
||||||
|
</ActionIcon>
|
||||||
|
</Group>
|
||||||
|
</Container>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
22
src/Home/HomeHero/HomeHero.css.ts
Normal file
@ -0,0 +1,22 @@
|
|||||||
|
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),
|
||||||
|
},
|
||||||
|
},
|
||||||
|
});
|
63
src/Home/HomeHero/HomeHero.module.css
Normal file
@ -0,0 +1,63 @@
|
|||||||
|
.wrapper {
|
||||||
|
position: relative;
|
||||||
|
margin-bottom: rem(120px);
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
.inner {
|
||||||
|
position: relative;
|
||||||
|
padding-top: rem(200px);
|
||||||
|
padding-bottom: rem(120px);
|
||||||
|
|
||||||
|
@media (max-width: $mantine-breakpoint-sm) {
|
||||||
|
padding-bottom: rem(80px);
|
||||||
|
padding-top: rem(80px);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.title {
|
||||||
|
font-family:
|
||||||
|
Greycliff CF,
|
||||||
|
var(--mantine-font-family);
|
||||||
|
font-size: rem(62px);
|
||||||
|
font-weight: 900;
|
||||||
|
line-height: 1.1;
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
color: light-dark(var(--mantine-color-black), var(--mantine-color-white));
|
||||||
|
|
||||||
|
@media (max-width: $mantine-breakpoint-sm) {
|
||||||
|
font-size: rem(42px);
|
||||||
|
line-height: 1.2;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.description {
|
||||||
|
margin-top: var(--mantine-spacing-xl);
|
||||||
|
font-size: rem(24px);
|
||||||
|
|
||||||
|
@media (max-width: $mantine-breakpoint-sm) {
|
||||||
|
font-size: rem(18px);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.controls {
|
||||||
|
margin-top: calc(var(--mantine-spacing-xl) * 2);
|
||||||
|
|
||||||
|
@media (max-width: $mantine-breakpoint-sm) {
|
||||||
|
margin-top: var(--mantine-spacing-xl);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.control {
|
||||||
|
height: rem(54px);
|
||||||
|
padding-left: rem(38px);
|
||||||
|
padding-right: rem(38px);
|
||||||
|
|
||||||
|
@media (max-width: $mantine-breakpoint-sm) {
|
||||||
|
height: rem(54px);
|
||||||
|
padding-left: rem(18px);
|
||||||
|
padding-right: rem(18px);
|
||||||
|
flex: 1;
|
||||||
|
}
|
||||||
|
}
|
158
src/Home/HomeHero/HomeHero.tsx
Normal file
@ -0,0 +1,158 @@
|
|||||||
|
import {
|
||||||
|
Blockquote, Button, Group, SimpleGrid, Space, Stack, Text, Title,
|
||||||
|
useMantineTheme
|
||||||
|
} from '@mantine/core';
|
||||||
|
import {
|
||||||
|
IconBrandDiscord, IconBrandGithub,
|
||||||
|
IconExclamationCircle
|
||||||
|
} from '@tabler/icons-react';
|
||||||
|
|
||||||
|
export function HomeHero() {
|
||||||
|
const theme = useMantineTheme();
|
||||||
|
|
||||||
|
// const map = changes.map((change) => (
|
||||||
|
// <Accordion.Item value={change.id}>
|
||||||
|
// <Accordion.Control icon={<IconTimelineEventText size={20} />}>
|
||||||
|
// {change.title}
|
||||||
|
// </Accordion.Control>
|
||||||
|
// <Accordion.Panel>
|
||||||
|
// <List>
|
||||||
|
// {change.changes.map((change) => (<List.Item>{change}</List.Item>))}
|
||||||
|
// </List>
|
||||||
|
// </Accordion.Panel>
|
||||||
|
// </Accordion.Item>
|
||||||
|
// ));
|
||||||
|
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<Title c={theme.primaryColor} order={1}>
|
||||||
|
Folium
|
||||||
|
</Title>
|
||||||
|
<Text c={'dimmed'}>
|
||||||
|
Beautifully designed, high performing multi-system emulation in the palm of your hands
|
||||||
|
</Text>
|
||||||
|
<Space h={'md'} />
|
||||||
|
<Group>
|
||||||
|
<Stack gap={'sm'}>
|
||||||
|
<Button onClick={(event) => {
|
||||||
|
window.open('ipas/Folium-v1.6-Sideload.ipa.zip', '_blank');
|
||||||
|
event.preventDefault();
|
||||||
|
}} radius={'xl'} variant='default'>
|
||||||
|
Download
|
||||||
|
</Button>
|
||||||
|
<Text c={'dimmed'} ta={'center'}>v1.6</Text>
|
||||||
|
</Stack>
|
||||||
|
<Stack gap={'sm'}>
|
||||||
|
<Button onClick={(event) => {
|
||||||
|
window.open('https://apps.apple.com/us/app/folium/id6498623389', '_blank');
|
||||||
|
event.preventDefault();
|
||||||
|
}} radius={'xl'}>
|
||||||
|
$4.99 USD
|
||||||
|
</Button>
|
||||||
|
<Text c={'dimmed'} ta={'center'}>v1.6</Text>
|
||||||
|
</Stack>
|
||||||
|
</Group>
|
||||||
|
<Space h={'xl'} />
|
||||||
|
<Blockquote color='red' icon={<IconExclamationCircle size={30} />} iconSize={30} px={'md'} py={'md'} radius={'md'}>
|
||||||
|
Please read the rules before interacting with the Discord server
|
||||||
|
</Blockquote>
|
||||||
|
<Space h={'xl'} />
|
||||||
|
<SimpleGrid cols={{ base: 1, sm: 2 }}>
|
||||||
|
<div key={'discord'}>
|
||||||
|
<Title c={'violet'} order={1}>
|
||||||
|
<IconBrandDiscord /> Discord
|
||||||
|
</Title>
|
||||||
|
<Text c={'dimmed'}>
|
||||||
|
Join the Discord server and get or give help, post gameplay videos and know when the latest releases are available!
|
||||||
|
</Text>
|
||||||
|
<Space h={'md'} />
|
||||||
|
<Button color='violet' onClick={(event) => {
|
||||||
|
window.open('https://discord.gg/TqsjtpaAtk', '_blank');
|
||||||
|
event.preventDefault();
|
||||||
|
}} radius={'xl'}>
|
||||||
|
Accept Invitation
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
|
<div key={'discord'}>
|
||||||
|
<Title order={1}>
|
||||||
|
<IconBrandGithub /> GitHub
|
||||||
|
</Title>
|
||||||
|
<Text c={'dimmed'}>
|
||||||
|
Browse the Folium codebase along with the codebase's of all cores used within the application
|
||||||
|
</Text>
|
||||||
|
<Space h={'md'} />
|
||||||
|
<Button onClick={(event) => {
|
||||||
|
window.open('https://github.com/folium-app', '_blank');
|
||||||
|
event.preventDefault();
|
||||||
|
}} radius={'xl'} variant='default'>
|
||||||
|
Open in GitHub
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
|
</SimpleGrid>
|
||||||
|
{
|
||||||
|
/*
|
||||||
|
<Space h={'xl'} />
|
||||||
|
<Title order={1}>
|
||||||
|
Upcoming (v1.4)
|
||||||
|
</Title>
|
||||||
|
<Text c={'dimmed'}>
|
||||||
|
Below is a non-exhaustive list of all upcoming additions, changes and fixes coming to Folium
|
||||||
|
</Text>
|
||||||
|
<Space h={'md'} />
|
||||||
|
<Accordion radius={'md'} variant="contained">
|
||||||
|
{map}
|
||||||
|
</Accordion>
|
||||||
|
*/
|
||||||
|
}
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
|
||||||
|
/*
|
||||||
|
return (
|
||||||
|
<Container className={classes2.wrapper}>
|
||||||
|
<Title className={classes.title} ta="center" mt={100}>
|
||||||
|
Welcome to{" "}
|
||||||
|
<Text
|
||||||
|
inherit
|
||||||
|
component="span"
|
||||||
|
c={'green'}>
|
||||||
|
Folium
|
||||||
|
</Text>
|
||||||
|
</Title>
|
||||||
|
<Text c="dimmed" ta="center" size="lg" maw={580} mx="auto" mt="xl">
|
||||||
|
Beautifully designed, high performing multi-system emulation in the palm of your hands
|
||||||
|
</Text>
|
||||||
|
<Space h={'xl'} />
|
||||||
|
<Center>
|
||||||
|
<Stack align='center'>
|
||||||
|
<Group>
|
||||||
|
<Stack align='center'>
|
||||||
|
<Button color={'black'} radius="xl" size="lg" variant="default" onClick={(event) => {
|
||||||
|
window.open('/ipas/Folium-v1.0.9-Sideload.ipa.zip', '_blank');
|
||||||
|
event.preventDefault();
|
||||||
|
}}>
|
||||||
|
Download
|
||||||
|
</Button>
|
||||||
|
<Text c={'dimmed'} size='md'>
|
||||||
|
v1.0.9 Sideload
|
||||||
|
</Text>
|
||||||
|
</Stack>
|
||||||
|
<Stack align='center'>
|
||||||
|
<Button color={'blue'} radius="xl" size="lg" variant="filled">
|
||||||
|
$4.99
|
||||||
|
</Button>
|
||||||
|
<Text c={'dimmed'} size='md'>
|
||||||
|
v1.0.9 AppStore
|
||||||
|
</Text>
|
||||||
|
</Stack>
|
||||||
|
</Group>
|
||||||
|
<Space h={'xl'} />
|
||||||
|
<Text c="dimmed" ta="center" size="lg" maw={580} mx="auto">
|
||||||
|
Developed by <Anchor href='https://jarrodnorwell.com' target='_blank'>Jarrod Norwell</Anchor>
|
||||||
|
</Text>
|
||||||
|
</Stack>
|
||||||
|
</Center>
|
||||||
|
</Container>
|
||||||
|
);
|
||||||
|
*/
|
||||||
|
}
|
16
src/Home/HomeScreenshots/HomeScreenshotCard.tsx
Normal file
@ -0,0 +1,16 @@
|
|||||||
|
import { Card, Image } from "@mantine/core";
|
||||||
|
|
||||||
|
interface HomeScreenshotCardProps {
|
||||||
|
url: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
export function HomeScreenshotCard({ url }: HomeScreenshotCardProps) {
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<Card padding={'lg'} radius={'md'} withBorder>
|
||||||
|
<Card.Section>
|
||||||
|
<Image src={url} />
|
||||||
|
</Card.Section>
|
||||||
|
</Card></>
|
||||||
|
);
|
||||||
|
}
|
30
src/Home/HomeScreenshots/HomeScreenshots.module.css
Normal file
@ -0,0 +1,30 @@
|
|||||||
|
.wrapper {
|
||||||
|
position: relative;
|
||||||
|
margin-bottom: rem(120px);
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
.title {
|
||||||
|
font-family:
|
||||||
|
Greycliff CF,
|
||||||
|
sans-serif;
|
||||||
|
font-weight: 900;
|
||||||
|
color: var(--mantine-color-white);
|
||||||
|
line-height: 1.2;
|
||||||
|
font-size: rem(32px);
|
||||||
|
margin-top: var(--mantine-spacing-xs);
|
||||||
|
}
|
||||||
|
|
||||||
|
.category {
|
||||||
|
color: var(--mantine-color-white);
|
||||||
|
opacity: 0.7;
|
||||||
|
font-weight: 700;
|
||||||
|
text-transform: uppercase;
|
||||||
|
}
|
||||||
|
|
||||||
|
.control {
|
||||||
|
&[data-inactive] {
|
||||||
|
opacity: 0;
|
||||||
|
cursor: default;
|
||||||
|
}
|
||||||
|
}
|
42
src/Home/HomeScreenshots/HomeScreenshots.tsx
Normal file
@ -0,0 +1,42 @@
|
|||||||
|
import { Carousel } from '@mantine/carousel';
|
||||||
|
import { Space, Title } from '@mantine/core';
|
||||||
|
import { IconCircleArrowLeftFilled, IconCircleArrowRightFilled } from '@tabler/icons-react';
|
||||||
|
import { HomeScreenshotCard } from './HomeScreenshotCard';
|
||||||
|
import classes from './HomeScreenshots.module.css';
|
||||||
|
|
||||||
|
const data = [
|
||||||
|
{ url: '/one.png' },
|
||||||
|
{ url: '/two.png' },
|
||||||
|
{ url: '/three.png' },
|
||||||
|
{ url: '/four.png' }
|
||||||
|
];
|
||||||
|
|
||||||
|
export function HomeScreenshots() {
|
||||||
|
const slides = data.map((item) => (
|
||||||
|
<Carousel.Slide key={item.url}>
|
||||||
|
<HomeScreenshotCard {...item} />
|
||||||
|
</Carousel.Slide>
|
||||||
|
));
|
||||||
|
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<Title order={1}>
|
||||||
|
Screenshots
|
||||||
|
</Title>
|
||||||
|
<Space h={'md'} />
|
||||||
|
<Carousel
|
||||||
|
align={'start'}
|
||||||
|
classNames={classes}
|
||||||
|
slideGap={'md'}
|
||||||
|
slideSize={{ base: '100%', sm: '33.333333%' }}
|
||||||
|
nextControlIcon={
|
||||||
|
<IconCircleArrowRightFilled size={'lg'} />
|
||||||
|
}
|
||||||
|
previousControlIcon={
|
||||||
|
<IconCircleArrowLeftFilled size={'lg'} />
|
||||||
|
}
|
||||||
|
>
|
||||||
|
{slides}
|
||||||
|
</Carousel></>
|
||||||
|
);
|
||||||
|
}
|
@ -1,9 +1,9 @@
|
|||||||
import React from "react";
|
import React from "react";
|
||||||
import ReactDOM from "react-dom/client";
|
import ReactDOM from "react-dom/client";
|
||||||
import App from "./App.tsx";
|
import Home from "./Home.tsx";
|
||||||
|
|
||||||
ReactDOM.createRoot(document.getElementById("root") as HTMLElement).render(
|
ReactDOM.createRoot(document.getElementById("root") as HTMLElement).render(
|
||||||
<React.StrictMode>
|
<React.StrictMode>
|
||||||
<App />
|
<Home />
|
||||||
</React.StrictMode>
|
</React.StrictMode>
|
||||||
);
|
);
|
35
src/NewHome/NewHome.tsx
Normal file
@ -0,0 +1,35 @@
|
|||||||
|
import '@mantine/carousel/styles.css';
|
||||||
|
import '@mantine/core/styles.css';
|
||||||
|
import {
|
||||||
|
Anchor, Button, Flex,
|
||||||
|
MantineProvider,
|
||||||
|
Stack, Text, Title
|
||||||
|
} from '@mantine/core';
|
||||||
|
import { theme } from '../theme';
|
||||||
|
|
||||||
|
export default function NewHome() {
|
||||||
|
return (
|
||||||
|
<MantineProvider theme={theme}>
|
||||||
|
<Flex align={'center'} justify={'center'} h={'100vh'} px={'md'} w={'100vw'}>
|
||||||
|
<Stack>
|
||||||
|
<Anchor href='https://twitter.com/antique_codes' ta={'center'} target='_blank'>
|
||||||
|
@antique_codes
|
||||||
|
</Anchor>
|
||||||
|
<Title order={1} ta={'center'}>
|
||||||
|
Folium
|
||||||
|
</Title>
|
||||||
|
<Text c={'dimmed'} ta={'center'}>
|
||||||
|
Beautifully designed, high performing multi-system emulation in the palm of your hands
|
||||||
|
</Text>
|
||||||
|
<Flex align={'center'} gap={'md'} justify={'center'} direction={'row'} wrap={'wrap'}>
|
||||||
|
<Button component='a' href='https://apps.apple.com/au/app/folium/id6498623389' color='blue' radius={'xl'} variant='filled'>Open App Store</Button>
|
||||||
|
<Button component='a' href='https://discord.gg/jv3wmCUTw7' color='violet' radius={'xl'}>Join Discord</Button>
|
||||||
|
<Button component='a' href='https://github.com/folium-app' color='gray' radius={'xl'} variant='filled'>Open GitHub</Button>
|
||||||
|
<Button component='a' href='/rewrite' radius={'xl'} variant='filled'>Browse Rewrite</Button>
|
||||||
|
<Button component='a' href='/ipas/Folium-v1.6-Sideload.ipa.zip' color='cyan' radius={'xl'} variant='filled'>Sideload</Button>
|
||||||
|
</Flex>
|
||||||
|
</Stack>
|
||||||
|
</Flex>
|
||||||
|
</MantineProvider>
|
||||||
|
);
|
||||||
|
}
|
9
src/NewHome/newhome_main.tsx
Normal file
@ -0,0 +1,9 @@
|
|||||||
|
import React from 'react';
|
||||||
|
import ReactDOM from 'react-dom/client';
|
||||||
|
import NewHome from './NewHome.tsx';
|
||||||
|
|
||||||
|
ReactDOM.createRoot(document.getElementById("root") as HTMLElement).render(
|
||||||
|
<React.StrictMode>
|
||||||
|
<NewHome />
|
||||||
|
</React.StrictMode>
|
||||||
|
);
|
14
src/PrivacyPolicy/PrivacyPolicy.tsx
Normal file
@ -0,0 +1,14 @@
|
|||||||
|
import '@mantine/carousel/styles.css';
|
||||||
|
import '@mantine/core/styles.css';
|
||||||
|
import { MantineProvider } from '@mantine/core';
|
||||||
|
import { theme } from '../theme';
|
||||||
|
|
||||||
|
import { PrivacyPolicyMarkdown } from './PrivacyPolicyMarkdown/PrivacyPolicyMarkdown';
|
||||||
|
|
||||||
|
export default function PrivacyPolicy() {
|
||||||
|
return (
|
||||||
|
<MantineProvider theme={theme} forceColorScheme='dark'>
|
||||||
|
<PrivacyPolicyMarkdown />
|
||||||
|
</MantineProvider>
|
||||||
|
);
|
||||||
|
}
|
@ -0,0 +1,6 @@
|
|||||||
|
.wrapper {
|
||||||
|
position: relative;
|
||||||
|
margin-bottom: rem(120px);
|
||||||
|
margin-top: rem(120px);
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
@ -0,0 +1,24 @@
|
|||||||
|
import { Container, Space, Text, Title } from "@mantine/core";
|
||||||
|
import classes from './PrivacyPolicyMarkdown.module.css';
|
||||||
|
|
||||||
|
export function PrivacyPolicyMarkdown() {
|
||||||
|
return (
|
||||||
|
<Container className={classes.wrapper}>
|
||||||
|
<Title order={1}>
|
||||||
|
Privacy Policy
|
||||||
|
</Title>
|
||||||
|
<Space h={'xl'} />
|
||||||
|
<Text>
|
||||||
|
Folium and its developer take your privacy very seriously. Beyond the information Apple provides to developers that you can decide to provide, it uses no third-party analytics or advertising frameworks.
|
||||||
|
</Text>
|
||||||
|
<Space h={'md'} />
|
||||||
|
<Text>
|
||||||
|
Folium does have cores that save logs on-device and these can optionally be provided for better assistance in Discord, Reddit, etc. Information within these logs can be but is not limited to device specifications.
|
||||||
|
</Text>
|
||||||
|
<Space h={'xl'} />
|
||||||
|
<Text c={'dimmed'}>
|
||||||
|
© 2024 Jarrod Norwell. All Right Reserved.
|
||||||
|
</Text>
|
||||||
|
</Container>
|
||||||
|
)
|
||||||
|
}
|
9
src/PrivacyPolicy/privacypolicy_main.tsx
Normal file
@ -0,0 +1,9 @@
|
|||||||
|
import React from 'react';
|
||||||
|
import ReactDOM from 'react-dom/client';
|
||||||
|
import PrivacyPolicy from './PrivacyPolicy';
|
||||||
|
|
||||||
|
ReactDOM.createRoot(document.getElementById("root") as HTMLElement).render(
|
||||||
|
<React.StrictMode>
|
||||||
|
<PrivacyPolicy />
|
||||||
|
</React.StrictMode>
|
||||||
|
);
|
27
src/Rewrite/Rewrite.module.css
Normal file
@ -0,0 +1,27 @@
|
|||||||
|
.root {
|
||||||
|
border-radius: var(--mantine-radius-sm);
|
||||||
|
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);
|
||||||
|
}
|
||||||
|
}
|
500
src/Rewrite/Rewrite.tsx
Normal file
@ -0,0 +1,500 @@
|
|||||||
|
import '@mantine/carousel/styles.css';
|
||||||
|
import '@mantine/core/styles.css';
|
||||||
|
import {
|
||||||
|
Accordion, Badge, Container, MantineProvider,
|
||||||
|
Space, Timeline, Text,
|
||||||
|
Title, Grid, SimpleGrid,
|
||||||
|
Image, Paper, ThemeIcon, Button, rem, useMantineColorScheme
|
||||||
|
} from '@mantine/core';
|
||||||
|
import {
|
||||||
|
IconCheck, IconX, IconQuestionMark,
|
||||||
|
IconCamera
|
||||||
|
} from '@tabler/icons-react';
|
||||||
|
import TweetEmbed from 'react-tweet-embed';
|
||||||
|
import { theme } from '../theme';
|
||||||
|
import classes from './Rewrite.module.css';
|
||||||
|
|
||||||
|
export function Header() {
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<Badge color='green' size='lg'>
|
||||||
|
Rewrite
|
||||||
|
</Badge>
|
||||||
|
<Space h={'md'} />
|
||||||
|
<Title order={1}>
|
||||||
|
v1.7
|
||||||
|
</Title>
|
||||||
|
{/*
|
||||||
|
<Space h={'md'} />
|
||||||
|
<Title order={2}>
|
||||||
|
System Wide
|
||||||
|
</Title>
|
||||||
|
<Space h={'md'} />
|
||||||
|
<Grid>
|
||||||
|
<Grid.Col span={{ base: 12, md: 4 }}>
|
||||||
|
<SimpleGrid cols={{ base: 3, md: 2 }}>
|
||||||
|
<Paper key={'one'} radius={'lg'} withBorder style={{ overflow: 'hidden' }}>
|
||||||
|
<Image src={'https://placehold.co/1290x2796?text=N/A'} />
|
||||||
|
</Paper>
|
||||||
|
</SimpleGrid>
|
||||||
|
</Grid.Col>
|
||||||
|
<Grid.Col span={{ base: 12, md: 8 }}>
|
||||||
|
<Timeline bulletSize={26} lineWidth={2.2}>
|
||||||
|
<Timeline.Item bullet={
|
||||||
|
<ThemeIcon c='orange' color='clear' radius={'xl'}>
|
||||||
|
<IconQuestionMark size={'1rem'} stroke={2.5} />
|
||||||
|
</ThemeIcon>
|
||||||
|
} title={
|
||||||
|
<Title order={3}>
|
||||||
|
Widgets
|
||||||
|
</Title>
|
||||||
|
} lineVariant='dotted'>
|
||||||
|
<Text c={'red'} mb={4} size='sm'>
|
||||||
|
App Store only
|
||||||
|
</Text>
|
||||||
|
<Text c={'dimmed'}>
|
||||||
|
TBD
|
||||||
|
</Text>
|
||||||
|
<Text size="sm" mt={4}>
|
||||||
|
In Progress
|
||||||
|
</Text>
|
||||||
|
</Timeline.Item>
|
||||||
|
<Timeline.Item bullet={
|
||||||
|
<ThemeIcon c='orange' color='clear' radius={'xl'}>
|
||||||
|
<IconQuestionMark size={'1rem'} stroke={2.5} />
|
||||||
|
</ThemeIcon>
|
||||||
|
} title={
|
||||||
|
<Title order={3}>
|
||||||
|
Game Center
|
||||||
|
</Title>
|
||||||
|
} lineVariant='dotted'>
|
||||||
|
<Text c={'red'} mb={4} size='sm'>
|
||||||
|
App Store only
|
||||||
|
</Text>
|
||||||
|
<Text c={'dimmed'}>
|
||||||
|
TBD
|
||||||
|
</Text>
|
||||||
|
<Text size="sm" mt={4}>
|
||||||
|
In Progress
|
||||||
|
</Text>
|
||||||
|
</Timeline.Item>
|
||||||
|
<Timeline.Item bullet={
|
||||||
|
<ThemeIcon c='orange' color='clear' radius={'xl'}>
|
||||||
|
<IconQuestionMark size={'1rem'} stroke={2.5} />
|
||||||
|
</ThemeIcon>
|
||||||
|
} title={
|
||||||
|
<Title order={3}>
|
||||||
|
Dynamic Island
|
||||||
|
</Title>
|
||||||
|
} lineVariant='dotted'>
|
||||||
|
<Text c={'red'} mb={4} size='sm'>
|
||||||
|
App Store only
|
||||||
|
</Text>
|
||||||
|
<Text c={'dimmed'}>
|
||||||
|
TBD
|
||||||
|
</Text>
|
||||||
|
<Text size="sm" mt={4}>
|
||||||
|
In Progress
|
||||||
|
</Text>
|
||||||
|
</Timeline.Item>
|
||||||
|
</Timeline>
|
||||||
|
</Grid.Col>
|
||||||
|
</Grid>
|
||||||
|
*/}
|
||||||
|
|
||||||
|
<Space h={'md'} />
|
||||||
|
<Title order={2}>
|
||||||
|
Library
|
||||||
|
</Title>
|
||||||
|
<Space h={'md'} />
|
||||||
|
<Grid>
|
||||||
|
<Grid.Col span={{ base: 12, md: 4 }}>
|
||||||
|
<SimpleGrid cols={{ base: 3, md: 2 }}>
|
||||||
|
<Paper key={'one'} radius={'lg'} withBorder style={{ overflow: 'hidden' }}>
|
||||||
|
<Image src={'/rewrite/library.png'} />
|
||||||
|
</Paper>
|
||||||
|
<Paper key={'two'} radius={'lg'} withBorder style={{ overflow: 'hidden' }}>
|
||||||
|
<Image src={'/rewrite/settings.png'} />
|
||||||
|
</Paper>
|
||||||
|
<Paper key={'three'} radius={'lg'} withBorder style={{ overflow: 'hidden' }}>
|
||||||
|
<Image src={'/rewrite/cytrus_settings.png'} />
|
||||||
|
</Paper>
|
||||||
|
<Paper key={'four'} radius={'lg'} withBorder style={{ overflow: 'hidden' }}>
|
||||||
|
<Image src={'/rewrite/search.png'} />
|
||||||
|
</Paper>
|
||||||
|
</SimpleGrid>
|
||||||
|
</Grid.Col>
|
||||||
|
<Grid.Col span={{ base: 12, md: 8 }}>
|
||||||
|
<Timeline bulletSize={26} lineWidth={2.2}>
|
||||||
|
<Timeline.Item bullet={
|
||||||
|
<ThemeIcon c='green' color='clear' radius={'xl'}>
|
||||||
|
<IconCheck size={'1rem'} stroke={2.5} />
|
||||||
|
</ThemeIcon>
|
||||||
|
} title={
|
||||||
|
<Title order={3}>
|
||||||
|
Library
|
||||||
|
</Title>
|
||||||
|
} lineVariant='dotted'>
|
||||||
|
<Text c={'dimmed'}>
|
||||||
|
Library is new and improved not only in design but also performance, with the new gradient blur on games with icons and random colours on games without your library never looked better, add onto that the much faster load times you'll be able to start scrolling in no time
|
||||||
|
</Text>
|
||||||
|
<Space h={'md'} />
|
||||||
|
<Title order={4}>
|
||||||
|
Artwork
|
||||||
|
</Title>
|
||||||
|
<Text c={'red'} mb={4} size='sm'>
|
||||||
|
App Store only
|
||||||
|
</Text>
|
||||||
|
<Text c={'dimmed'}>
|
||||||
|
Games got no icons? Or maybe they do but you want to change them... well now you can! Tap and hold on any game and set a custom artwork which will persist until it's removed
|
||||||
|
</Text>
|
||||||
|
</Timeline.Item>
|
||||||
|
<Timeline.Item bullet={
|
||||||
|
<ThemeIcon c='green' color='clear' radius={'xl'}>
|
||||||
|
<IconCheck size={'1rem'} stroke={2.5} />
|
||||||
|
</ThemeIcon>
|
||||||
|
} title={
|
||||||
|
<Title order={3}>
|
||||||
|
Search
|
||||||
|
</Title>
|
||||||
|
} lineVariant='dotted'>
|
||||||
|
<Text c={'dimmed'}>
|
||||||
|
Search is now faster than ever before as it now uses regex over "contains". Search also closes near-instantly with the use of a cached library completely separate from the search library
|
||||||
|
</Text>
|
||||||
|
</Timeline.Item>
|
||||||
|
<Timeline.Item bullet={
|
||||||
|
<ThemeIcon c='orange' color='clear' radius={'xl'}>
|
||||||
|
<IconQuestionMark size={'1rem'} stroke={2.5} />
|
||||||
|
</ThemeIcon>
|
||||||
|
} title={
|
||||||
|
<Title order={3}>
|
||||||
|
Settings
|
||||||
|
</Title>
|
||||||
|
} lineVariant='dotted'>
|
||||||
|
<Text c={'dimmed'}>
|
||||||
|
Settings are now split up into their respective cores to avoid confusion and allow for multiple changes at a time as opposed to changing one at a time
|
||||||
|
</Text>
|
||||||
|
</Timeline.Item>
|
||||||
|
</Timeline>
|
||||||
|
</Grid.Col>
|
||||||
|
</Grid>
|
||||||
|
<Space h={'md'} />
|
||||||
|
<Title order={2}>
|
||||||
|
Cores
|
||||||
|
</Title>
|
||||||
|
<Space h={'md'} />
|
||||||
|
<Grid>
|
||||||
|
<Grid.Col span={{ base: 12, md: 4 }}>
|
||||||
|
<SimpleGrid cols={{ base: 3, md: 2 }}>
|
||||||
|
<Paper key={'one'} radius={'lg'} withBorder style={{ overflow: 'hidden' }}>
|
||||||
|
<Image src={'/rewrite/cytrus.png'} />
|
||||||
|
</Paper>
|
||||||
|
<Paper key={'two'} radius={'lg'} withBorder style={{ overflow: 'hidden' }}>
|
||||||
|
<Image src={'/rewrite/grape.png'} />
|
||||||
|
</Paper>
|
||||||
|
<Paper key={'three'} radius={'lg'} withBorder style={{ overflow: 'hidden' }}>
|
||||||
|
<Image src={'/rewrite/mango.png'} />
|
||||||
|
</Paper>
|
||||||
|
</SimpleGrid>
|
||||||
|
</Grid.Col>
|
||||||
|
<Grid.Col span={{ base: 12, md: 8 }}>
|
||||||
|
<Timeline bulletSize={26} lineWidth={2.2}>
|
||||||
|
<Timeline.Item bullet={
|
||||||
|
<ThemeIcon c='orange' color='clear' radius={'xl'}>
|
||||||
|
<IconQuestionMark size={'1rem'} stroke={2.5} />
|
||||||
|
</ThemeIcon>
|
||||||
|
} title={
|
||||||
|
<Title order={3}>
|
||||||
|
Nintendo 3DS
|
||||||
|
</Title>
|
||||||
|
} lineVariant='dotted'>
|
||||||
|
<Text c={'dimmed'}>
|
||||||
|
Cytrus is the name of the Nintendo 3DS core within Folium, it is built on top of the latest Mandarine3DS source code on GitHub and supports all 3DS file formats, downloadable content, updates, game controllers, microphone input, speaker output and more
|
||||||
|
</Text>
|
||||||
|
<Space h={'md'} />
|
||||||
|
<Text c={'red'} size='sm'>
|
||||||
|
Camera, Home Menu, DLC and Updates are currently not supported by Cytrus
|
||||||
|
</Text>
|
||||||
|
<Space h={'md'} />
|
||||||
|
<Accordion variant='contained' classNames={classes}>
|
||||||
|
<Accordion.Item key={'camera'} value='Camera'>
|
||||||
|
<Accordion.Control icon={<IconCamera color='orange' style={{ width: rem(20), height: rem(20) }} />}>
|
||||||
|
Camera
|
||||||
|
</Accordion.Control>
|
||||||
|
<Accordion.Panel>
|
||||||
|
<Text>
|
||||||
|
Cytrus now has very early camera support, the image is garbled
|
||||||
|
</Text>
|
||||||
|
<Space h={'md'} />
|
||||||
|
<Button component='a' href='https://github.com/folium-app/Cytrus/commit/dbbfc7b6b0f049d63f1255226e90e5c3306e366c' radius={'xl'} variant='default'>
|
||||||
|
GitHub Commit
|
||||||
|
</Button>
|
||||||
|
<Space h={'md'} />
|
||||||
|
<TweetEmbed
|
||||||
|
tweetId={'1828498093035397193'}
|
||||||
|
options={{ theme: useMantineColorScheme().colorScheme }}
|
||||||
|
/>
|
||||||
|
</Accordion.Panel>
|
||||||
|
</Accordion.Item>
|
||||||
|
</Accordion>
|
||||||
|
<Space h={'md'} />
|
||||||
|
<Button color='gray' component='a' href='https://github.com/folium-app/cytrus' radius={'xl'} variant='filled'>
|
||||||
|
Source Code
|
||||||
|
</Button>
|
||||||
|
</Timeline.Item>
|
||||||
|
|
||||||
|
<Timeline.Item bullet={
|
||||||
|
<ThemeIcon c='orange' color='clear' radius={'xl'}>
|
||||||
|
<IconQuestionMark size={'1rem'} stroke={2.5} />
|
||||||
|
</ThemeIcon>
|
||||||
|
} title={
|
||||||
|
<Title order={3}>
|
||||||
|
Nintendo DS
|
||||||
|
</Title>
|
||||||
|
} lineVariant='dotted'>
|
||||||
|
<Text c={'dimmed'}>
|
||||||
|
Grape is the name of the Nintendo DS core within Folium, it is built on top of the latest NooDS source code on GitHub and supports all DS file formats, game controllers, microphone input, speaker output and more
|
||||||
|
</Text>
|
||||||
|
<Space h={'md'} />
|
||||||
|
<Text c={'red'} size='sm'>
|
||||||
|
Grape will transition to melonDS at a later date, at this point in time the emulation freezes
|
||||||
|
</Text>
|
||||||
|
<Space h={'md'} />
|
||||||
|
<Button color='gray' component='a' href='https://github.com/folium-app/grape' radius={'xl'} variant='filled'>
|
||||||
|
Source Code
|
||||||
|
</Button>
|
||||||
|
</Timeline.Item>
|
||||||
|
|
||||||
|
<Timeline.Item bullet={
|
||||||
|
<ThemeIcon c='red' color='clear' radius={'xl'}>
|
||||||
|
<IconX size={'1rem'} stroke={2.5} />
|
||||||
|
</ThemeIcon>
|
||||||
|
} title={
|
||||||
|
<Title order={3}>
|
||||||
|
Game Boy
|
||||||
|
</Title>
|
||||||
|
} lineVariant='dotted'>
|
||||||
|
<Text c={'dimmed'}>
|
||||||
|
Work in Progress
|
||||||
|
</Text>
|
||||||
|
</Timeline.Item>
|
||||||
|
|
||||||
|
<Timeline.Item bullet={
|
||||||
|
<ThemeIcon c='red' color='clear' radius={'xl'}>
|
||||||
|
<IconX size={'1rem'} stroke={2.5} />
|
||||||
|
</ThemeIcon>
|
||||||
|
} title={
|
||||||
|
<Title order={3}>
|
||||||
|
Game Boy Advance
|
||||||
|
</Title>
|
||||||
|
} lineVariant='dotted'>
|
||||||
|
<Text c={'dimmed'}>
|
||||||
|
Work in Progress
|
||||||
|
</Text>
|
||||||
|
</Timeline.Item>
|
||||||
|
|
||||||
|
<Timeline.Item bullet={
|
||||||
|
<ThemeIcon c='red' color='clear' radius={'xl'}>
|
||||||
|
<IconX size={'1rem'} stroke={2.5} />
|
||||||
|
</ThemeIcon>
|
||||||
|
} title={
|
||||||
|
<Title order={3}>
|
||||||
|
Game Boy Color
|
||||||
|
</Title>
|
||||||
|
} lineVariant='dotted'>
|
||||||
|
<Text c={'dimmed'}>
|
||||||
|
Work in Progress
|
||||||
|
</Text>
|
||||||
|
</Timeline.Item>
|
||||||
|
|
||||||
|
<Timeline.Item bullet={
|
||||||
|
<ThemeIcon c='red' color='clear' radius={'xl'}>
|
||||||
|
<IconX size={'1rem'} stroke={2.5} />
|
||||||
|
</ThemeIcon>
|
||||||
|
} title={
|
||||||
|
<Title order={3}>
|
||||||
|
Nintendo 64
|
||||||
|
</Title>
|
||||||
|
} lineVariant='dotted'>
|
||||||
|
<Text c={'dimmed'}>
|
||||||
|
Work in Progress
|
||||||
|
</Text>
|
||||||
|
</Timeline.Item>
|
||||||
|
|
||||||
|
<Timeline.Item bullet={
|
||||||
|
<ThemeIcon c='red' color='clear' radius={'xl'}>
|
||||||
|
<IconX size={'1rem'} stroke={2.5} />
|
||||||
|
</ThemeIcon>
|
||||||
|
} title={
|
||||||
|
<Title order={3}>
|
||||||
|
PlayStation 1
|
||||||
|
</Title>
|
||||||
|
} lineVariant='dotted'>
|
||||||
|
<Text c={'dimmed'}>
|
||||||
|
Work in Progress
|
||||||
|
</Text>
|
||||||
|
</Timeline.Item>
|
||||||
|
|
||||||
|
<Timeline.Item bullet={
|
||||||
|
<ThemeIcon c='orange' color='clear' radius={'xl'}>
|
||||||
|
<IconQuestionMark size={'1rem'} stroke={2.5} />
|
||||||
|
</ThemeIcon>
|
||||||
|
} title={
|
||||||
|
<Title order={3}>
|
||||||
|
Super Nintendo Entertainment System
|
||||||
|
</Title>
|
||||||
|
} lineVariant='dotted'>
|
||||||
|
<Text c={'dimmed'}>
|
||||||
|
Mango is the name of the Super Nintendo Entertainment System core within Folium, it is built on top of the latest LakeSNES source code on GitHub and supports the two most common SNES file formats, game controllers, speaker output and more
|
||||||
|
</Text>
|
||||||
|
<Space h={'md'} />
|
||||||
|
<Button color='gray' component='a' href='https://github.com/folium-app/mango' radius={'xl'} variant='filled'>
|
||||||
|
Source Code
|
||||||
|
</Button>
|
||||||
|
</Timeline.Item>
|
||||||
|
|
||||||
|
{/*<Timeline.Item bullet={
|
||||||
|
<ThemeIcon c='red' color='clear' radius={'xl'}>
|
||||||
|
<IconX size={'1rem'} stroke={2.5} />
|
||||||
|
</ThemeIcon>
|
||||||
|
} title={
|
||||||
|
<Title order={3}>
|
||||||
|
PlayStation 1
|
||||||
|
</Title>
|
||||||
|
} lineVariant='dotted'>
|
||||||
|
<Text c={'dimmed'}>
|
||||||
|
Lychee is a new Swift Package wrapping PCSX-ReARMed using C++ to Swift interoperability
|
||||||
|
</Text>
|
||||||
|
</Timeline.Item>
|
||||||
|
<Timeline.Item bullet={
|
||||||
|
<ThemeIcon c='orange' color='clear' radius={'xl'}>
|
||||||
|
<IconQuestionMark size={'1rem'} stroke={2.5} />
|
||||||
|
</ThemeIcon>
|
||||||
|
} title={
|
||||||
|
<Title order={3}>
|
||||||
|
Nintendo 3DS
|
||||||
|
</Title>
|
||||||
|
} lineVariant='dotted'>
|
||||||
|
<Text c={'dimmed'}>
|
||||||
|
Cytrus is a new Xcode project wrapping Citra-Enhanced using C++ to Objective-C++ to Swift interoperability. Cytrus supports load and save data and states
|
||||||
|
</Text>
|
||||||
|
</Timeline.Item>
|
||||||
|
<Timeline.Item bullet={
|
||||||
|
<ThemeIcon c='orange' color='clear' radius={'xl'}>
|
||||||
|
<IconQuestionMark size={'1rem'} stroke={2.5} />
|
||||||
|
</ThemeIcon>
|
||||||
|
} title={
|
||||||
|
<Title order={3}>
|
||||||
|
Nintendo 64
|
||||||
|
</Title>
|
||||||
|
} lineVariant='dotted'>
|
||||||
|
<Text c={'dimmed'}>
|
||||||
|
Guava is a new Swift Package wrapping Rokuyon using C++ to Swift interoperability
|
||||||
|
</Text>
|
||||||
|
</Timeline.Item>
|
||||||
|
<Timeline.Item bullet={
|
||||||
|
<ThemeIcon c='orange' color='clear' radius={'xl'}>
|
||||||
|
<IconQuestionMark size={'1rem'} stroke={2.5} />
|
||||||
|
</ThemeIcon>
|
||||||
|
} title={
|
||||||
|
<Title order={3}>
|
||||||
|
Nintendo DS
|
||||||
|
</Title>
|
||||||
|
} lineVariant='dotted'>
|
||||||
|
<Text c={'dimmed'}>
|
||||||
|
Grape is a new Xcode project wrapping melonDS using C++ to Objective-C++ to Swift interoperability. Grape supports load and save data and states
|
||||||
|
</Text>
|
||||||
|
</Timeline.Item>
|
||||||
|
<Timeline.Item bullet={
|
||||||
|
<ThemeIcon c='green' color='clear' radius={'xl'}>
|
||||||
|
<IconCheck size={'1rem'} stroke={2.5} />
|
||||||
|
</ThemeIcon>
|
||||||
|
} title={
|
||||||
|
<Title order={3}>
|
||||||
|
Game Boy Color
|
||||||
|
</Title>
|
||||||
|
} lineVariant='dotted'>
|
||||||
|
<Text c={'dimmed'}>
|
||||||
|
Kiwi is a new Swift Package wrapping Gambatte using C++ to Swift interoperability. Kiwi supports custom colour palettes, load and save data and states and Game Genie and Game Shark codes
|
||||||
|
</Text>
|
||||||
|
</Timeline.Item>
|
||||||
|
<Timeline.Item bullet={
|
||||||
|
<ThemeIcon c='red' color='clear' radius={'xl'}>
|
||||||
|
<IconX size={'1rem'} stroke={2.5} />
|
||||||
|
</ThemeIcon>
|
||||||
|
} title={
|
||||||
|
<Title order={3}>
|
||||||
|
Game Boy Advance
|
||||||
|
</Title>
|
||||||
|
} lineVariant='dotted'>
|
||||||
|
<Text c={'dimmed'}>
|
||||||
|
TBD
|
||||||
|
</Text>
|
||||||
|
</Timeline.Item>
|
||||||
|
<Timeline.Item bullet={
|
||||||
|
<ThemeIcon c='green' color='clear' radius={'xl'}>
|
||||||
|
<IconCheck size={'1rem'} stroke={2.5} />
|
||||||
|
</ThemeIcon>
|
||||||
|
} title={
|
||||||
|
<Title order={3}>
|
||||||
|
Game Boy
|
||||||
|
</Title>
|
||||||
|
} lineVariant='dotted'>
|
||||||
|
<Text c={'dimmed'}>
|
||||||
|
Kiwi is a new Swift Package wrapping Gambatte using C++ to Swift interoperability. Kiwi supports custom colour palettes, load and save data and states and Game Genie and Game Shark codes
|
||||||
|
</Text>
|
||||||
|
</Timeline.Item>*/}
|
||||||
|
</Timeline>
|
||||||
|
</Grid.Col>
|
||||||
|
</Grid>
|
||||||
|
<Space h={'md'} />
|
||||||
|
<Title order={2}>
|
||||||
|
Authentication
|
||||||
|
</Title>
|
||||||
|
<Space h={'md'} />
|
||||||
|
<Grid>
|
||||||
|
<Grid.Col span={{ base: 12, md: 4 }}>
|
||||||
|
<SimpleGrid cols={{ base: 3, md: 2 }}>
|
||||||
|
<div key={'one'}>
|
||||||
|
<Paper key={'one'} radius={'lg'} withBorder style={{ overflow: 'hidden' }}>
|
||||||
|
<Image src={'/rewrite/authentication.png'} />
|
||||||
|
</Paper>
|
||||||
|
<Text size='sm'>Outdated Screenshot</Text>
|
||||||
|
</div>
|
||||||
|
</SimpleGrid>
|
||||||
|
</Grid.Col>
|
||||||
|
<Grid.Col span={{ base: 12, md: 8 }}>
|
||||||
|
<Timeline bulletSize={26} lineWidth={2.2}>
|
||||||
|
<Timeline.Item bullet={
|
||||||
|
<ThemeIcon c='green' color='clear' radius={'xl'}>
|
||||||
|
<IconCheck size={'1rem'} stroke={2.5} />
|
||||||
|
</ThemeIcon>
|
||||||
|
} title={
|
||||||
|
<Title order={3}>
|
||||||
|
Sign in with Apple
|
||||||
|
</Title>
|
||||||
|
} lineVariant='dotted'>
|
||||||
|
<Text c={'red'} mb={4} size='sm'>
|
||||||
|
App Store only
|
||||||
|
</Text>
|
||||||
|
<Text c={'dimmed'}>
|
||||||
|
Sign in with Apple is an optional addition to Folium allowing users to securely sign in with their Apple Account to not only keep track of data such as times played or total time played but also communicate with other Folium users playing the same game in realtime
|
||||||
|
</Text>
|
||||||
|
</Timeline.Item>
|
||||||
|
</Timeline>
|
||||||
|
</Grid.Col>
|
||||||
|
</Grid>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
export default function Rewrite() {
|
||||||
|
return (
|
||||||
|
<MantineProvider theme={theme}>
|
||||||
|
<Container my={'xl'}>
|
||||||
|
<Header />
|
||||||
|
</Container>
|
||||||
|
</MantineProvider>
|
||||||
|
);
|
||||||
|
}
|
9
src/Rewrite/rewrite_main.tsx
Normal file
@ -0,0 +1,9 @@
|
|||||||
|
import React from 'react';
|
||||||
|
import ReactDOM from 'react-dom/client';
|
||||||
|
import Rewrite from './Rewrite';
|
||||||
|
|
||||||
|
ReactDOM.createRoot(document.getElementById("root") as HTMLElement).render(
|
||||||
|
<React.StrictMode>
|
||||||
|
<Rewrite />
|
||||||
|
</React.StrictMode>
|
||||||
|
);
|
@ -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: 'green'
|
||||||
|
});
|
||||||
export const vars = themeToVars(theme);
|
export const vars = themeToVars(theme);
|
||||||
|
@ -1,8 +1,22 @@
|
|||||||
import { defineConfig } from "vite";
|
import { defineConfig } from "vite";
|
||||||
import { vanillaExtractPlugin } from "@vanilla-extract/vite-plugin";
|
import { vanillaExtractPlugin } from "@vanilla-extract/vite-plugin";
|
||||||
import react from "@vitejs/plugin-react";
|
import react from "@vitejs/plugin-react";
|
||||||
|
import { resolve } from 'path';
|
||||||
|
|
||||||
// https://vitejs.dev/config/
|
// https://vitejs.dev/config/
|
||||||
export default defineConfig({
|
export default defineConfig({
|
||||||
plugins: [react(), vanillaExtractPlugin()],
|
plugins: [
|
||||||
|
react(),
|
||||||
|
vanillaExtractPlugin()
|
||||||
|
],
|
||||||
|
mode: 'production',
|
||||||
|
build: {
|
||||||
|
rollupOptions: {
|
||||||
|
input: {
|
||||||
|
index: resolve(__dirname, 'index.html'),
|
||||||
|
privacypolicy: resolve(__dirname, 'privacypolicy/index.html'),
|
||||||
|
rewrite: resolve(__dirname, 'rewrite/index.html')
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
});
|
});
|
||||||
|