1
mirror of https://github.com/xitanggg/open-resume synced 2025-02-05 20:12:45 +01:00

Revert some changes and give scrollbar-thumb a default color

This commit is contained in:
Xitang 2024-10-29 00:17:23 -07:00 committed by Xitang Zhao
parent c6c5302e61
commit 1699cddea0
2 changed files with 9 additions and 8 deletions

View File

@ -1,4 +1,5 @@
"use client"; "use client";
import { useState } from "react";
import { import {
useAppSelector, useAppSelector,
useSaveStateToLocalStorageOnChange, useSaveStateToLocalStorageOnChange,
@ -28,17 +29,17 @@ export const ResumeForm = () => {
useSaveStateToLocalStorageOnChange(); useSaveStateToLocalStorageOnChange();
const formsOrder = useAppSelector(selectFormsOrder); const formsOrder = useAppSelector(selectFormsOrder);
const [isHover, setIsHover] = useState(false);
return ( return (
<div <div
className={cx( className={cx(
"flex justify-center md:h-[calc(100vh-var(--top-nav-bar-height))] md:justify-end md:overflow-y-scroll", "flex justify-center scrollbar-thin scrollbar-track-gray-100 scrollbar-thumb-gray-100 md:h-[calc(100vh-var(--top-nav-bar-height))] md:justify-end md:overflow-y-scroll",
"scrollbar-thumb-gray-200", isHover && "!scrollbar-thumb-gray-200"
)} )}
onMouseOver={() => setIsHover(true)}
onMouseLeave={() => setIsHover(false)}
> >
<div className="hidden md:block absolute top-0 bottom-0 right-0 w-3 bg-gray-100">
</div>
<section className="flex max-w-2xl flex-col gap-8 p-[var(--resume-padding)]"> <section className="flex max-w-2xl flex-col gap-8 p-[var(--resume-padding)]">
<ProfileForm /> <ProfileForm />
{formsOrder.map((form) => { {formsOrder.map((form) => {

View File

@ -9,7 +9,7 @@ export default function Create() {
<Provider store={store}> <Provider store={store}>
<main className="relative h-full w-full overflow-hidden bg-gray-50"> <main className="relative h-full w-full overflow-hidden bg-gray-50">
<div className="grid grid-cols-3 md:grid-cols-6"> <div className="grid grid-cols-3 md:grid-cols-6">
<div className="col-span-3 relative"> <div className="col-span-3">
<ResumeForm /> <ResumeForm />
</div> </div>
<div className="col-span-3"> <div className="col-span-3">