refactor: minor design thingies

experiment-station · Dec 15, 2023 · 602fb52 · 602fb52
1 parent 29a24cc
commit 602fb52
Show file tree

Hide file tree

Showing 3 changed files with 12 additions and 10 deletions.
diff --git a/components/episode-card.tsx b/components/episode-card.tsx
@@ -28,18 +28,17 @@ export function EpisodeCard(props: Props) {
             }}
             gap={{
               initial: '3',
-              lg: '5',
               md: '4',
             }}
-            p="2"
+            p="1"
           >
             <Flex direction="column" gap="3">
               <Heading
                 color="gray"
                 highContrast
                 size={{
                   initial: '2',
-                  md: '3',
+                  md: '2',
                 }}
               >
                 {props.title}
@@ -53,17 +52,19 @@ export function EpisodeCard(props: Props) {
                 </Text>
               ) : null}
 
-              <Flex align="center" direction="row" gap="3">
-                <Button highContrast>
+              <Flex align="center" direction="row" gap="4">
+                <Button highContrast size="1">
                   <FaPlay />
                   Play
                 </Button>
 
                 <Flex gap="1">
                   <Text size="2">{formatDuration(props.duration * 1000)}</Text>
+
                   {props.published_date ? (
                     <>
                       <Text size="2">•</Text>
+
                       <Text size="2">
                         {format(
                           new Date(props.published_date * 1000),

diff --git a/components/layout/app-footer.tsx b/components/layout/app-footer.tsx
@@ -33,23 +33,23 @@ export function AppFooter() {
     <AppContent>
       <Flex align="end" justify="between" py="4">
         <Flex align="start" direction="column">
-          <Text size="2" weight="bold">
+          <Text size="2" weight="medium">
             Built with ☕️ by your folks at the{' '}
             <Link color="gray" href="https://experiment.st" target="_blank">
-              Experiment Station
+              experiment.st
             </Link>
           </Text>
 
           <Flex align="center" gap="1">
             {FOOTER_SERVICE_LINKS.map((link) => (
               <React.Fragment key={link.href}>
-                <Link color="gray" href={link.href} size="2" target="_blank">
+                <Link color="gray" href={link.href} size="1" target="_blank">
                   {link.label}
                 </Link>
 
                 {link !==
                 FOOTER_SERVICE_LINKS[FOOTER_SERVICE_LINKS.length - 1] ? (
-                  <Text size="2">·</Text>
+                  <Text size="1">·</Text>
                 ) : null}
               </React.Fragment>
             ))}

diff --git a/components/layout/app-header.tsx b/components/layout/app-header.tsx
@@ -75,8 +75,9 @@ function AppHeaderActionsAuthenticated(
       <DropdownMenuContent
         align="end"
         highContrast
+        size="2"
         style={{
-          minWidth: 200,
+          minWidth: 120,
         }}
       >
         <DropdownMenuLabel asChild>