From b971194de5c5d968e3e25206c333afa62a3a8db6 Mon Sep 17 00:00:00 2001 From: fero Date: Mon, 11 Mar 2024 08:29:52 -0700 Subject: [PATCH] style: add button hover styles --- src/app.pcss | 23 ++++++++++++++++++++--- 1 file changed, 20 insertions(+), 3 deletions(-) diff --git a/src/app.pcss b/src/app.pcss index 58cef9c..565363a 100644 --- a/src/app.pcss +++ b/src/app.pcss @@ -29,19 +29,36 @@ h3 { font-family: "Roc Grotesk", sans-serif; } +::selection { + background: #eee; + color: #000; +} + .cta-button { background: linear-gradient(0deg, rgba(0, 0, 0, 0.06), rgba(0, 0, 0, 0.06)), radial-gradient(109.26% 109.26% at 49.83% 13.37%, #ffffff 0%, #babaca 100%); color: black; - @apply flex w-fit shrink-0 select-none flex-row items-center justify-center gap-4 rounded-xl py-3 pl-7 pr-5 font-bold; + @apply flex w-fit shrink-0 select-none flex-row items-center justify-center gap-4 rounded-xl py-3 pl-7 pr-5 font-bold transition; } .button { border: 2px solid #46424d; - @apply flex w-fit shrink-0 select-none flex-row items-center justify-center gap-4 rounded-xl py-3 pl-7 pr-5 font-bold; + @apply flex w-fit shrink-0 select-none flex-row items-center justify-center gap-4 rounded-xl py-3 pl-7 pr-5 font-bold transition; +} + +.button:hover { + border: 2px solid transparent; + background: #c3c3cd; + color: black; } .button-sm { border: 2px solid #46424d; - @apply flex w-fit shrink-0 select-none flex-row items-center justify-center gap-4 rounded-xl px-4 py-2 text-sm font-bold; + @apply flex w-fit shrink-0 select-none flex-row items-center justify-center gap-4 rounded-xl px-4 py-2 text-sm font-bold transition; +} + +.button-sm:hover { + border: 2px solid transparent; + background: #c3c3cd; + color: black; }