https://github.com/maykbrito/electron-desktop-custom-notion-omni

Inject custom CSS to beautify Notion.so
https://github.com/maykbrito/electron-desktop-custom-notion-omni

css

Last synced: 17 days ago
JSON representation

Inject custom CSS to beautify Notion.so

• Host: GitHub
• URL: https://github.com/maykbrito/electron-desktop-custom-notion-omni
• Owner: maykbrito
• Created: 2021-03-07T14:46:01.000Z (over 3 years ago)
• Default Branch: main
• Last Pushed: 2024-08-28T14:37:04.000Z (2 months ago)
• Last Synced: 2024-08-28T16:09:32.556Z (2 months ago)
• Topics: css
• Language: JavaScript
• Homepage:
• Size: 56.5 MB
• Stars: 71
• Watchers: 5
• Forks: 11
• Open Issues: 3
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# Notion Omni

Inject some JS/CSS to customize Notion ;)

---



How to build    

Features

    

Contact

    



![Preview](.github/preview.png)

---

## How to build

1. Install

```sh

yarn

```

2. Build

```sh

yarn package

```

3. Run your new app.

   _It will be at dir ./out_

4. Put your Notion in Dark Mode ;)

# Features

## Content Only

Because we love a clean layout, we can toggle (show/hide) view of

- header bar

- page title & attributes block

- help button

by pressing `ctrl+esc`

![Imgur](https://i.imgur.com/NkJz7cn.gif)

---

## Slide Presentation

You can use this app as a slide presentation.

![Slides preview](https://i.imgur.com/9QL2WTy.gif)

### 🤔 How?

1. Prepare your presentation

   - Each divider will be a new slide block

2. Toggle presentation with `SHIFT+ESC`

Try this.

Create a new Notion page and add code bellow, then hit `SHIFT+ESC` to see the magic.

```md

---

# Slide one

Some content

---

## Slide two

Second slide

---

## With h2 header

Try it!

```

# Contact

Mayk Brito

- [maykbrito.dev](https://maykbrito.dev)

---

If this project helps you, please leave your star 🌟 Thank you 💛