Restore intro posts, fix tertiary link colors

apsislabs · Nov 25, 2024 · b66a292 · b66a292
1 parent 8a18eb8
commit b66a292
Show file tree

Hide file tree

Showing 7 changed files with 40 additions and 6 deletions.
diff --git a/archived/2016-02-01-number-one-employee.md → posts/2016-02-01-number-one-employee.md b/archived/2016-02-01-number-one-employee.md → posts/2016-02-01-number-one-employee.md
diff --git a/archived/2016-02-15-a-startup-life-for-me.md → posts/2016-02-15-a-startup-life-for-me.md b/archived/2016-02-15-a-startup-life-for-me.md → posts/2016-02-15-a-startup-life-for-me.md
diff --git a/...11-02-on-getting-hired-the-second-time.md → ...11-02-on-getting-hired-the-second-time.md b/...11-02-on-getting-hired-the-second-time.md → ...11-02-on-getting-hired-the-second-time.md
diff --git a/src/components/Footer.tsx b/src/components/Footer.tsx
@@ -8,13 +8,13 @@ const now = new Date();
 export const Footer = () => (
   <footer className={styles.footer}>
     <Row>
-      <div>
+      <div className="stack gap-md">
         <Link href="/" className={styles.footer__logo}>
           <LogoType size={18} className={styles.footer__logotype} />
         </Link>
 
         <small>
-          <ul role="list" className="inline_list">
+          <ul role="list" className={styles.footer__nav}>
             <li>Copyright {now.getFullYear()} Apsis Labs, LLP</li>
 
             <li>
@@ -44,7 +44,7 @@ export const Footer = () => (
         </small>
 
         <small>
-          <ul role="list" className="inline_list">
+          <ul role="list" className={styles.footer__nav}>
             <li>
               <Link className="link" href="/privacy">
                 Privacy Policy

diff --git a/src/components/Hero.tsx b/src/components/Hero.tsx
@@ -22,7 +22,7 @@ export const Hero = () => {
     <div className={styles.hero}>
       <div className={styles.hero__headline}>
         <h3 className={styles.hero__title}>
-          Your app &mdash;
+          Your <span className="text-primary">app</span> &mdash;
           <br />
           built by{" "}
           <TypeEffect
@@ -36,7 +36,10 @@ export const Hero = () => {
         </div>
 
         <div className={styles.hero__actions}>
-          <Button href="mailto:[email protected]?subject=Apsis Project Inquiry" EndIcon={ChevronRight}>
+          <Button
+            href="mailto:[email protected]?subject=Apsis Project Inquiry"
+            EndIcon={ChevronRight}
+          >
             Let's get to work
           </Button>
 

diff --git a/src/styles/components/Button.module.scss b/src/styles/components/Button.module.scss
@@ -80,16 +80,33 @@
     outline: none;
     box-shadow: none;
 
+    @media screen and (prefers-color-scheme: dark) {
+      color: var(--white);
+    }
+
+    &:hover {
+      text-decoration: underline;
+    }
+
     &:hover,
     &:focus {
       outline: none;
       box-shadow: none;
       color: var(--apsis_dark);
-      text-decoration: underline;
+
+      @media screen and (prefers-color-scheme: dark) {
+        color: var(--white);
+        opacity: 0.9;
+      }
     }
 
     &:active {
       color: var(--apsis_gray);
+
+      @media screen and (prefers-color-scheme: dark) {
+        color: var(--white);
+        opacity: 0.5;
+      }
     }
   }
 }
diff --git a/src/styles/components/Footer.module.scss b/src/styles/components/Footer.module.scss
@@ -32,4 +32,18 @@
       font-size: var(--font_size_h6);
     }
   }
+
+  &__nav {
+    display: flex;
+    flex-direction: column;
+    gap: var(--spacing_xs);
+    padding: 0;
+    margin: 0;
+
+    @media (min-width: vars.$mobile) {
+      align-items: center;
+      flex-direction: row;
+      gap: var(--spacing);
+    }
+  }
 }