final art section done
6 files changed, +35 -3
+2-0twench_landing_page/app/page.tsx
| @@ -1,6 +1,7 @@ | ||
| 1 | 1 | import AboutSection from "@/components/AboutSection"; |
| 2 | 2 | import Banner from "@/components/Banner"; |
| 3 | 3 | import BuySection from "@/components/BuySection"; |
| 4 | +import FinalArtSection from "@/components/FinalArtSection"; | |
| 4 | 5 | import Header from "@/components/Header"; |
| 5 | 6 | import LandingSection from "@/components/LandingSection"; |
| 6 | 7 | import MotivationSection from "@/components/MotivationSection"; |
| @@ -18,6 +19,7 @@ export default function Home() { | ||
| 18 | 19 | <VideoSection /> |
| 19 | 20 | <BuySection /> |
| 20 | 21 | <RoadMapSection /> |
| 22 | + <FinalArtSection /> | |
| 21 | 23 | </div> |
| 22 | 24 | ); |
| 23 | 25 | } |
+14-0twench_landing_page/components/FinalArtSection/FinalArtSection.css
| @@ -1,2 +1,16 @@ | ||
| 1 | 1 | .FinalArtSection { |
| 2 | + background: linear-gradient( | |
| 3 | + to bottom, | |
| 4 | + rgba(255, 255, 255, 1) 0%, | |
| 5 | + rgba(255, 255, 255, 0) 100px, | |
| 6 | + rgba(255, 255, 255, 0) calc(100% - 100px), | |
| 7 | + rgba(255, 255, 255, 1) 100% | |
| 8 | + ), | |
| 9 | + url("/images/final/building.png") no-repeat center center/cover; | |
| 10 | + @apply h-[900px]; | |
| 11 | +} | |
| 12 | + | |
| 13 | +.FinalArtSection .Running { | |
| 14 | + background: url("/images/final/running.png") no-repeat center center/cover; | |
| 15 | + @apply h-full; | |
| 2 | 16 | } |
+3-3twench_landing_page/components/FinalArtSection/FinalArtSection.tsx
| @@ -1,10 +1,10 @@ | ||
| 1 | -import React from 'react'; | |
| 2 | -import './FinalArtSection.css'; | |
| 1 | +import React from "react"; | |
| 2 | +import "./FinalArtSection.css"; | |
| 3 | 3 | |
| 4 | 4 | const FinalArtSection: React.FC = () => { |
| 5 | 5 | return ( |
| 6 | 6 | <div className="FinalArtSection"> |
| 7 | - FinalArtSection | |
| 7 | + <div className="Running"></div> | |
| 8 | 8 | </div> |
| 9 | 9 | ); |
| 10 | 10 | }; |