Skip to content

Instantly share code, notes, and snippets.

Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save joshuaanderton/ed64ab518075adb6c469baba80ecd957 to your computer and use it in GitHub Desktop.
Save joshuaanderton/ed64ab518075adb6c469baba80ecd957 to your computer and use it in GitHub Desktop.
Potion Theme - 50x50 Portfolio
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital@0;1&display=swap" rel="stylesheet">
<style>
:root {
--bg-color: #ffffff;
--fg-color: #000;
}
.notion.notion-app {
font-family: "Playfair Display", -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, 'Apple Color Emoji', Arial, sans-serif, 'Segoe UI Emoji', 'Segoe UI Symbol';
}
.inset-y-0.left-0 {
z-index: 100;
}
.notion-frame {
padding-top: 0 !important;
}
.notion-page {
width: 720px;
}
.notion {
font-size: 16px;
}
.notion-header {
display: none !important;
}
.notion-page-icon-wrapper {
position: relative;
}
.notion-page-icon-wrapper img.notion-page-icon {
max-width: 4.5rem;
height: auto;
}
.notion-title {
padding-top: 6rem;
line-height: 1.8;
font-style: italic;
}
@media (min-width: 900px) {
.notion-page-cover {
width: 40%;
right: 0;
max-height: 100%;
}
.notion-page {
left: 0;
overflow: auto !important;
width: 100%;
padding-left: 40px;
padding-right: calc(40% + 60px);
}
.notion-page-scroller {
width: 100%;
}
.notion-page-cover,
.notion-page {
position: fixed;
top: 0;
height: 100%;
}
}
@media (min-width: 1200px) {
.notion-page-cover {
width: 50%;
}
.notion-page {
padding-right: calc(50% + 60px);
}
}
</style>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment