Skip to content

Commit 135fc29

Browse files
thomivythomivy
committed
Fixed gremlin characters, fixed various path issues, implemented new home page
1 parent 976af84 commit 135fc29

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

41 files changed

+4695
-473
lines changed

‎components/CommonActions.module.css

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,9 @@
2424
grid-template-rows: auto 1fr auto; /* Three rows: header, content, footer */
2525
margin: 0px 0px 4px 0px;
2626
transition: box-shadow 0.3s ease-in-out;
27-
box-shadow: 0 4px 8px 0 rgb(0 0 0 / 8%), 0 6px 20px 0 rgb(0 0 0 / 1%);
27+
box-shadow:
28+
0 4px 8px 0 rgb(0 0 0 / 8%),
29+
0 6px 20px 0 rgb(0 0 0 / 1%);
2830
overflow: hidden; /* Maintain the border-radius */
2931
background-color: #f5f5f5d1;
3032
}

‎components/Feature.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@ const DetailedFeatureInner = (props: { feature: FeatureProps["feature"] }) => {
1717
<Icon
1818
className={classNames(
1919
"h-8 w-8 dark:text-white flex-shrink-0 p-1.5 text-black block dark:stroke-[url(#pink-gradient)]",
20-
Icon.requiresFill && "dark:fill-[url(#pink-gradient)]"
20+
Icon.requiresFill && "dark:fill-[url(#pink-gradient)]",
2121
)}
2222
aria-hidden="true"
2323
/>

‎components/Footer.tsx

Lines changed: 132 additions & 217 deletions
Large diffs are not rendered by default.

‎components/HeaderLogo.tsx

Lines changed: 7 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,12 @@
11
function HeaderLogo() {
22
return (
3-
//className="dark:hidden"
4-
<>
3+
<div className="flex items-center align-middle">
54
<a
65
href="https://docs.tangle.tools"
76
target="_blank"
87
rel="noreferrer"
98
title="Tangle Homepage"
9+
className="mr-2" // Add some right margin to create spacing
1010
>
1111
<svg
1212
width="130"
@@ -64,7 +64,11 @@ function HeaderLogo() {
6464
</defs>
6565
</svg>
6666
</a>
67-
</>
67+
68+
<span className="bg-blue-100 text-blue-800 text-lg font-semibold mt-1 px-2.5 py-0.5 rounded dark:bg-blue-200 dark:text-blue-800 ms-2">
69+
DOCS
70+
</span>
71+
</div>
6872
);
6973
}
7074

‎components/LandingPage.tsx

Lines changed: 101 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,101 @@
1+
import Image from "next/image";
2+
3+
const LandingPage = () => {
4+
return (
5+
<div className="max-w-screen-xl mx-auto mt-20">
6+
{/* Header and Image Row */}
7+
<div className="flex flex-col items-center z-10 font-bold p-5 lg:p-0 lg:flex-row lg:items-end justify-between">
8+
<div className="flex flex-col items-start mb-8 gap-1 space-y-4 lg:space-y-6">
9+
<p className="text-sm font-bol md:absolute text-gray-400 pl-1 lg:text-sm">
10+
TANGLE DOCUMENTATION
11+
</p>
12+
<h1 className="text-3xl font-normal text-gray-900 dark:text-white md:text-3xl lg:text-5xl">
13+
Your Guide to the{" "}
14+
<span className="text-transparent bg-clip-text bg-gradient-to-r from-purple-700 to-blue-700">
15+
Modular Restaking Infrastructure
16+
</span>
17+
</h1>
18+
<p className="text-lg font-bold md:font-normal text-gray-700 lg:text-lg dark:text-gray-400">
19+
Create and market modular services that securely deploy across any
20+
blockchain ecosystem.
21+
</p>
22+
<button
23+
type="button"
24+
className="text-white flex justify-center content-center !bg-gradient-to-br ml-1 from-purple-600 to-blue-500 hover:bg-gradient-to-bl focus:ring-4 focus:outline-none focus:ring-blue-300 dark:focus:ring-blue-800 font-medium relative flex-wrap rounded-lg text-md px-5 py-2.5 text-center"
25+
>
26+
Claim Airdrop
27+
</button>
28+
</div>
29+
30+
<div className="hidden lg:flex z-0 ">
31+
<div className="flex flex-col content-end z-0 h-full">
32+
<Image
33+
src="/../public/images/DocsLandingGraphic.png"
34+
alt="A visualization of the Tangle Network"
35+
width={1000}
36+
height={1000}
37+
className="md:content-end max-w-screen-md z-0 "
38+
/>
39+
</div>
40+
</div>
41+
</div>
42+
43+
{/* Horizontal Line */}
44+
<div className=" opacity-0 sm:opacity-100 border-b border-gray-300 mb-8"></div>
45+
46+
{/* Call-to-Action Cards Row */}
47+
<div className="flex flex-col sm:flex-row items-center gap-5 mb-8">
48+
<a
49+
href="#"
50+
className="block max-w-sm min-h-44 p-6 bg-white border border-gray-200 rounded-lg shadow hover:bg-gray-100 dark:bg-gray-800 dark:border-gray-700 dark:hover:bg-gray-700"
51+
>
52+
<h5 className="mb-2 md:text-lg lg:text-xl font-semibold tracking-tight text-violet-700 dark:text-white">
53+
Get started building Blueprints
54+
</h5>
55+
<p className="text-sm font-normal text-gray-900 dark:text-gray-400">
56+
Blueprints are the template object implemented as software in the
57+
Tangle codebase.
58+
</p>
59+
</a>
60+
<a
61+
href="#"
62+
className="block max-w-sm min-h-44 p-6 bg-white border border-gray-200 rounded-lg shadow hover:bg-gray-100 dark:bg-gray-800 dark:border-gray-700 dark:hover:bg-gray-700"
63+
>
64+
<h5 className="mb-2 md:text-lg lg:text-xl font-semibold tracking-tight text-violet-700 dark:text-white">
65+
Restake TNT or other assets.
66+
</h5>
67+
<p className="text-sm font-normal text-gray-900 dark:text-gray-400">
68+
Restaking secures the actively validated services on Tangle, and
69+
earns rewards.
70+
</p>
71+
</a>
72+
<a
73+
href="#"
74+
className="block max-w-sm min-h-44 p-6 bg-white border border-gray-200 rounded-lg shadow hover:bg-gray-100 dark:bg-gray-800 dark:border-gray-700 dark:hover:bg-gray-700"
75+
>
76+
<h5 className="mb-2 md:text-lg lg:text-xl font-semibold tracking-tight text-violet-700 dark:text-white">
77+
Run a Node, Validator, or Service Operator
78+
</h5>
79+
<p className="text-sm font-normal text-gray-900 dark:text-gray-400">
80+
Noderunners can earn staking rewards, secure the network, and
81+
operators earn income from services.
82+
</p>
83+
</a>
84+
<a
85+
href="#"
86+
className="block max-w-sm min-h-44 p-6 bg-white border border-gray-200 rounded-lg shadow hover:bg-gray-100 dark:bg-gray-800 dark:border-gray-700 dark:hover:bg-gray-700"
87+
>
88+
<h5 className="mb-2 md:text-lg lg:text-xl font-semibold tracking-tight text-violet-700 dark:text-white">
89+
Learn more about the network.
90+
</h5>
91+
<p className="text-sm font-normal text-gray-900 dark:text-gray-400">
92+
Here are the biggest enterprise technology acquisitions of 2021 so
93+
far, in reverse chronological order.
94+
</p>
95+
</a>
96+
</div>
97+
</div>
98+
);
99+
};
100+
101+
export default LandingPage;

0 commit comments

Comments
 (0)