fix: add more example queries

.github/FUNDING.yml

@@ -3,7 +3,7 @@
 github: [uetchy]
 patreon: # Replace with a single Patreon username
 open_collective: # Replace with a single Open Collective username
-ko_fi: # Replace with a single Ko-fi username
+ko_fi: uetchy
 tidelift: # Replace with a single Tidelift platform-name/package-name e.g., npm/babel
 community_bridge: # Replace with a single Community Bridge project-name e.g., cloud-foundry
 liberapay: # Replace with a single Liberapay username

api/services/spectrum/[query].ts

@@ -1,31 +0,0 @@
-import { send, sendError, fetch } from '../../../util/http';
-import { VercelRequest, VercelResponse } from '@vercel/node';
-
-export default async function handler(
-  req: VercelRequest,
-  res: VercelResponse
-): Promise<void> {
-  const { query } = req.query;
-
-  if (!query || typeof query !== 'string') {
-    return sendError(res, new Error('No query given'));
-  }
-
-  if (/[^a-zA-Z0-9_-]/.test(query)) {
-    return sendError(res, new Error('Invalid characters'));
-  }
-
-  try {
-    const response = await fetch(
-      `https://spectrum.chat/${encodeURIComponent(query)}`,
-      'GET'
-    );
-    const body = await response.text();
-    const availability = body.includes(
-      'You may be trying to view something that is deleted'
-    );
-    send(res, { availability });
-  } catch (err: any) {
-    sendError(res, err);
-  }
-}

src/components/Welcome.tsx

@@ -85,6 +85,12 @@ const Welcome: React.FC = () => {
                 {t('gettingStartedWithExample')}
               </Link>
             </ListButton>
+            <Subtle>or</Subtle>
+            <HList>
+              <Link to="/s/SpaceX">SpaceX</Link>
+              <Link to="/s/Netflix">Netflix</Link>
+              <Link to="/s/Zoom">Zoom</Link>
+            </HList>
           </List>
         </ButtonContainer>
       </Section>
@@ -105,6 +111,10 @@ const Welcome: React.FC = () => {
 
 export default Welcome;
 
+const Subtle = styled.span`
+  color: #5a5a5a;
+`;
+
 const Container = styled.div`
   /* padding-bottom: 40px; */
   text-align: center;
@@ -121,7 +131,7 @@ const Section = styled.div`
   padding: 40px 20vw 100px;
 
   ${mobile} {
-    padding: 60px 40px;
+    padding: 0px 40px 50px;
   }
 `;
 
@@ -166,19 +176,36 @@ const HeroText = styled.p`
 `;
 
 const ButtonContainer = styled.div`
-  margin: 10px 0 0 0;
+  margin: 30px 0 0 0;
 `;
 
 const List = styled.div`
+  display: flex;
+  flex-direction: column;
+  flex-wrap: wrap;
+  justify-content: center;
+  align-items: center;
+
+  font-size: 1rem;
+`;
+
+const HList = styled.div`
   display: flex;
   flex-direction: row;
   flex-wrap: wrap;
   justify-content: center;
-
+  align-items: center;
   font-size: 1rem;
 
-  ${mobile} {
-    justify-content: flex-start;
+  a {
+    color: black;
+    border-bottom: 1px dashed black;
+    text-decoration: none;
+    font-family: monospace;
+  }
+
+  > *:not(:last-child) {
+    margin-right: 15px;
   }
 `;
 
@@ -211,9 +238,10 @@ const ListButton = styled.div`
   }
 
   a {
-    color: black;
+    color: #632bec;
     padding: 12px 25px;
-    border: 1px solid black;
+    border: 2px solid #632bec;
+    font-family: monospace;
     border-radius: 2px;
     text-decoration: none;