Mike/freno-dev
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

simpler

Browse Source
This commit is contained in:
Michael Freno
2026-02-09 01:01:26 -05:00
parent 80daaa29dc
commit ef2968707e
2 changed files with 8 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
src/app.tsx
View File

@@ -160,10 +160,10 @@ function AppLayout(props: { children: any }) {
<LeftBar /> <LeftBar />
<div <div
id="center-body" id="center-body"
class="bg-base relative h-screen w-screen overflow-x-hidden md:ml-62.5 md:w-[calc(100vw-500px)] 2xl:ml-72 2xl:w-[calc(100vw-576px)]" class="bg-base relative h-screen w-screen overflow-x-hidden md:ml-62.5 md:w-[calc(100vw-500px)]"
> >
<noscript> <noscript>
<div class="bg-yellow text-crust border-text fixed top-0 z-150 border-b-2 p-4 text-center font-semibold md:w-[calc(100vw-500px)] xl:ml-72 xl:w-[calc(100vw-576px)]"> <div class="bg-yellow text-crust border-text fixed top-0 z-150 border-b-2 p-4 text-center font-semibold md:w-[calc(100vw-500px)]">
JavaScript is disabled. Features will be limited. JavaScript is disabled. Features will be limited.
</div> </div>
</noscript> </noscript>
@@ -180,7 +180,7 @@ function AppLayout(props: { children: any }) {
<CustomScrollbar <CustomScrollbar
autoHide={true} autoHide={true}
autoHideDelay={1500} autoHideDelay={1500}
rightOffset={250} rightOffset={window.innerWidth < 1536 ? 250 : 288}
> >
{props.children} {props.children}
</CustomScrollbar> </CustomScrollbar>

11
src/components/Bars.tsx
View File

@@ -233,7 +233,7 @@ export function LeftBar() {
const handleLinkClick = () => { const handleLinkClick = () => {
if ( if (
typeof window !== "undefined" && typeof window !== "undefined" &&
window.innerWidth < BREAKPOINTS.MOBILE window.innerWidth < BREAKPOINTS.MOBILE_MAX_WIDTH
) { ) {
setLeftBarVisible(false); setLeftBarVisible(false);
} }
@@ -301,7 +301,7 @@ export function LeftBar() {
if (ref) { if (ref) {
const handleKeyDown = (e: KeyboardEvent) => { const handleKeyDown = (e: KeyboardEvent) => {
const isMobile = window.innerWidth < BREAKPOINTS.MOBILE; const isMobile = window.innerWidth < BREAKPOINTS.MOBILE_MAX_WIDTH;
if (!isMobile || !leftBarVisible()) return; if (!isMobile || !leftBarVisible()) return;
@@ -366,7 +366,7 @@ export function LeftBar() {
const getMainNavStyles = () => { const getMainNavStyles = () => {
const baseStyles = { const baseStyles = {
"transition-timing-function": "cubic-bezier(0.4, 0, 0.2, 1)", "transition-timing-function": "cubic-bezier(0.4, 0, 0.2, 1)",
width: windowWidth() < 1536 ? "250px" : "288px", width: "250px",
"padding-top": "env(safe-area-inset-top)", "padding-top": "env(safe-area-inset-top)",
"padding-bottom": "env(safe-area-inset-bottom)" "padding-bottom": "env(safe-area-inset-bottom)"
}; };
@@ -456,7 +456,7 @@ export function LeftBar() {
<a <a
href={`/blog/${post.title}`} href={`/blog/${post.title}`}
onClick={handleLinkClick} onClick={handleLinkClick}
class="hover:text-subtext0 block w-52 transition-transform duration-200 ease-in-out hover:-translate-y-0.5 hover:scale-105 hover:font-bold" class="hover:text-subtext0 block w-fit transition-transform duration-200 ease-in-out hover:-translate-y-0.5 hover:scale-105 hover:font-bold"
> >
<Typewriter class="flex flex-col" keepAlive={false}> <Typewriter class="flex flex-col" keepAlive={false}>
<div class="relative overflow-hidden"> <div class="relative overflow-hidden">
@@ -607,14 +607,13 @@ export function RightBar() {
<aside <aside
ref={ref} ref={ref}
aria-label="Links and activity" aria-label="Links and activity"
class="border-l-overlay2 bg-base fixed right-0 z-50 hidden h-dvh w-fit border-l-2 transition-transform duration-500 ease-out md:block" class="border-l-overlay2 bg-base fixed right-0 z-50 hidden h-dvh w-62.5 border-l-2 transition-transform duration-500 ease-out md:block"
classList={{ classList={{
"translate-x-full": !rightBarVisible(), "translate-x-full": !rightBarVisible(),
"translate-x-0": rightBarVisible() "translate-x-0": rightBarVisible()
}} }}
style={{ style={{
"transition-timing-function": "cubic-bezier(0.4, 0, 0.2, 1)", "transition-timing-function": "cubic-bezier(0.4, 0, 0.2, 1)",
width: "250px",
"box-shadow": "inset 6px 0 16px -6px rgba(0, 0, 0, 0.1)", "box-shadow": "inset 6px 0 16px -6px rgba(0, 0, 0, 0.1)",
"padding-top": "env(safe-area-inset-top)", "padding-top": "env(safe-area-inset-top)",
"padding-bottom": "env(safe-area-inset-bottom)", "padding-bottom": "env(safe-area-inset-bottom)",