react-notion-x icon indicating copy to clipboard operation
react-notion-x copied to clipboard

Notion Icon aligned left.

Open EC-Sol opened this issue 3 years ago • 1 comments
trafficstars

Description

This is original notion page. 스크린샷 2022-04-12 오후 12 26 57

And then NotionRenderer result. 스크린샷 2022-04-12 오후 12 24 57

It caused by "left: 50%" in class "notion-page-icon-hero" at "react-notion-x/src/styles.css".

.notion-page-icon-hero {
  position: absolute;
  top: 0;
  left: 50%;
  display: flex;
  flex-direction: row;
  justify-content: center;
}

This is delete "left: 50%" result in browser. 스크린샷 2022-04-12 오후 12 38 37

Also "margin-left: -39px" in class ".notion-page-icon-hero.notion-page-icon-span " too problem.

.notion-page-icon-hero.notion-page-icon-span {
  height: 78px;
  width: 78px;
  margin-left: -39px;
}

This is delete "margin-left: -39px" result in browser. 스크린샷 2022-04-12 오후 12 41 45

Notion Test Page ID

Page ID: https://www.notion.so/React-Notion-X-List-Test-8cd35eb807b247f68d92d13238112a59

EC-Sol avatar Apr 12 '22 03:04 EC-Sol

Hey @EC-Sol 👋

Yeah, this is definitely something we should change to match the default notion behavior.

I think I had it this way because it's what I wanted for my blog 😂 but that should belong elsewhere.

transitive-bullshit avatar Apr 12 '22 13:04 transitive-bullshit