fix(site): update vertical alignment

seed-hypermedia · Oct 23, 2023 · 0f12c6f · 0f12c6f
1 parent 109fd29
commit 0f12c6f
Show file tree

Hide file tree

Showing 5 changed files with 38 additions and 28 deletions.
diff --git a/frontend/apps/site/src/account-page.tsx b/frontend/apps/site/src/account-page.tsx
@@ -19,7 +19,6 @@ import {OpenInAppLink} from 'src/metadata'
 import {HMAccount} from '@mintter/shared/src/json-hm'
 
 function AccountContent({account}: {account: HMAccount | null | undefined}) {
-
   // return (
   //   <XStack alignItems="center" gap="$3">
   //     {avatar && (

diff --git a/frontend/apps/site/src/publication-page.tsx b/frontend/apps/site/src/publication-page.tsx
@@ -129,7 +129,12 @@ export default function PublicationPage({
         <PageSection.Content paddingBottom={80}>
           {pub ? (
             <SitePublicationContentProvider unpackedId={pubId}>
-              <PublicationContent publication={pub} />
+              <PublicationContent
+                paddingHorizontal={0}
+                // $gtMd={{paddingHorizontal: '$3'}}
+                // $gtLg={{paddingHorizontal: '$3'}}
+                publication={pub}
+              />
             </SitePublicationContentProvider>
           ) : publication.isLoading ? (
             <PublicationPlaceholder />

diff --git a/frontend/apps/site/src/site-head.tsx b/frontend/apps/site/src/site-head.tsx
@@ -22,10 +22,11 @@ export function SiteHead({pageTitle}: {pageTitle?: string}) {
         {siteTitle && <meta property="og:site_name" content={siteTitle} />}
       </Head>
       <PageSection.Side />
-      <PageSection.Content paddingBottom={20}>
+      <PageSection.Content>
         <XStack
           paddingHorizontal="$3"
-          $gtMd={{paddingHorizontal: '$4'}}
+          $gtMd={{paddingHorizontal: '$5'}}
+          // $gtLg={{paddingHorizontal: '$4'}}
           gap="$2"
           alignItems="baseline"
           marginTop="$5"
@@ -34,7 +35,9 @@ export function SiteHead({pageTitle}: {pageTitle?: string}) {
             borderRadius="$2"
             hoverStyle={{backgroundColor: '$color6'}}
             alignItems="center"
-            paddingHorizontal="$3"
+            paddingHorizontal="$2"
+            // $gtMd={{paddingHorizontal: '$3'}}
+            // $gtLg={{paddingHorizontal: '$'}}
             paddingVertical="$2"
           >
             <NextLink

diff --git a/frontend/packages/shared/src/publication-content.tsx b/frontend/packages/shared/src/publication-content.tsx
@@ -38,6 +38,7 @@ import {
   XStack,
   YStack,
   YStackProps,
+  XStackProps,
 } from '@mintter/ui'
 import {AlertCircle, Book} from '@tamagui/lucide-icons'
 import {
@@ -189,14 +190,16 @@ function debugStyles(debug: boolean = false, color: ColorProp = '$color7') {
 
 export function PublicationContent({
   publication,
-}: {
+  ...props
+}: XStackProps & {
   publication: Publication | HMPublication
 }) {
   const {layoutUnit} = usePublicationContentContext()
   return (
     <XStack
       paddingHorizontal={layoutUnit / 2}
       $gtMd={{paddingHorizontal: layoutUnit}}
+      {...props}
     >
       <BlockNodeList childrenType={'group'}>
         {publication.document?.children?.length &&

diff --git a/yarn.lock b/yarn.lock
@@ -12340,7 +12340,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"array-includes@npm:^3.1.6":
+"array-includes@npm:^3.1.6, array-includes@npm:^3.1.7":
   version: 3.1.7
   resolution: "array-includes@npm:3.1.7"
   dependencies:
@@ -12360,7 +12360,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"array.prototype.findlastindex@npm:^1.2.2":
+"array.prototype.findlastindex@npm:^1.2.3":
   version: 1.2.3
   resolution: "array.prototype.findlastindex@npm:1.2.3"
   dependencies:
@@ -12373,7 +12373,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"array.prototype.flat@npm:^1.3.1":
+"array.prototype.flat@npm:^1.3.1, array.prototype.flat@npm:^1.3.2":
   version: 1.3.2
   resolution: "array.prototype.flat@npm:1.3.2"
   dependencies:
@@ -12385,7 +12385,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"array.prototype.flatmap@npm:^1.3.1":
+"array.prototype.flatmap@npm:^1.3.1, array.prototype.flatmap@npm:^1.3.2":
   version: 1.3.2
   resolution: "array.prototype.flatmap@npm:1.3.2"
   dependencies:
@@ -16976,7 +16976,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"eslint-import-resolver-node@npm:^0.3.6, eslint-import-resolver-node@npm:^0.3.7":
+"eslint-import-resolver-node@npm:^0.3.6, eslint-import-resolver-node@npm:^0.3.9":
   version: 0.3.9
   resolution: "eslint-import-resolver-node@npm:0.3.9"
   dependencies:
@@ -17018,29 +17018,29 @@ __metadata:
   linkType: hard
 
 "eslint-plugin-import@npm:^2.26.0":
-  version: 2.28.1
-  resolution: "eslint-plugin-import@npm:2.28.1"
+  version: 2.29.0
+  resolution: "eslint-plugin-import@npm:2.29.0"
   dependencies:
-    array-includes: ^3.1.6
-    array.prototype.findlastindex: ^1.2.2
-    array.prototype.flat: ^1.3.1
-    array.prototype.flatmap: ^1.3.1
+    array-includes: ^3.1.7
+    array.prototype.findlastindex: ^1.2.3
+    array.prototype.flat: ^1.3.2
+    array.prototype.flatmap: ^1.3.2
     debug: ^3.2.7
     doctrine: ^2.1.0
-    eslint-import-resolver-node: ^0.3.7
+    eslint-import-resolver-node: ^0.3.9
     eslint-module-utils: ^2.8.0
-    has: ^1.0.3
-    is-core-module: ^2.13.0
+    hasown: ^2.0.0
+    is-core-module: ^2.13.1
     is-glob: ^4.0.3
     minimatch: ^3.1.2
-    object.fromentries: ^2.0.6
-    object.groupby: ^1.0.0
-    object.values: ^1.1.6
+    object.fromentries: ^2.0.7
+    object.groupby: ^1.0.1
+    object.values: ^1.1.7
     semver: ^6.3.1
     tsconfig-paths: ^3.14.2
   peerDependencies:
     eslint: ^2 || ^3 || ^4 || ^5 || ^6 || ^7.2.0 || ^8
-  checksum: e8ae6dd8f06d8adf685f9c1cfd46ac9e053e344a05c4090767e83b63a85c8421ada389807a39e73c643b9bff156715c122e89778169110ed68d6428e12607edf
+  checksum: 19ee541fb95eb7a796f3daebe42387b8d8262bbbcc4fd8a6e92f63a12035f3d2c6cb8bc0b6a70864fa14b1b50ed6b8e6eed5833e625e16cb6bb98b665beff269
   languageName: node
   linkType: hard
 
@@ -20271,7 +20271,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"is-core-module@npm:^2.11.0, is-core-module@npm:^2.13.0":
+"is-core-module@npm:^2.11.0, is-core-module@npm:^2.13.0, is-core-module@npm:^2.13.1":
   version: 2.13.1
   resolution: "is-core-module@npm:2.13.1"
   dependencies:
@@ -24353,7 +24353,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"object.fromentries@npm:^2.0.6":
+"object.fromentries@npm:^2.0.6, object.fromentries@npm:^2.0.7":
   version: 2.0.7
   resolution: "object.fromentries@npm:2.0.7"
   dependencies:
@@ -24364,7 +24364,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"object.groupby@npm:^1.0.0":
+"object.groupby@npm:^1.0.1":
   version: 1.0.1
   resolution: "object.groupby@npm:1.0.1"
   dependencies:
@@ -24404,7 +24404,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"object.values@npm:^1.1.6":
+"object.values@npm:^1.1.6, object.values@npm:^1.1.7":
   version: 1.1.7
   resolution: "object.values@npm:1.1.7"
   dependencies: