Skip to content

Commit 4bdd057

Browse files
sanjaypinnasanjaypinna
committed
update footer and add secondary color
1 parent 1fda73a commit 4bdd057

File tree

4 files changed

+55
-69
lines changed

4 files changed

+55
-69
lines changed

‎app/[locale]/dashboard/components/main-footer.tsx‎

Lines changed: 44 additions & 60 deletions
Original file line numberDiff line numberDiff line change
@@ -4,80 +4,64 @@ import Link from 'next/link';
44
import { Icon, Text } from 'opub-ui';
55

66
import { Icons } from '@/components/icons';
7+
import { IconBinary, IconBinaryTree } from '@tabler/icons-react';
78

89
const MainFooter = () => {
910
return (
1011
<>
11-
<div
12-
style={{
13-
backgroundColor: 'var( --background-alpha-medium)',
14-
}}
15-
>
16-
<div className="flex flex-wrap items-center justify-start gap-8 p-10 md:justify-center lg:justify-center lg:gap-32 ">
17-
<div className="flex items-center gap-8 ">
18-
<Link href="/">
19-
<div className="flex items-center gap-2">
20-
<Icon source={Icons.logo} size={24} color="success" />
12+
<div className="bg-primaryBlue">
13+
<div className="flex flex-col gap-8 p-6 lg:px-28 lg:py-10">
14+
<div className="flex flex-wrap justify-between gap-8 ">
15+
{' '}
16+
<div className="flex items-center gap-2">
17+
<Image src={'/logo.png'} width={38} height={38} alt="logo" />
18+
<Text variant="headingXl" className="text-surfaceDefault" as="h1">
19+
CivicDataSpace
20+
</Text>
21+
</div>
22+
<div className=" flex flex-col lg:items-end gap-2">
23+
<div>
24+
{' '}
2125
<Text
22-
variant="headingLg"
23-
className="text-surfaceDefault"
24-
as="h1"
26+
color="highlight"
27+
className=" font-bold text-borderWarningSubdued"
2528
>
26-
CivicDataSpace
29+
Follow Us
2730
</Text>
2831
</div>
29-
</Link>
30-
<div>
31-
<Link href={'https://civicdatalab.in'} target="_blank">
32-
<Image src={'/cdl.svg'} width={96} alt={'cdl'} height={94} />
33-
</Link>{' '}
32+
33+
<div className=" flex gap-3">
34+
<div className=" h-10 w-10 rounded-5 bg-secondaryOrange p-2">
35+
<Icon source={Icons.twitter} size={24} color="onBgDefault" />
36+
</div>
37+
<div className=" h-10 w-10 rounded-5 bg-secondaryOrange p-2">
38+
<Icon source={Icons.linkedin} size={24} color="onBgDefault" />
39+
</div>
40+
<div className=" h-10 w-10 rounded-5 bg-secondaryOrange p-2">
41+
<Icon source={Icons.facebook} size={24} color="onBgDefault" />
42+
</div>
43+
<div className=" h-10 w-10 rounded-5 bg-secondaryOrange p-2">
44+
<Icon source={Icons.github} size={24} color="onBgDefault" />
45+
</div>
46+
</div>
3447
</div>
3548
</div>
36-
<div className=" flex gap-6">
37-
<Link href={'#'} className=" text-baseIndigoSolid2">
38-
About Us
39-
</Link>
40-
<Link href={'#'} className=" text-baseIndigoSolid2">
41-
Sitemap
42-
</Link>
43-
<Link href={'#'} className=" text-baseIndigoSolid2">
44-
Contact Us
45-
</Link>
46-
</div>
47-
<div className=" flex flex-col gap-2">
48-
<Text
49-
color="highlight"
50-
className=" font-bold text-borderWarningSubdued"
51-
>
52-
Follow Us
53-
</Text>
54-
<div className=" flex gap-3">
55-
<div className=" h-10 w-10 rounded-5 bg-baseBlueSolid8 p-2">
56-
<Icon source={Icons.twitter} size={24} color="onBgDefault" />
57-
</div>
58-
<div className=" h-10 w-10 rounded-5 bg-baseBlueSolid8 p-2">
59-
<Icon source={Icons.linkedin} size={24} color="onBgDefault" />
60-
</div>
61-
<div className=" h-10 w-10 rounded-5 bg-baseBlueSolid8 p-2">
62-
<Icon source={Icons.facebook} size={24} color="onBgDefault" />
63-
</div>
64-
<div className=" h-10 w-10 rounded-5 bg-baseBlueSolid8 p-2">
65-
<Icon source={Icons.github} size={24} color="onBgDefault" />
66-
</div>
49+
<div className=" flex justify-between flex-wrap">
50+
<div className=" flex gap-6">
51+
<Link href={'#'}>
52+
<Text color="onBgDefault"> About Us</Text>
53+
</Link>
54+
<Link href={'#'}>
55+
<Text color="onBgDefault"> Sitemap</Text>
56+
</Link>
57+
<Link href={'#'}>
58+
<Text color="onBgDefault"> Contact Us</Text>
59+
</Link>
6760
</div>
61+
6862
</div>
6963
</div>
7064
</div>
71-
<div className=" bg-baseBlueSolid6 p-2">
72-
<div className=" m-auto flex items-center gap-2 md:pl-4 lg:w-5/6 lg:pl-8">
73-
<Icon source={Icons.info} size={24} />
74-
75-
<Text variant="bodyMd">
76-
This Platform is designed, developed and hosted by CivicDataLab for
77-
Data Exchange
78-
</Text>
79-
</div>
80-
</div>
8165
</>
8266
);
8367
};

‎components/icons.tsx‎

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -5,10 +5,11 @@ import {
55
IconArrowsDiagonal,
66
IconBarrierBlock,
77
IconBellFilled,
8-
IconBrandFacebookFilled,
9-
IconBrandGithubFilled,
8+
IconBrandFacebook,
9+
IconBrandGithub,
1010
IconBrandLinkedin,
11-
IconBrandTwitterFilled,
11+
IconBrandTwitter,
12+
IconChartBar,
1213
IconCheck,
1314
IconCircleCheckFilled,
1415
IconCloudUpload,
@@ -40,7 +41,6 @@ import {
4041
IconUserCog,
4142
IconUsers,
4243
IconX,
43-
IconChartBar
4444
// TablerIconsProps,
4545
} from '@tabler/icons-react';
4646

@@ -65,9 +65,9 @@ export const Icons: {
6565
dropzone: IconCloudUpload,
6666
errorPage: IconDatabaseOff,
6767
expand: IconLayoutSidebarLeftExpand,
68-
facebook: IconBrandFacebookFilled,
68+
facebook: IconBrandFacebook,
6969
fileUpload: IconFileUpload,
70-
github: IconBrandGithubFilled,
70+
github: IconBrandGithub,
7171
info: IconInfoCircle,
7272
link: IconLink,
7373
linkedin: IconBrandLinkedin,
@@ -82,12 +82,12 @@ export const Icons: {
8282
search: IconSearch,
8383
share: IconShare3,
8484
terminal: IconTerminal,
85-
twitter: IconBrandTwitterFilled,
85+
twitter: IconBrandTwitter,
8686
checkmark: IconCheck,
8787
loader: IconLoader,
8888
userList: IconUsers,
8989
userSettings: IconUserCog,
9090
arrowDiagonal: IconArrowsDiagonal,
9191
verticalDots: IconDotsVertical,
92-
chart:IconChartBar
92+
chart: IconChartBar,
9393
};

‎styles/tokens/_variables.css‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -86,6 +86,7 @@
8686
--base-pure-white: #ffffff;
8787
--base-pure-black: #000000;
8888
--blue-primary-color: #22699D;
89+
--orange-secondary-color:#FDB557;
8990
--text-default: var(--base-gray-slate-solid-12);
9091
--text-medium: var(--base-gray-slate-solid-11);
9192
--text-subdued: #3e4346;

‎styles/tokens/tailwind/color.js‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -273,5 +273,6 @@ module.exports = {
273273
borderFocus: '#FFFFFF03',
274274
transparent: '#FFFFFF00',
275275
borderOnBGSubdued: 'var(--base-gray-slate-solid-11)',
276-
primaryBlue: 'var(--blue-primary-color)'
276+
primaryBlue: 'var(--blue-primary-color)',
277+
secondaryOrange: 'var(--orange-secondary-color)'
277278
};

0 commit comments

Comments
 (0)