Draft of Sponsor page; Add GitHub to menu; Tweak header theme

clowdr-app · May 20, 2022 · 160f3fa · 160f3fa
1 parent d61dcba
commit 160f3fa
Show file tree

Hide file tree

Showing 10 changed files with 437 additions and 45 deletions.
diff --git a/.gitignore b/.gitignore
@@ -69,4 +69,6 @@ yarn-error.log
 .yarn-integrity
 
 # Generated d.ts for SCSS
-*.module.scss.d.ts
+*.module.scss.d.ts
+pktriot.json
+certs
diff --git a/.vscode/tasks.json b/.vscode/tasks.json
@@ -0,0 +1,20 @@
+{
+  // See https://go.microsoft.com/fwlink/?LinkId=733558
+  // for the documentation about the tasks.json format
+  "version": "2.0.0",
+  "tasks": [
+    {
+      "label": "Packetriot",
+      "type": "shell",
+      "command": "pktriot",
+      "problemMatcher": [],
+      "options": {
+        "cwd": "${workspaceFolder}"
+      },
+      "runOptions": {
+        "instanceLimit": 1
+      },
+      "args": ["start", "--config", "pktriot.json"]
+    }
+  ]
+}
diff --git a/src/components/footer.tsx b/src/components/footer.tsx
@@ -35,9 +35,13 @@ export default function Footer() {
               <UnorderedList styleType="none" ml={0}>
                 {menuItems.map((menuItem, i) => (
                   <ListItem key={i}>
-                    <Link as={GatsbyLink} to={menuItem.link}>
-                      {menuItem.text}
-                    </Link>
+                    {menuItem.link.startsWith("http") ? (
+                      <Link href={menuItem.link}>{menuItem.text}</Link>
+                    ) : (
+                      <Link as={GatsbyLink} to={menuItem.link}>
+                        {menuItem.text}
+                      </Link>
+                    )}
                   </ListItem>
                 ))}
               </UnorderedList>

diff --git a/src/components/menus/desktop-menu.tsx b/src/components/menus/desktop-menu.tsx
@@ -25,34 +25,42 @@ export function DesktopMenu(): JSX.Element {
         overflowX="auto"
       >
         <HStack flexWrap="wrap" columnGap={0} layerStyle="hero" py={2}>
-          <HStack fontSize="large" justifyContent="flex-start" flex={1}>
+          <HStack justifyContent="flex-start" flex={1}>
             <chakra.a
               as={GatsbyLink}
               to="/"
               title="Midspace Home Page"
               alignItems="center"
               ml={4}
             >
-              <Image alt="" src="/midspace-wordmark.svg" maxW="200" h="100" />
+              <Image alt="" src="/midspace-wordmark.svg" maxW="150" h="100" />
               <VisuallyHidden>
-                <chakra.h1 fontSize="3xl" fontWeight="400">
-                  Midspace
-                </chakra.h1>
+                <chakra.h1>Midspace</chakra.h1>
               </VisuallyHidden>
             </chakra.a>
             <Spacer />
-            {menuItems.map((menuItem, i) => (
-              <Link
-                as={GatsbyLink}
-                to={menuItem.link}
-                key={i}
-                flexBasis="max-content"
-                fontSize="xl"
-                p={4}
-              >
-                {menuItem.text}
-              </Link>
-            ))}
+            {menuItems.map((menuItem, i) =>
+              menuItem.link.startsWith("http") ? (
+                <Link
+                  href={menuItem.link}
+                  key={i}
+                  flexBasis="max-content"
+                  p={4}
+                >
+                  {menuItem.text}
+                </Link>
+              ) : (
+                <Link
+                  as={GatsbyLink}
+                  to={menuItem.link}
+                  key={i}
+                  flexBasis="max-content"
+                  p={4}
+                >
+                  {menuItem.text}
+                </Link>
+              )
+            )}
           </HStack>
         </HStack>
       </Container>

diff --git a/src/components/menus/mobile-menu.tsx b/src/components/menus/mobile-menu.tsx
@@ -33,11 +33,9 @@ export function MobileMenu(): JSX.Element {
             alignItems="center"
             ml={4}
           >
-            <Image alt="" src="/midspace-wordmark.svg" maxW="200" h="100" />
+            <Image alt="" src="/midspace-wordmark.svg" maxW="150" h="100" />
             <VisuallyHidden>
-              <chakra.h1 fontSize="3xl" fontWeight="400">
-                Midspace
-              </chakra.h1>
+              <chakra.h1>Midspace</chakra.h1>
             </VisuallyHidden>
           </chakra.a>
         </Flex>
@@ -79,17 +77,23 @@ export function MobileMenu(): JSX.Element {
             variant="solid"
           />
 
-          {menuItems.map((menuItem, i) => (
-            <Link
-              as={GatsbyLink}
-              to={menuItem.link}
-              w="full"
-              key={i}
-              fontSize="lg"
-            >
-              {menuItem.text}
-            </Link>
-          ))}
+          {menuItems.map((menuItem, i) =>
+            menuItem.link.startsWith("http") ? (
+              <Link href={menuItem.link} w="full" key={i} fontSize="lg">
+                {menuItem.text}
+              </Link>
+            ) : (
+              <Link
+                as={GatsbyLink}
+                to={menuItem.link}
+                w="full"
+                key={i}
+                fontSize="lg"
+              >
+                {menuItem.text}
+              </Link>
+            )
+          )}
         </VStack>
       </Flex>
     </nav>

diff --git a/src/misc/menu-items.ts b/src/misc/menu-items.ts
@@ -6,4 +6,5 @@ export const menuItems: {
   { link: "/sponsor", text: "Sponsorship" },
   { link: "/resources", text: "Resources" },
   { link: "/contact", text: "Contact Us" },
+  { link: "https://github.com/clowdr-app/clowdr", text: "GitHub" },
 ];
diff --git a/src/pages/contact.tsx b/src/pages/contact.tsx
@@ -36,8 +36,8 @@ export default function Contact() {
             We are only able to assist with conferences hosted on our service.
             We are not able to help attendees, speakers or other users of
             self-hosted instances of the Midspace software. If you are unable to
-            resolve your problem via your conference organizers and accessing a
-            conference hosted on our services, please contact us via{" "}
+            resolve your problem via your conference organizers and are
+            accessing a conference hosted on our services, please contact us via{" "}
             <Link href="https://support.midspace.app/">our support desk</Link>.
           </Text>
         </Container>

diff --git a/src/pages/index.tsx b/src/pages/index.tsx
@@ -138,7 +138,7 @@ export default function Home() {
           }}
           mobileProps={{ mt: 40 }}
         />
-        <Container mt={40} textAlign="center"></Container>
+        <Container h={40} textAlign="center"></Container>
       </Layout>
     </>
   );