diff --git a/readme.md b/readme.md index 56d7b3a..f9bf24b 100644 --- a/readme.md +++ b/readme.md @@ -1,6 +1,6 @@

- Example article page + Example article page

@@ -72,7 +72,15 @@ They mainly target global CSS classes exported by react-notion-x [styles.css](ht It should be pretty easy to customize most styling-related things, especially with local development and hot reload. -Dark mode is fully supported by `react-notion-x`, but it not not yet customizable via the UI. You can add `?dark=true` to play around with it. +### Dark Mode + +

+ Light Mode + + Dark Mode +

+ +Dark mode is fully supported and can be toggled via the sun / moon icon in the site footer. ## Extras @@ -92,6 +100,10 @@ This environment variable will only be taken into account in production, so you ### GitHub Comments +

+ Embedded GitHub Comments +

+ [Utteranc.es](https://utteranc.es/) is an amazing [open source project](https://github.com/utterance/utterances) which enables developers to embed GitHub issues as a comments section on their websites. Genius. The integration is really simple. Just edit the `utterancesGitHubRepo` config value to point to the repo you'd like to use for issue comments. @@ -122,7 +134,7 @@ The actual work happens in the [create-preview-image](./api/create-preview-image ### Automatic Social Images

- Auto-generated social image + Auto-generated social image

Open Graph images like this one will be generated for each page of your site automatically based each page's content. @@ -154,12 +166,6 @@ This table of contents uses the same logic that Notion uses for its built-in Tab ## Screenshots -### Mobile Home Page - - - Mobile Home Page - - ### Mobile Article Page @@ -169,13 +175,13 @@ This table of contents uses the same logic that Notion uses for its built-in Tab ### Desktop Home Page - Desktop Home Page + Desktop Home Page -### Desktop Article Page +### Desktop Article Page (Dark Mode) - Desktop Article Page + Desktop Article Page ## License