jfinn
/
tldraw_0
Watch 1
Star 0
Fork 0
Code Issues 0 Pull Requests 0 Releases 0 Wiki Activity
Browse Source

Tweak www titles heads

main
Steve Ruiz 4 years ago
parent
61fb767b5a
commit
ac8b54abe5
8 changed files with 167 additions and 82 deletions
Split View Show Diff Stats
  1. 9
    1
      packages/www/pages/index.tsx
  2. 9
    1
      packages/www/pages/r/[id].tsx
  3. 9
    1
      packages/www/pages/r/index.tsx
  4. 9
    1
      packages/www/pages/shhh.tsx
  5. 75
    69
      packages/www/pages/sponsorware.tsx
  6. 9
    1
      packages/www/pages/u/[id].tsx
  7. 12
    6
      packages/www/pages/u/index.tsx
  8. 35
    2
      packages/www/styles/globals.css

+ 9
- 1
packages/www/pages/index.tsx View File 

@@ -1,11 +1,19 @@
1 1 
 import dynamic from 'next/dynamic'
2 2 
 import { GetServerSideProps } from 'next'
3 3 
 import { getSession } from 'next-auth/client'
4 
+import Head from 'next/head'
4 5
5 6 
 const Editor = dynamic(() => import('components/editor'), { ssr: false })
6 7
7 8 
 export default function Shhh(): JSX.Element {
8 
-  return <Editor id="home" />
9 
+  return (
10 
+    <>
11 
+      <Head>
12 
+        <title>tldraw</title>
13 
+      </Head>
14 
+      <Editor id="home" />
15 
+    </>
16 
+  )
9 17 
 }
10 18
11 19 
 export const getServerSideProps: GetServerSideProps = async (context) => {

+ 9
- 1
packages/www/pages/r/[id].tsx View File 

@@ -1,5 +1,6 @@
1 1 
 import * as React from 'react'
2 2 
 import type { GetServerSideProps } from 'next'
3 
+import Head from 'next/head'
3 4 
 import { getSession } from 'next-auth/client'
4 5 
 import dynamic from 'next/dynamic'
5 6 
 const Editor = dynamic(() => import('components/editor'), { ssr: false })
 
@@ -9,7 +10,14 @@ interface RoomProps {
9 10 
 }
10 11
11 12 
 export default function Room({ id }: RoomProps): JSX.Element {
12 
-  return <Editor id={id} />
13 
+  return (
14 
+    <>
15 
+      <Head>
16 
+        <title>tldraw</title>
17 
+      </Head>
18 
+      <Editor id={id} />
19 
+    </>
20 
+  )
13 21 
 }
14 22
15 23 
 export const getServerSideProps: GetServerSideProps = async (context) => {

+ 9
- 1
packages/www/pages/r/index.tsx View File 

@@ -1,12 +1,20 @@
1 1 
 import * as React from 'react'
2 2 
 import type { GetServerSideProps } from 'next'
3 
+import Head from 'next/head'
3 4
4 5 
 interface RoomProps {
5 6 
   id?: string
6 7 
 }
7 8
8 9 
 export default function RandomRoomPage({ id }: RoomProps): JSX.Element {
9 
-  return <div>Should have routed to room: {id}</div>
10 
+  return (
11 
+    <>
12 
+      <Head>
13 
+        <title>tldraw</title>
14 
+      </Head>
15 
+      <div>Should have routed to room: {id}</div>
16 
+    </>
17 
+  )
10 18 
 }
11 19
12 20 
 export const getServerSideProps: GetServerSideProps = async (context) => {

+ 9
- 1
packages/www/pages/shhh.tsx View File 

@@ -1,6 +1,14 @@
1 1 
 import dynamic from 'next/dynamic'
2 2 
 const Editor = dynamic(() => import('components/editor'), { ssr: false })
3 
+import Head from 'next/head'
3 4
4 5 
 export default function Shhh(): JSX.Element {
5 
-  return <Editor id="home" />
6 
+  return (
7 
+    <>
8 
+      <Head>
9 
+        <title>tldraw</title>
10 
+      </Head>
11 
+      <Editor id="home" />
12 
+    </>
13 
+  )
6 14 
 }

+ 75
- 69
packages/www/pages/sponsorware.tsx View File 

@@ -3,80 +3,86 @@ import { getSession, signin, signout, useSession } from 'next-auth/client'
3 3 
 import { GetServerSideProps } from 'next'
4 4 
 import Link from 'next/link'
5 5 
 import React from 'react'
6 
+import Head from 'next/head'
6 7
7 8 
 export default function Sponsorware(): JSX.Element {
8 9 
   const [session, loading] = useSession()
9 10
10 11 
   return (
11 
-    <OuterContent>
12 
-      <Content
13 
-        size={{
14 
-          '@sm': 'small',
15 
-        }}
16 
-      >
17 
-        <h1>tldraw (is sponsorware)</h1>
18 
-        <p>
19 
-          Hey, thanks for visiting <Link href="/">tldraw</Link>, a tiny little drawing app by{' '}
20 
-          <a
21 
-            target="_blank"
22 
-            rel="noreferrer nofollow noopener"
23 
-            href="https://twitter.com/steveruizok"
24 
-          >
25 
-            steveruizok
26 
-          </a>{' '}
27 
-          and friends .
28 
-        </p>
29 
-        <video autoPlay muted playsInline onClick={(e) => e.currentTarget.play()}>
30 
-          <source src="images/hello.mp4" type="video/mp4" />
31 
-        </video>
32 
-        <p>This project is currently: </p>
33 
-        <ul>
34 
-          <li>in development</li>
35 
-          <li>only available for my sponsors</li>
36 
-        </ul>
37 
-        <p>
38 
-          If you&apos;d like to try it out,{' '}
39 
-          <a
40 
-            href="https://github.com/sponsors/steveruizok"
41 
-            target="_blank"
42 
-            rel="noopener noreferrer"
43 
-          >
44 
-            sponsor me on Github
45 
-          </a>{' '}
46 
-          (at any level) and sign in below.
47 
-        </p>
48 
-        <ButtonGroup>
49 
-          {session ? (
50 
-            <>
51 
-              <Button onClick={() => signout()} variant={'secondary'}>
52 
-                Sign Out
53 
-              </Button>
54 
-              <Detail>
55 
-                Signed in as {session?.user?.name} ({session?.user?.email}), but it looks like
56 
-                you&apos;re not yet a sponsor.
57 
-                <br />
58 
-                Something wrong? Try <Link href="/">reloading the page</Link> or DM me on{' '}
59 
-                <a
60 
-                  target="_blank"
61 
-                  rel="noreferrer nofollow noopener"
62 
-                  href="https://twitter.com/steveruizok"
63 
-                >
64 
-                  Twitter
65 
-                </a>
66 
-                .
67 
-              </Detail>
68 
-            </>
69 
-          ) : (
70 
-            <>
71 
-              <Button onClick={() => signin('github')} variant={'primary'}>
72 
-                {loading ? 'Loading...' : 'Sign in With Github'}
73 
-              </Button>
74 
-              <Detail>Already a sponsor? Just sign in to visit the app.</Detail>
75 
-            </>
76 
-          )}
77 
-        </ButtonGroup>
78 
-      </Content>
79 
-    </OuterContent>
12 
+    <>
13 
+      <Head>
14 
+        <title>tldraw</title>
15 
+      </Head>
16 
+      <OuterContent>
17 
+        <Content
18 
+          size={{
19 
+            '@sm': 'small',
20 
+          }}
21 
+        >
22 
+          <h1>tldraw (is sponsorware)</h1>
23 
+          <p>
24 
+            Hey, thanks for visiting <Link href="/">tldraw</Link>, a tiny little drawing app by{' '}
25 
+            <a
26 
+              target="_blank"
27 
+              rel="noreferrer nofollow noopener"
28 
+              href="https://twitter.com/steveruizok"
29 
+            >
30 
+              steveruizok
31 
+            </a>{' '}
32 
+            and friends .
33 
+          </p>
34 
+          <video autoPlay muted playsInline onClick={(e) => e.currentTarget.play()}>
35 
+            <source src="images/hello.mp4" type="video/mp4" />
36 
+          </video>
37 
+          <p>This project is currently: </p>
38 
+          <ul>
39 
+            <li>in development</li>
40 
+            <li>only available for my sponsors</li>
41 
+          </ul>
42 
+          <p>
43 
+            If you&apos;d like to try it out,{' '}
44 
+            <a
45 
+              href="https://github.com/sponsors/steveruizok"
46 
+              target="_blank"
47 
+              rel="noopener noreferrer"
48 
+            >
49 
+              sponsor me on Github
50 
+            </a>{' '}
51 
+            (at any level) and sign in below.
52 
+          </p>
53 
+          <ButtonGroup>
54 
+            {session ? (
55 
+              <>
56 
+                <Button onClick={() => signout()} variant={'secondary'}>
57 
+                  Sign Out
58 
+                </Button>
59 
+                <Detail>
60 
+                  Signed in as {session?.user?.name} ({session?.user?.email}), but it looks like
61 
+                  you&apos;re not yet a sponsor.
62 
+                  <br />
63 
+                  Something wrong? Try <Link href="/">reloading the page</Link> or DM me on{' '}
64 
+                  <a
65 
+                    target="_blank"
66 
+                    rel="noreferrer nofollow noopener"
67 
+                    href="https://twitter.com/steveruizok"
68 
+                  >
69 
+                    Twitter
70 
+                  </a>
71 
+                  .
72 
+                </Detail>
73 
+              </>
74 
+            ) : (
75 
+              <>
76 
+                <Button onClick={() => signin('github')} variant={'primary'}>
77 
+                  {loading ? 'Loading...' : 'Sign in With Github'}
78 
+                </Button>
79 
+                <Detail>Already a sponsor? Just sign in to visit the app.</Detail>
80 
+              </>
81 
+            )}
82 
+          </ButtonGroup>
83 
+        </Content>
84 
+      </OuterContent>
85 
+    </>
80 86 
   )
81 87 
 }
82 88

+ 9
- 1
packages/www/pages/u/[id].tsx View File 

@@ -1,13 +1,21 @@
1 1 
 import * as React from 'react'
2 2 
 import type { GetServerSideProps } from 'next'
3 3 
 import { getSession } from 'next-auth/client'
4 
+import Head from 'next/head'
4 5
5 6 
 interface RoomProps {
6 7 
   id?: string
7 8 
 }
8 9
9 10 
 export default function OtherUserPage({ id }: RoomProps): JSX.Element {
10 
-  return <div>Todo, other user: {id}</div>
11 
+  return (
12 
+    <>
13 
+      <Head>
14 
+        <title>tldraw</title>
15 
+      </Head>
16 
+      <div>Todo, other user: {id}</div>
17 
+    </>
18 
+  )
11 19 
 }
12 20
13 21 
 export const getServerSideProps: GetServerSideProps = async (context) => {

+ 12
- 6
packages/www/pages/u/index.tsx View File 

@@ -3,6 +3,7 @@ import type { GetServerSideProps } from 'next'
3 3 
 import { getSession } from 'next-auth/client'
4 4 
 import type { Session } from 'next-auth'
5 5 
 import { signOut } from 'next-auth/client'
6 
+import Head from 'next/head'
6 7
7 8 
 interface UserPageProps {
8 9 
   session: Session
 
@@ -10,12 +11,17 @@ interface UserPageProps {
10 11
11 12 
 export default function UserPage({ session }: UserPageProps): JSX.Element {
12 13 
   return (
13 
-    <div>
14 
-      <pre>
15 
-        <code>{JSON.stringify(session.user, null, 2)}</code>
16 
-      </pre>
17 
-      <button onClick={() => signOut}>Sign Out</button>
18 
-    </div>
14 
+    <>
15 
+      <Head>
16 
+        <title>tldraw</title>
17 
+      </Head>
18 
+      <div>
19 
+        <pre>
20 
+          <code>{JSON.stringify(session.user, null, 2)}</code>
21 
+        </pre>
22 
+        <button onClick={() => signOut}>Sign Out</button>
23 
+      </div>
24 
+    </>
19 25 
   )
20 26 
 }
21 27

+ 35
- 2
packages/www/styles/globals.css View File 

@@ -1,9 +1,42 @@
1 
+@font-face {
2 
+  font-family: 'Recursive';
3 
+  font-style: normal;
4 
+  font-weight: 500;
5 
+  font-display: swap;
6 
+  src: url(https://fonts.gstatic.com/s/recursive/v23/8vI-7wMr0mhh-RQChyHEH06TlXhq_gukbYrFMk1QuAIcyEwG_X-dpEfaE5YaERmK-CImKsvxvU-MXGX2fSqasNfUlTGZnI14ZeY.woff2)
7 
+    format('woff2');
8 
+  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F,
9 
+    U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
10 
+}
11 
+
12 
+@font-face {
13 
+  font-family: 'Recursive';
14 
+  font-style: normal;
15 
+  font-weight: 700;
16 
+  font-display: swap;
17 
+  src: url(https://fonts.gstatic.com/s/recursive/v23/8vI-7wMr0mhh-RQChyHEH06TlXhq_gukbYrFMk1QuAIcyEwG_X-dpEfaE5YaERmK-CImKsvxvU-MXGX2fSqasNfUlTGZnI14ZeY.woff2)
18 
+    format('woff2');
19 
+  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F,
20 
+    U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
21 
+}
22 
+
23 
+@font-face {
24 
+  font-family: 'Recursive Mono';
25 
+  font-style: normal;
26 
+  font-weight: 420;
27 
+  font-display: swap;
28 
+  src: url(https://fonts.gstatic.com/s/recursive/v23/8vI-7wMr0mhh-RQChyHEH06TlXhq_gukbYrFMk1QuAIcyEwG_X-dpEfaE5YaERmK-CImqvTxvU-MXGX2fSqasNfUlTGZnI14ZeY.woff2)
29 
+    format('woff2');
30 
+  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F,
31 
+    U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
32 
+}
33 
+
1 34 
 html,
2 35 
 body {
3 36 
   padding: 0;
4 37 
   margin: 0;
5 
-  font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen,
6 
-    Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;
38 
+  font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell,
39 
+    Fira Sans, Droid Sans, Helvetica Neue, sans-serif;
7 40 
 }
8 41
9 42 
 a {

Write Preview
Loading…
Cancel
Save