From 60d52e9350d13c86815d6a09c95e8a4d18eb1f59 Mon Sep 17 00:00:00 2001
From: Travis Fischer <fisch0920@gmail.com>
Date: Sat, 16 Jan 2021 17:09:08 -0500
Subject: [PATCH] =?UTF-8?q?=F0=9F=8C=A1?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 components/NotionPage.tsx |  6 +++++-
 styles/notion.css         | 22 +++++++++++++++++-----
 2 files changed, 22 insertions(+), 6 deletions(-)

diff --git a/components/NotionPage.tsx b/components/NotionPage.tsx
index 9d5d0dd..08ed545 100644
--- a/components/NotionPage.tsx
+++ b/components/NotionPage.tsx
@@ -1,6 +1,7 @@
 import * as React from 'react'
 import Head from 'next/head'
 import Link from 'next/link'
+import cs from 'classnames'
 import { useRouter } from 'next/router'
 import { useLocalStorage, useSearchParam } from 'react-use'
 import { IconContext } from 'react-icons'
@@ -104,7 +105,10 @@ export const NotionPage: React.FC<types.PageProps> = ({
       {isLiteMode && <BodyClassName className='notion-lite' />}
 
       <NotionRenderer
-        bodyClassName={styles.notion}
+        bodyClassName={cs(
+          styles.notion,
+          pageId === site.rootNotionPageId && 'index-page'
+        )}
         components={{
           pageLink: ({
             href,
diff --git a/styles/notion.css b/styles/notion.css
index b5e94f0..2552f07 100644
--- a/styles/notion.css
+++ b/styles/notion.css
@@ -1,10 +1,14 @@
 .notion-page {
   margin: 0 12px;
-  width: 728px;
+  width: 720px;
   padding-bottom: calc(max(5vh, 64px)) !important;
   line-height: 1.75;
 }
 
+.index-page {
+  width: 900px;
+}
+
 .notion-text {
   padding: 0.5em 2px;
 }
@@ -24,7 +28,7 @@
 }
 
 .notion-gallery-grid {
-  grid-template-columns: repeat(auto-fill, minmax(500px, 1fr));
+  grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));
   grid-gap: 6vmin;
   gap: 6vmin;
 }
@@ -35,6 +39,7 @@
 
 .notion-gallery-grid .notion-page-title-text {
   font-size: 2em;
+  white-space: unset;
 }
 
 .notion-gallery-grid .notion-collection-card-property {
@@ -44,8 +49,14 @@
 
 .notion-collection-card {
   border-radius: 10px;
-  box-shadow: rgba(15, 15, 15, 0.1) 2px 2px 8px 8px;
-  transition: all 150ms linear;
+  border-top-right-radius: 0;
+  border-bottom-left-radius: 0;
+  box-shadow: 2px 2px 8px 4px rgba(15, 15, 15, 0.1);
+}
+
+/*
+.notion-collection-card {
+  transition: background-color 150ms linear;
 }
 
 .notion-collection-card:hover .notion-collection-card-cover {
@@ -54,5 +65,6 @@
 
 .notion-collection-card-cover {
   transition: filter 150ms linear;
-  filter: grayscale(0.5);
+  filter: grayscale(0.25);
 }
+*/