Ryan/documenso
1
0
Fork 1
mirror of https://github.com/documenso/documenso.git synced 2025-11-13 16:23:06 +10:00
Code Issues Packages Projects Releases Wiki Activity

feat: modify periods menu horizontal alignment on mobile

Browse Source
This commit is contained in:
Juan Sebastián Mendoza
2024-03-24 19:07:26 -05:00
parent 48ee977617
commit 24852f3c68
1 changed files with 3 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
apps/marketing/src/components/(marketing)/pricing-table.tsx
View File

@ -23,7 +23,7 @@ export const PricingTable = ({ className, ...props }: PricingTableProps) => {
return ( return (
<div className={cn('', className)} {...props}> <div className={cn('', className)} {...props}>
<div className="bg-background sticky top-32 flex items-center justify-center gap-x-6 shadow-[-1px_-5px_2px_6px_hsl(var(--background))] md:top-[7.5rem] lg:static"> <div className="bg-background sticky top-32 flex items-center justify-end gap-x-6 shadow-[-1px_-5px_2px_6px_hsl(var(--background))] md:top-[7.5rem] lg:static lg:justify-center">
<AnimatePresence> <AnimatePresence>
<motion.button <motion.button
key="MONTHLY" key="MONTHLY"
@ -40,7 +40,7 @@ export const PricingTable = ({ className, ...props }: PricingTableProps) => {
{period === 'MONTHLY' && ( {period === 'MONTHLY' && (
<motion.div <motion.div
layoutId={SELECTED_PLAN_BAR_LAYOUT_ID} layoutId={SELECTED_PLAN_BAR_LAYOUT_ID}
className="bg-primary absolute bottom-0 left-0 h-[3px] w-full rounded-full" className="bg-foreground lg:bg-primary absolute bottom-0 left-0 h-[3px] w-full rounded-full"
/> />
)} )}
</motion.button> </motion.button>
@ -63,7 +63,7 @@ export const PricingTable = ({ className, ...props }: PricingTableProps) => {
{period === 'YEARLY' && ( {period === 'YEARLY' && (
<motion.div <motion.div
layoutId={SELECTED_PLAN_BAR_LAYOUT_ID} layoutId={SELECTED_PLAN_BAR_LAYOUT_ID}
className="bg-primary absolute bottom-0 left-0 h-[3px] w-full rounded-full" className="bg-foreground lg:bg-primary absolute bottom-0 left-0 h-[3px] w-full rounded-full"
/> />
)} )}
</motion.button> </motion.button>