Skip to content

Commit 268c21b

Browse files
failuresmithfailuresmith
committed
refactor(landing): design v2
1 parent 971f26c commit 268c21b

13 files changed

Lines changed: 301 additions & 198 deletions

File tree

‎app/globals.css‎

Lines changed: 1 addition & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -7,17 +7,10 @@
77
--foreground: #171717;
88
}
99

10-
/* @media (prefers-color-scheme: dark) {
11-
:root {
12-
--background: #0a0a0a;
13-
--foreground: #ededed;
14-
}
15-
} */
16-
1710
body {
1811
color: var(--foreground);
1912
background: var(--background);
20-
font-family: Arial, Helvetica, sans-serif;
13+
@apply text-black font-sans;
2114
}
2215

2316
@layer utilities {

‎app/layout.tsx‎

Lines changed: 72 additions & 60 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
1+
import React from "react";
12
import type { Metadata } from "next";
2-
import localFont from "next/font/local";
33
import "./globals.css";
44
import "@fortawesome/fontawesome-free/css/all.min.css";
55
import { Analytics } from "@vercel/analytics/react";
@@ -12,20 +12,10 @@ import { SmartContractProvider } from "@/context/SmartContractContext";
1212
import { BlockchainProvider } from "@/context/BlockchainProvider";
1313
import { LoggerProvider } from "@/context/LoggerContext";
1414
import Link from "next/link";
15-
const geistSans = localFont({
16-
src: "./fonts/GeistVF.woff",
17-
variable: "--font-geist-sans",
18-
weight: "100 900",
19-
});
20-
const geistMono = localFont({
21-
src: "./fonts/GeistMonoVF.woff",
22-
variable: "--font-geist-mono",
23-
weight: "100 900",
24-
});
2515

2616
export const metadata: Metadata = {
27-
title: "dTip",
28-
description: "Decentralized Tip",
17+
title: "dTip - Your ID-Fi Hub",
18+
description: 'The easiest way to share your finance addresses with no limits.',
2919
};
3020

3121
export default function RootLayout({
@@ -36,59 +26,81 @@ export default function RootLayout({
3626
return (
3727
<html lang="en">
3828
<body
39-
className={`${geistSans.variable} ${geistMono.variable} antialiased`}
29+
className={`min-h-screen flex flex-col`}
4030
>
41-
<Link
42-
href="/"
43-
className="flex text-center justify-center pt-8 text-2xl animate-pulse"
44-
>
45-
<strong>d</strong>
46-
<strong>T</strong>ip
47-
</Link>
31+
{/* Hero Section */}
32+
<header className="flex flex-col md:flex-row justify-between items-center pt-4 space-y-4 md:space-y-0 px-2">
33+
<Link href={"/"}>
34+
<div className="flex gap-1">
35+
<img src="/images/dtip_logo.png" width={24} height={24} />
36+
<h1 className="text-2xl font-bold ">dTip</h1>
37+
</div>
38+
</Link>
39+
<nav className="
40+
flex flex-wrap justify-center md:justify-end space-x-4 text-sm border-b
41+
md:border-none
42+
border-gray-300
43+
pb-2 md:pb-0
44+
">
45+
<React.Fragment key={0}>
46+
<Link href="https://dtip.gitbook.io/docs/" target="_blank" className="hover:underline">How it works</Link>
47+
<span className="hidden md:inline-block text-gray-400">|</span>
48+
</React.Fragment>
49+
<React.Fragment key={1}>
50+
<Link href="/start" className="hover:underline">Join</Link>
51+
</React.Fragment>
52+
</nav>
53+
</header>
54+
4855
<LoggerProvider>
4956
<BlockchainProvider>
5057
<GlobalStateProvider>
5158
<StepsProvider>
5259
<SmartContractProvider>
53-
<div className="h-screen flex flex-col justify-between">
54-
<div className="mx-4 my-4">{children}</div>
55-
{/* Footer */}
56-
<footer className="relative z-10 mt-10 p-4 bg-gray-500 text-white text-center rounded-lg shadow-lg w-full mx-auto flex flex-col items-center justify-center">
57-
<div className="flex justify-between w-full mt-6">
58-
<Link
59-
href="https://dtip.gitbook.io/docs/"
60-
className="hover:underline flex items-center"
61-
>
62-
<i className="fa-solid fa-question-circle fa-lg mr-2"></i>
63-
Docs
64-
</Link>
65-
<a
66-
href="https://github.com/orgs/LinkTrue/repositories"
67-
target="_blank"
68-
rel="noopener noreferrer"
69-
className="hover:underline flex items-center"
70-
>
71-
<i className="fa-brands fa-github fa-lg mr-2"></i>
72-
trust but VERIFY
73-
</a>
74-
</div>
75-
<Link
76-
href="https://t.me/+nGn36o2JAv42ODAx"
77-
target="_blank"
78-
className="hover:underline flex items-center mt-8"
79-
>
80-
<i className="fa-solid fa-face-smile fa-lg mr-2"></i>
81-
Join the Community
82-
</Link>
83-
<a
84-
className="text-md mt-12 text-orange-500"
85-
href="https://dtip.gitbook.io/docs/terms/terms-of-use"
86-
target="_blank"
87-
>
88-
TERMS OF USE
89-
</a>
90-
</footer>
91-
</div>
60+
{children}
61+
{/* Footer */}
62+
<footer className="
63+
mt-auto bg-black text-white text-center py-6 px-6
64+
w-full mx-auto flex flex-col
65+
items-center justify-center
66+
gap-4
67+
">
68+
<Link
69+
href="https://dtip.gitbook.io/docs/"
70+
className="hover:underline flex items-center"
71+
>
72+
<i className="fa-solid fa-question-circle fa-lg mr-2"></i>
73+
Docs
74+
</Link>
75+
76+
<Link
77+
href="https://github.com/orgs/LinkTrue/repositories"
78+
target="_blank"
79+
rel="noopener noreferrer"
80+
className="hover:underline flex items-center"
81+
>
82+
<i className="fa-brands fa-github fa-lg mr-2"></i>
83+
Source Code
84+
</Link>
85+
86+
<Link
87+
className="text-md"
88+
href="https://dtip.gitbook.io/docs/terms/terms-of-use"
89+
target="_blank"
90+
>
91+
<i className="fa-solid fa-handshake fa-lg mr-2"></i>
92+
TERMS OF USE
93+
</Link>
94+
95+
<Link
96+
href="https://t.me/+nGn36o2JAv42ODAx"
97+
target="_blank"
98+
className="hover:underline flex items-center"
99+
>
100+
<i className="fa-solid fa-face-smile fa-lg mr-2"></i>
101+
Join the Community
102+
</Link>
103+
</footer>
92104
</SmartContractProvider>
93105
</StepsProvider>
94106
</GlobalStateProvider>

0 commit comments

Comments
 (0)