Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Custom Scrollbar styling #77

Open
JaeYeopHan opened this issue May 11, 2021 · 0 comments
Open

Custom Scrollbar styling #77

JaeYeopHan opened this issue May 11, 2021 · 0 comments
Labels
related:css Related css type: material For sources

Comments

@JaeYeopHan
Copy link
Owner

const 스크롤바_배경_색상 = '#fafafa';
const 스크롤바_기본_색상 = '#c1c1c1';
const 스크롤바_액티브_색상 = '#7d7d7d';

export const customScrollbarStyles = css`
  ::-webkit-scrollbar {
    width: 16px;
  }
  ::-webkit-scrollbar-track {
    background-color: ${스크롤바_배경_색상};
  }
  ::-webkit-scrollbar-thumb {
    background-color: ${스크롤바_기본_색상};
    border: 3px solid ${스크롤바_배경_색상}; /* NOTE: padding 효과를 주기위해 track과 같은 color로 border를 지정 */
    border-radius: 8px;
  }
  ::-webkit-scrollbar-thumb:hover {
    background-color: ${스크롤바_액티브_색상};
  }
`;
@JaeYeopHan JaeYeopHan added related:css Related css type: material For sources labels May 15, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
related:css Related css type: material For sources
Projects
None yet
Development

No branches or pull requests

1 participant