From 78c18b918eb33c3c48b07a13030e879c04eb5aa5 Mon Sep 17 00:00:00 2001
From: sphinxrave <62570796+sphinxrave@users.noreply.github.com>
Date: Mon, 16 Oct 2023 19:50:01 -0700
Subject: [PATCH] add press effect to button active, sidebar fix

---
 packages/react/src/components/channel/ChannelCard.tsx |  2 +-
 packages/react/src/components/sidebar/sidebar.tsx     |  3 ++-
 packages/react/src/shadcn/ui/button.tsx               | 10 +++++-----
 3 files changed, 8 insertions(+), 7 deletions(-)

diff --git a/packages/react/src/components/channel/ChannelCard.tsx b/packages/react/src/components/channel/ChannelCard.tsx
index 24825939c..21b2ac4f4 100644
--- a/packages/react/src/components/channel/ChannelCard.tsx
+++ b/packages/react/src/components/channel/ChannelCard.tsx
@@ -29,7 +29,7 @@ export function ChannelCard({
     // Set min-height because react-virtuoso will break if the height is not fixed
     <div className="flex h-full min-h-[24rem] w-full flex-col items-center gap-2 rounded-md bg-base-3 p-4">
       <img className="h-24 w-24 rounded-full" src={photo ?? ""} />
-      <div className="font-xl line-clamp-2 text-center font-bold">{name}</div>
+      <div className="line-clamp-2 text-center text-lg font-bold">{name}</div>
       <div className="flex flex-col items-center">
         <div className="whitespace-nowrap text-sm text-base-11">
           {formatCount(subscriber_count ?? 0)} subscribers
diff --git a/packages/react/src/components/sidebar/sidebar.tsx b/packages/react/src/components/sidebar/sidebar.tsx
index 20d050df2..b85fb75b6 100644
--- a/packages/react/src/components/sidebar/sidebar.tsx
+++ b/packages/react/src/components/sidebar/sidebar.tsx
@@ -167,8 +167,9 @@ function SidebarItem({
       asChild
       className={cn(
         "w-full justify-start",
-        { "text-white": isHere },
         className,
+        { "text-base-12 font-semibold": isHere },
+        { 'font-base-11 font-light': !isHere },
       )}
       variant={isHere ? "default" : "ghost"}
       onClick={isMobile ? onClose : undefined}
diff --git a/packages/react/src/shadcn/ui/button.tsx b/packages/react/src/shadcn/ui/button.tsx
index 262109e9d..03e4f9da2 100644
--- a/packages/react/src/shadcn/ui/button.tsx
+++ b/packages/react/src/shadcn/ui/button.tsx
@@ -1,21 +1,21 @@
 import * as React from "react"
 import { Slot } from "@radix-ui/react-slot"
 import { cva, type VariantProps } from "class-variance-authority"
-
+// import './button.css'
 import { cn } from "@/lib/utils"
 
 const buttonVariants = cva(
-  "inline-flex items-center justify-center rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 disabled:pointer-events-none disabled:opacity-50",
+  "inline-flex items-center justify-center rounded-md text-sm font-medium transition focus-visible:outline-none focus-visible:ring-1 active:scale-[97%] disabled:pointer-events-none disabled:opacity-50",
   {
     variants: {
       variant: {
         default:
-          "bg-primary-9 text-base-12 hover:bg-primaryA-4 focus-visible:ring-primary-7",
+          "bg-primary-9 text-base-12 hover:bg-primaryA-5 focus-visible:ring-primary-7 active:bg-primaryA-7",
         outline:
-          "border border-primary-7 bg-transparent hover:border-primaryA-8 hover:bg-primaryA-4 focus-visible:ring-primary-7",
+          "border border-primary-7 bg-transparent hover:border-primaryA-8 hover:bg-primaryA-5 focus-visible:ring-primary-7",
         secondary:
           "bg-secondary-9 text-base-12 hover:bg-secondaryA-4 focus-visible:ring-secondary-7 ",
-        ghost: "hover:bg-primary-4 hover:text-base-12 focus-visible:ring-primary-7",
+        ghost: "hover:bg-primary-4 hover:text-base-12 focus-visible:ring-primary-7 active:bg-primaryA-7",
         link: "text-primary underline-offset-4 hover:underline focus-visible:underline focus-visible:ring-secondary-7",
       },
       size: {