lashman/openpylon
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 3 Wiki Activity

feat: typography overhaul, custom scrollbars, import/export, settings UI

Browse Source 
Includes changes from prior sessions: Epilogue + Space Mono fonts,
OverlayScrollbars integration, markdown editor fixes, settings dialog,
import/export buttons, and various UI refinements.
This commit is contained in:
Your Name
2026-02-16 14:56:36 +02:00
parent 8dedbf6032
commit 414c1f7d68
9 changed files with 343 additions and 205 deletions
Download Patch File Download Diff File Expand all files Collapse all files

58
src/index.css
View File

@@ -1,6 +1,7 @@
@import "tailwindcss";
@import "tw-animate-css";
@import "shadcn/tailwind.css";
@plugin "@tailwindcss/typography";
@custom-variant dark (&:is(.dark *));
@@ -51,8 +52,8 @@
--color-pylon-text-secondary: var(--pylon-text-secondary);
--color-pylon-danger: var(--pylon-danger);
--font-heading: "Instrument Serif", Georgia, serif;
--font-body: "Satoshi", system-ui, -apple-system, sans-serif;
--font-mono: "Geist Mono", "JetBrains Mono", "Fira Code", monospace;
--font-body: "Epilogue", system-ui, -apple-system, sans-serif;
--font-mono: "Space Mono", "Courier New", monospace;
}
:root {
@@ -149,41 +150,15 @@
scrollbar-color: oklch(80% 0 0 / 15%) transparent;
}
/* Custom scrollbar for Chromium/WebKit (Tauri WebView) */
/* Hide native scrollbars — OverlayScrollbars renders custom ones */
::-webkit-scrollbar {
width: 8px;
height: 8px;
}
::-webkit-scrollbar-track {
background: transparent;
}
::-webkit-scrollbar-thumb {
background: oklch(50% 0 0 / 20%);
border-radius: 9999px;
border: 2px solid transparent;
background-clip: content-box;
}
::-webkit-scrollbar-thumb:hover {
background: oklch(50% 0 0 / 35%);
border: 2px solid transparent;
background-clip: content-box;
}
::-webkit-scrollbar-corner {
background: transparent;
}
.dark ::-webkit-scrollbar-thumb {
background: oklch(80% 0 0 / 15%);
border: 2px solid transparent;
background-clip: content-box;
}
.dark ::-webkit-scrollbar-thumb:hover {
background: oklch(80% 0 0 / 30%);
border: 2px solid transparent;
background-clip: content-box;
width: 0;
height: 0;
display: none;
}
body {
@apply bg-background text-foreground;
font-family: "Satoshi", system-ui, -apple-system, sans-serif;
font-family: "Epilogue", system-ui, -apple-system, sans-serif;
}
:focus-visible {
outline: 2px solid var(--pylon-accent);
@@ -191,6 +166,23 @@
}
}
/* OverlayScrollbars custom theme */
.os-theme-pylon {
--os-handle-bg: oklch(50% 0 0 / 22%);
--os-handle-bg-hover: oklch(50% 0 0 / 40%);
--os-handle-bg-active: oklch(50% 0 0 / 55%);
--os-size: 8px;
--os-handle-border-radius: 9999px;
--os-padding-perpendicular: 2px;
--os-padding-axis: 2px;
--os-handle-min-size: 30px;
}
.dark .os-theme-pylon {
--os-handle-bg: oklch(80% 0 0 / 18%);
--os-handle-bg-hover: oklch(80% 0 0 / 35%);
--os-handle-bg-active: oklch(80% 0 0 / 50%);
}
@media (prefers-contrast: more) {
:root {
--pylon-text: oklch(10% 0.02 50);