From 1f240d51ffcc82bd357499ba81d92d9c817c302c Mon Sep 17 00:00:00 2001 From: Ethan Tam Date: Tue, 12 Nov 2024 19:22:16 -0800 Subject: [PATCH] fixed styling errors --- components/Filter/styles.ts | 4 ++-- components/FilterBar/styles.ts | 40 ---------------------------------- 2 files changed, 2 insertions(+), 42 deletions(-) diff --git a/components/Filter/styles.ts b/components/Filter/styles.ts index cf88953..054bbf1 100644 --- a/components/Filter/styles.ts +++ b/components/Filter/styles.ts @@ -2,7 +2,7 @@ import styled from 'styled-components'; import { FilterHeadingUnused } from '@/styles/texts'; export const FilterBackgroundStyles = styled.div<{ isActive: boolean }>` - margin-right: 2%; + margin-right: 0.375rem; top: 1.5%; right: 1.5%; background: linear-gradient( @@ -14,7 +14,7 @@ export const FilterBackgroundStyles = styled.div<{ isActive: boolean }>` padding: 0.35rem 0.35rem; z-index: 5; border: 0.05rem solid #fff; - margin-top: 1.5%; + margin-top: 0.75rem; max-height: ${({ isActive }) => (isActive ? 'auto' : '2rem')}; border-radius: ${({ isActive }) => (isActive ? '0.5rem' : '6.25rem')}; transition: height 0.5s ease-in-out; diff --git a/components/FilterBar/styles.ts b/components/FilterBar/styles.ts index 8617a7e..5ad68fe 100644 --- a/components/FilterBar/styles.ts +++ b/components/FilterBar/styles.ts @@ -9,43 +9,3 @@ export const FilterContainerStyles = styled.div` margin-right: 3rem; flex-wrap: wrap; `; - -export const FilterBackgroundStyles = styled.div<{ isActive: boolean }>` - margin-right: 0.375rem; - top: 1.5%; - right: 1.5%; - background: linear-gradient( - 180deg, - rgba(250, 250, 250, 0.32) 0%, - rgba(238, 238, 238, 0.65) 100% - ); - backdrop-filter: blur(7.5px); - padding: 0.35rem 0.35rem; - z-index: 5; - border: 0.05rem solid #fff; - margin-top: 0.75rem; - max-height: ${({ isActive }) => (isActive ? 'auto' : '2rem')}; - border-radius: ${({ isActive }) => (isActive ? '0.5rem' : '6.25rem')}; - transition: height 0.5s ease-in-out; -`; - -export const FilterButtonStyles = styled.button` - ${FilterHeadingUnused} - position: relative; - background: #fff; - border: none; - border-radius: 6.25rem; - cursor: pointer; - line-height: normal; - display: flex; - align-items: center; - gap: 0.75rem; - padding: 0.5rem 1rem; - color: rgba(46, 58, 89, 0.85); -`; - -export const IconStyle = styled.div` - align-self: center; - width: 0.8rem; - height: 0.8rem; -`;