Skip to content

Commit a2326d6

Browse files
lordelogosshellscape
lordelogos
and
shellscape
authored
feat(web,preview): web and preview app UI update (#300)
Co-authored-by: Andrew Powell <[email protected]> Co-authored-by: shellscape <[email protected]>
1 parent 6ff5db3 commit a2326d6

File tree

207 files changed

+19010
-3448
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

207 files changed

+19010
-3448
lines changed

‎apps/preview/app/index.html‎

Lines changed: 10 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,13 +3,21 @@
33
<head>
44
<meta charset="UTF-8" />
55
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
6+
<!-- Font imports -->
7+
<link rel="preconnect" href="https://fonts.googleapis.com" />
8+
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
9+
<link
10+
href="https://fonts.googleapis.com/css2?family=Onest:[email protected]&display=swap"
11+
rel="stylesheet"
12+
/>
13+
<!-- Favicon setup -->
614
<link
715
rel="shortcut icon"
816
href="data:image/svg+xml;charset=UTF-8,%3csvg width='126' height='113' viewBox='0 0 126 113' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath fill-rule='evenodd' clip-rule='evenodd' d='M0.199951 50V109V113H4.19995H121.8H125.8V109V50H117.8V105H8.19995V50H0.199951Z' fill='%23659CC8'/%3e%3cpath d='M0 53.429V47.4258L48.3069 22.8124V32.4176L11.2516 50.2773L11.5517 49.677V51.1778L11.2516 50.5775L48.3069 68.4372V78.0424L0 53.429Z' fill='%23659CC8'/%3e%3cpath d='M79.4367 0L54.6832 92H46.582L71.3356 0H79.4367Z' fill='%23659CC8'/%3e%3cpath d='M126 53.429L77.6931 78.0424V68.4372L114.748 50.5775L114.448 51.1778V49.677L114.748 50.2773L77.6931 32.4176V22.8124L126 47.4258V53.429Z' fill='%23659CC8'/%3e%3c/svg%3e "
917
/>
10-
<title>jsx-email</title>
18+
<title>Jsx-email Preview</title>
1119
</head>
12-
<body style="display: block">
20+
<body class="dark:text-white">
1321
<div id="root"></div>
1422
<script type="module" src="/src/main.tsx"></script>
1523
</body>

‎apps/preview/app/postcss.config.cjs‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
/* eslint-disable */
22
module.exports = {
33
plugins: {
4-
tailwindcss: {},
4+
'@tailwindcss/postcss': {},
55
autoprefixer: {}
66
}
77
};

‎apps/preview/app/public/favicon.ico‎

5.15 KB
Binary file not shown.

‎apps/preview/app/src/App.tsx‎

Lines changed: 48 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,48 @@
1+
import { Provider as MobxProvider, observer } from 'mobx-react';
2+
import { StrictMode, useState } from 'react';
3+
import { HashRouter, Route, Routes } from 'react-router-dom';
4+
5+
import { useAppStore } from './composables/useAppStore';
6+
import { Shell } from './layouts/Shell';
7+
import { AppStore } from './stores/AppStore';
8+
import { Index } from './views/Index';
9+
import { Preview } from './views/Preview/index';
10+
11+
const Router = observer(() => {
12+
const appStore = useAppStore();
13+
14+
return (
15+
<>
16+
{appStore.templates.isReady && (
17+
<HashRouter>
18+
<Routes>
19+
<Route path="/" element={<Shell />}>
20+
<Route index element={<Index />} />
21+
<Route path="emails">
22+
{Object.values(appStore.templates.records).map((template, index) => (
23+
<Route
24+
path={template.path.replace('.tsx', '')}
25+
key={index}
26+
element={<Preview />}
27+
/>
28+
))}
29+
</Route>
30+
</Route>
31+
</Routes>
32+
</HashRouter>
33+
)}
34+
</>
35+
);
36+
});
37+
38+
export const App = () => {
39+
const [appStore] = useState(() => new AppStore());
40+
41+
return (
42+
<StrictMode>
43+
<MobxProvider store={appStore}>
44+
<Router />
45+
</MobxProvider>
46+
</StrictMode>
47+
);
48+
};

‎apps/preview/app/src/app.ts‎

Lines changed: 0 additions & 11 deletions
This file was deleted.

‎apps/preview/app/src/components/DefaultPopupFooter.tsx‎

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
import { Icon } from '@iconify/react';
2+
import { Link as ReactRouterDomLink } from 'react-router-dom';
3+
4+
import { Button } from './ui/Button';
5+
import { Link } from './ui/Link';
6+
import { Separator } from './ui/Separator';
7+
8+
export const DefaultPopupFooter = () => (
9+
<div className="w-full flex items-center justify-between gap-x-4 gap-y-8 flex-wrap px-8 sm:px-12 py-6">
10+
<div className="flex items-center gap-x-5">
11+
<Button asChild>
12+
<ReactRouterDomLink to="https://jsx.email/docs">Documentation</ReactRouterDomLink>
13+
</Button>
14+
<Separator orientation="vertical" className="h-12" />
15+
<ReactRouterDomLink to="https://jsx.email/github">
16+
<Icon icon="mdi:github" className="h-8 w-8" />
17+
<span className="sr-only">Go to JSX Email's Github</span>
18+
</ReactRouterDomLink>
19+
<ReactRouterDomLink to="https://jsx.email/discord">
20+
<Icon icon="ic:baseline-discord" className="h-8 w-8" />
21+
<span className="sr-only">Go to JSX Email's Discord</span>
22+
</ReactRouterDomLink>
23+
</div>
24+
<div className="flex items-center gap-x-6 gap-y-2 flex-wrap">
25+
<Link to="https://samples.jsx.email">Email Samples</Link>
26+
<Link to="https://pro.jsx.email">Pro Templates</Link>
27+
</div>
28+
</div>
29+
);

‎apps/preview/app/src/components/code-container.tsx‎

Lines changed: 0 additions & 74 deletions
This file was deleted.

‎apps/preview/app/src/components/code.tsx‎

Lines changed: 0 additions & 46 deletions
This file was deleted.

‎apps/preview/app/src/components/icons.tsx‎

Lines changed: 0 additions & 146 deletions
This file was deleted.

0 commit comments

Comments
 (0)