Skip to content

Commit 88e4810

Browse files
bassgetaMantisClone
bassgeta
and
MantisClone
authored
fix: foregrounds and backgrounds for our color variants (#162)
Co-authored-by: MantisClone <david.huntmateo@request.network>
1 parent 768be24 commit 88e4810

7 files changed

Lines changed: 87 additions & 62 deletions

File tree

‎package-lock.json‎

Lines changed: 2 additions & 2 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
{
22
"name": "easy-invoice",
33
"description": "A Request Network demo app for easy invoice creation using Request API",
4-
"version": "0.11.0",
4+
"version": "0.12.1",
55
"license": "MIT",
66
"scripts": {
77
"dev": "chmod +x dev/dev-startup.sh && ./dev/dev-startup.sh ",

‎src/app/globals.css‎

Lines changed: 11 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
--foreground: 0 0% 3.9%;
88
--card: 0 0% 100%;
99
--card-foreground: 0 0% 3.9%;
10-
--popover: 0 0% 98%;
10+
--popover: 0 0% 100%;
1111
--popover-foreground: 0 0% 3.9%;
1212
--primary: 0 0% 9%;
1313
--primary-foreground: 0 0% 98%;
@@ -18,7 +18,11 @@
1818
--accent: 0 0% 96.1%;
1919
--accent-foreground: 0 0% 9%;
2020
--destructive: 0 84.2% 60.2%;
21-
--destructive-foreground: 0 0% 98%;
21+
--destructive-foreground: 0 84% 15%;
22+
--success: 142 69% 58%;
23+
--success-foreground: 142 84% 15%;
24+
--warning: 38 92% 50%;
25+
--warning-foreground: 25 95% 15%;
2226
--border: 0 0% 89.8%;
2327
--input: 0 0% 89.8%;
2428
--ring: 0 0% 3.9%;
@@ -45,7 +49,11 @@
4549
--accent: 0 0% 14.9%;
4650
--accent-foreground: 0 0% 98%;
4751
--destructive: 0 62.8% 30.6%;
48-
--destructive-foreground: 0 0% 98%;
52+
--destructive-foreground: 0 84% 85%;
53+
--success: 142 84% 15%;
54+
--success-foreground: 142 69% 85%;
55+
--warning: 25 95% 15%;
56+
--warning-foreground: 38 92% 85%;
4957
--border: 0 0% 14.9%;
5058
--input: 0 0% 14.9%;
5159
--ring: 0 0% 83.1%;

‎src/components/ecommerce/manage/blocks/clients-table.tsx‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -59,7 +59,10 @@ const EcommerceClientRow = ({
5959
<TableCell className="font-medium">{ecommerceClient.label}</TableCell>
6060
<TableCell>{ecommerceClient.domain}</TableCell>
6161
<TableCell>
62-
<ShortAddress address={ecommerceClient.rnClientId} />
62+
<ShortAddress
63+
copyContent="Copy RN Client ID"
64+
address={ecommerceClient.rnClientId}
65+
/>
6366
</TableCell>
6467
<TableCell>
6568
{ecommerceClient.feeAddress ? (

‎src/components/ecommerce/manage/blocks/delete-client.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -57,7 +57,7 @@ export function DeleteEcommerceClient({
5757
Are you sure you want to delete the client "
5858
{ecommerceClient.label}"?
5959
</p>
60-
<p className="font-medium text-red-600">
60+
<p className="font-medium text-destructive-foreground">
6161
⚠️ This action cannot be undone. The client will be permanently
6262
removed and any integrations using its ID will stop working.
6363
</p>
@@ -70,7 +70,7 @@ export function DeleteEcommerceClient({
7070
<AlertDialogAction
7171
onClick={handleDeleteEcommerceClient}
7272
disabled={isDeletingEcommerceClient}
73-
className="bg-red-600 hover:bg-red-700"
73+
className="bg-destructive text-destructive-foreground hover:bg-destructive/90"
7474
>
7575
{isDeletingEcommerceClient ? "Deleting..." : "Delete Client ID"}
7676
</AlertDialogAction>

‎src/components/short-address.tsx‎

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,14 +2,20 @@
22

33
import { Tooltip } from "@/components/ui/tooltip";
44
import { Copy } from "lucide-react";
5+
import type { ReactNode } from "react";
56
import { toast } from "sonner";
67

78
interface ShortAddressProps {
89
address: string;
910
className?: string;
11+
copyContent?: ReactNode;
1012
}
1113

12-
export function ShortAddress({ address, className = "" }: ShortAddressProps) {
14+
export function ShortAddress({
15+
address,
16+
className = "",
17+
copyContent = "Copy Address",
18+
}: ShortAddressProps) {
1319
const shortAddress = `${address.substring(0, 6)}...${address.substring(
1420
address.length - 4,
1521
)}`;
@@ -31,7 +37,7 @@ export function ShortAddress({ address, className = "" }: ShortAddressProps) {
3137
<Copy className="h-3 w-3" />
3238
</button>
3339
}
34-
tooltipContent={<span>Copy address</span>}
40+
tooltipContent={<span>{copyContent}</span>}
3541
/>
3642
);
3743
}

‎tailwind.config.ts‎

Lines changed: 59 additions & 51 deletions
Original file line numberDiff line numberDiff line change
@@ -1,62 +1,70 @@
11
import type { Config } from "tailwindcss";
22

33
const config: Config = {
4-
darkMode: ["class"],
5-
content: [
4+
darkMode: ["class"],
5+
content: [
66
"./src/pages/**/*.{js,ts,jsx,tsx,mdx}",
77
"./src/components/**/*.{js,ts,jsx,tsx,mdx}",
88
"./src/app/**/*.{js,ts,jsx,tsx,mdx}",
99
],
1010
theme: {
11-
extend: {
12-
colors: {
13-
background: 'hsl(var(--background))',
14-
foreground: 'hsl(var(--foreground))',
15-
card: {
16-
DEFAULT: 'hsl(var(--card))',
17-
foreground: 'hsl(var(--card-foreground))'
18-
},
19-
popover: {
20-
DEFAULT: 'hsl(var(--popover))',
21-
foreground: 'hsl(var(--popover-foreground))'
22-
},
23-
primary: {
24-
DEFAULT: 'hsl(var(--primary))',
25-
foreground: 'hsl(var(--primary-foreground))'
26-
},
27-
secondary: {
28-
DEFAULT: 'hsl(var(--secondary))',
29-
foreground: 'hsl(var(--secondary-foreground))'
30-
},
31-
muted: {
32-
DEFAULT: 'hsl(var(--muted))',
33-
foreground: 'hsl(var(--muted-foreground))'
34-
},
35-
accent: {
36-
DEFAULT: 'hsl(var(--accent))',
37-
foreground: 'hsl(var(--accent-foreground))'
38-
},
39-
destructive: {
40-
DEFAULT: 'hsl(var(--destructive))',
41-
foreground: 'hsl(var(--destructive-foreground))'
42-
},
43-
border: 'hsl(var(--border))',
44-
input: 'hsl(var(--input))',
45-
ring: 'hsl(var(--ring))',
46-
chart: {
47-
'1': 'hsl(var(--chart-1))',
48-
'2': 'hsl(var(--chart-2))',
49-
'3': 'hsl(var(--chart-3))',
50-
'4': 'hsl(var(--chart-4))',
51-
'5': 'hsl(var(--chart-5))'
52-
}
53-
},
54-
borderRadius: {
55-
lg: 'var(--radius)',
56-
md: 'calc(var(--radius) - 2px)',
57-
sm: 'calc(var(--radius) - 4px)'
58-
}
59-
}
11+
extend: {
12+
colors: {
13+
background: "hsl(var(--background))",
14+
foreground: "hsl(var(--foreground))",
15+
card: {
16+
DEFAULT: "hsl(var(--card))",
17+
foreground: "hsl(var(--card-foreground))",
18+
},
19+
popover: {
20+
DEFAULT: "hsl(var(--popover))",
21+
foreground: "hsl(var(--popover-foreground))",
22+
},
23+
primary: {
24+
DEFAULT: "hsl(var(--primary))",
25+
foreground: "hsl(var(--primary-foreground))",
26+
},
27+
secondary: {
28+
DEFAULT: "hsl(var(--secondary))",
29+
foreground: "hsl(var(--secondary-foreground))",
30+
},
31+
muted: {
32+
DEFAULT: "hsl(var(--muted))",
33+
foreground: "hsl(var(--muted-foreground))",
34+
},
35+
accent: {
36+
DEFAULT: "hsl(var(--accent))",
37+
foreground: "hsl(var(--accent-foreground))",
38+
},
39+
destructive: {
40+
DEFAULT: "hsl(var(--destructive))",
41+
foreground: "hsl(var(--destructive-foreground))",
42+
},
43+
success: {
44+
DEFAULT: "hsl(var(--success))",
45+
foreground: "hsl(var(--success-foreground))",
46+
},
47+
warning: {
48+
DEFAULT: "hsl(var(--warning))",
49+
foreground: "hsl(var(--warning-foreground))",
50+
},
51+
border: "hsl(var(--border))",
52+
input: "hsl(var(--input))",
53+
ring: "hsl(var(--ring))",
54+
chart: {
55+
"1": "hsl(var(--chart-1))",
56+
"2": "hsl(var(--chart-2))",
57+
"3": "hsl(var(--chart-3))",
58+
"4": "hsl(var(--chart-4))",
59+
"5": "hsl(var(--chart-5))",
60+
},
61+
},
62+
borderRadius: {
63+
lg: "var(--radius)",
64+
md: "calc(var(--radius) - 2px)",
65+
sm: "calc(var(--radius) - 4px)",
66+
},
67+
},
6068
},
6169
plugins: [require("tailwindcss-animate")],
6270
};

0 commit comments

Comments
 (0)