fix: follow figma design

This commit is contained in:
Lucas Smith
2024-02-25 13:02:09 +00:00
parent 7ef771533a
commit 5bef2fba91
4 changed files with 17 additions and 8 deletions

View File

@ -45,6 +45,11 @@ module.exports = {
DEFAULT: 'hsl(var(--card))',
foreground: 'hsl(var(--card-foreground))',
},
'field-card': {
DEFAULT: 'hsl(var(--field-card))',
border: 'hsl(var(--field-card-border))',
foreground: 'hsl(var(--field-card-foreground))',
},
widget: {
DEFAULT: 'hsl(var(--widget))',
// foreground: 'hsl(var(--widget-foreground))',

View File

@ -316,9 +316,9 @@ export const AddFieldsFormPartial = ({
{selectedField && (
<Card
className={cn(
'bg-documenso pointer-events-none fixed z-50 cursor-pointer border-2 bg-opacity-20 backdrop-blur-[1.2px]',
'bg-field-card/80 pointer-events-none fixed z-50 cursor-pointer border-2 backdrop-blur-[1px]',
{
'border-primary': isFieldWithinBounds,
'border-field-card-border': isFieldWithinBounds,
'opacity-50': !isFieldWithinBounds,
},
)}
@ -329,7 +329,7 @@ export const AddFieldsFormPartial = ({
width: fieldBounds.current.width,
}}
>
<CardContent className="text-foreground flex h-full w-full items-center justify-center p-2">
<CardContent className="text-field-card-foreground flex h-full w-full items-center justify-center p-2">
{FRIENDLY_FIELD_TYPE[selectedField]}
</CardContent>
</Card>

View File

@ -128,16 +128,16 @@ export const FieldItem = ({
)}
<Card
className={cn('bg-documenso h-full w-full bg-opacity-20 backdrop-blur-[1.2px]', {
'border-primary': !disabled,
'border-primary/80': active,
className={cn('bg-field-card/80 h-full w-full backdrop-blur-[1px]', {
'border-field-card-border': !disabled,
'border-field-card-border/80': active,
})}
>
<CardContent
className={cn(
'text-foreground flex h-full w-full flex-col items-center justify-center p-2',
'text-field-card-foreground flex h-full w-full flex-col items-center justify-center p-2',
{
'text-muted-foreground/50': disabled,
'text-field-card-foreground/50': disabled,
},
)}
>

View File

@ -18,6 +18,10 @@
--card-border-tint: 112 205 159;
--card-foreground: 222.2 47.4% 11.2%;
--field-card: 95 74% 90%;
--field-card-border: 95.08 71.08% 67.45%;
--field-card-foreground: 222.2 47.4% 11.2%;
--widget: 0 0% 97%;
--border: 214.3 31.8% 91.4%;