chore: change to monorepo

2026-08-18 10:31:50 +08:00 · 2022-10-14 13:26:06 +08:00
parent 7f9e7efb67
commit 0279dc44b7
36 changed files with 305 additions and 167 deletions
@@ -0,0 +1,22 @@
+import type { AppProps } from 'next/app';
+import dynamic from 'next/dynamic';
+import '../../public/globals.css';
+import '../../public/variable.css';
+import './temporary.css';
+import { EditorProvider } from '@/components/editor-provider';
+
+const ThemeProvider = dynamic(() => import('@/styles/themeProvider'), {
+  ssr: false,
+});
+
+function MyApp({ Component, pageProps }: AppProps) {
+  return (
+    <ThemeProvider>
+      <EditorProvider>
+        <Component {...pageProps} />
+      </EditorProvider>
+    </ThemeProvider>
+  );
+}
+
+export default MyApp;
@@ -0,0 +1,53 @@
+import createEmotionServer from '@emotion/server/create-instance';
+import { cache } from '@emotion/css';
+
+import Document, {
+  Html,
+  Head,
+  Main,
+  NextScript,
+  DocumentContext,
+} from 'next/document';
+import * as React from 'react';
+
+export const renderStatic = async (html: string) => {
+  if (html === undefined) {
+    throw new Error('did you forget to return html from renderToString?');
+  }
+  const { extractCritical } = createEmotionServer(cache);
+  const { ids, css } = extractCritical(html);
+
+  return { html, ids, css };
+};
+
+export default class AppDocument extends Document {
+  static async getInitialProps(ctx: DocumentContext) {
+    const page = await ctx.renderPage();
+    const { css, ids } = await renderStatic(page.html);
+    const initialProps = await Document.getInitialProps(ctx);
+    return {
+      ...initialProps,
+      styles: (
+        <React.Fragment>
+          {initialProps.styles}
+          <style
+            data-emotion={`css ${ids.join(' ')}`}
+            dangerouslySetInnerHTML={{ __html: css }}
+          />
+        </React.Fragment>
+      ),
+    };
+  }
+
+  render() {
+    return (
+      <Html>
+        <Head />
+        <body>
+          <Main />
+          <NextScript />
+        </body>
+      </Html>
+    );
+  }
+}
@@ -0,0 +1,7 @@
+import React from 'react';
+
+const Affine = () => {
+  return <div className="">Affine Page</div>;
+};
+
+export default Affine;
@@ -0,0 +1,63 @@
+import type { NextPage } from 'next';
+import dynamic from 'next/dynamic';
+import { styled, useTheme } from '@/styles';
+import { Header } from '@/components/Header';
+
+import '@/components/simple-counter';
+
+const StyledEditorContainer = styled('div')(({ theme }) => {
+  return {
+    flexGrow: 1,
+    paddingTop: '78px',
+  };
+});
+
+const StyledPage = styled('div')({
+  height: '100vh',
+  display: 'flex',
+  flexDirection: 'column',
+  backgroundColor: 'var(--page-background-color)',
+  transition: 'background-color .5s',
+});
+
+const DynamicEditor = dynamic(() => import('../components/editor'), {
+  loading: () => <div>Loading...</div>,
+  ssr: false,
+});
+
+const Home: NextPage = () => {
+  return (
+    <StyledPage>
+      <Header />
+      <StyledEditorContainer>
+        <DynamicEditor />
+      </StyledEditorContainer>
+      {/*<Button>A button use the theme styles</Button>*/}
+      {/*<simple-counter name="A counter created by web component" />*/}
+      {/*<p>current mode {mode}</p>*/}
+      {/*<button*/}
+      {/*  onClick={() => {*/}
+      {/*    changeMode('light');*/}
+      {/*  }}*/}
+      {/*>*/}
+      {/*  light*/}
+      {/*</button>*/}
+      {/*<button*/}
+      {/*  onClick={() => {*/}
+      {/*    changeMode('dark');*/}
+      {/*  }}*/}
+      {/*>*/}
+      {/*  dark*/}
+      {/*</button>*/}
+      {/*<button*/}
+      {/*  onClick={() => {*/}
+      {/*    changeMode('auto');*/}
+      {/*  }}*/}
+      {/*>*/}
+      {/*  auto*/}
+      {/*</button>*/}
+    </StyledPage>
+  );
+};
+
+export default Home;
@@ -0,0 +1,44 @@
+debug-menu {
+  display: none !important;
+}
+.affine-editor-container {
+  height: 100%;
+  padding: 0 !important;
+}
+.affine-default-page-block-container {
+  width: 720px;
+  height: 100%;
+  margin: 0 auto;
+}
+
+u {
+  text-decoration: none;
+  border-bottom: 1px solid #4c6275 !important;
+}
+u::after {
+  display: none;
+}
+
+.affine-paragraph-block-container.text {
+  margin-top: 18px !important;
+}
+
+.affine-default-page-block-title {
+  width: 100%;
+}
+s {
+  text-decoration: line-through !important;
+}
+
+.affine-edgeless-page-block-container {
+  height: 100% !important;
+}
+.affine-block-children-container.edgeless {
+  height: 100% !important;
+}
+.affine-list-rich-text-wrapper > div {
+  box-sizing: content-box;
+  color: var(--affine-highlight-color);
+  min-width: unset !important;
+  max-width: 26px;
+}