huncholaneput inside a container
huncholane2 files changed, +43 -37
+7-3twench_landing_page/components/BuySection/BuySection.css
| @@ -2,14 +2,18 @@ | ||
| 2 | 2 | @apply bg-white h-[700px] relative w-screen text-shadow-none text-black; |
| 3 | 3 | } |
| 4 | 4 | |
| 5 | +.BuySection .Content { | |
| 6 | + @apply relative w-[320px] h-[550px] bg-red-500 top-[125px] left-[50%] transform -translate-x-1/2; | |
| 7 | +} | |
| 8 | + | |
| 5 | 9 | .BuySection .Title { |
| 6 | - @apply text-2xl leading-none top-[125px] absolute w-full text-center; | |
| 10 | + @apply text-2xl leading-none top-[0] absolute w-full text-center; | |
| 7 | 11 | } |
| 8 | 12 | |
| 9 | 13 | .BuySection .Bulletin { |
| 10 | 14 | background: url("/images/bulletin.png") no-repeat; |
| 11 | 15 | background-size: contain; |
| 12 | - @apply absolute w-[300px] h-[480px] top-[160px] left-[50%] transform -translate-x-1/2; | |
| 16 | + @apply absolute w-[300px] h-[480px] top-[35px] left-[50%] transform -translate-x-1/2; | |
| 13 | 17 | } |
| 14 | 18 | |
| 15 | 19 | .Bulletin .Text { |
| @@ -21,5 +25,5 @@ | ||
| 21 | 25 | } |
| 22 | 26 | |
| 23 | 27 | .BuySection .CopyBtn { |
| 24 | - @apply border-black border-2 bg-primary text-white absolute rounded-full bottom-[30px] px-3 py-1 text-[30px] text-nowrap left-1/2 transform -rotate-[2.8deg] -translate-x-1/2; | |
| 28 | + @apply border-black hover:brightness-150 cursor-pointer border-2 bg-primary text-white absolute rounded-full bottom-[20px] px-3 py-1 text-[30px] text-nowrap left-1/2 transform -rotate-[2.8deg] -translate-x-1/2; | |
| 25 | 29 | } |
+36-34twench_landing_page/components/BuySection/BuySection.tsx
| @@ -4,43 +4,45 @@ import "./BuySection.css"; | ||
| 4 | 4 | const BuySection: React.FC = () => { |
| 5 | 5 | return ( |
| 6 | 6 | <div className="BuySection"> |
| 7 | - <div className="Title">HOW TO BUY $TWENCH</div> | |
| 8 | - <div className="Bulletin"> | |
| 9 | - <div className="Text"> | |
| 10 | - <div className="Section"> | |
| 11 | - <p>01. CREATE WALLET</p> | |
| 12 | - <p> | |
| 13 | - Download Phantom or your wallet choice from the app store or | |
| 14 | - Google Play for free. Desktop users download the Google Chrome | |
| 15 | - extension by going to Phantom. | |
| 16 | - </p> | |
| 17 | - </div> | |
| 18 | - <div className="Section"> | |
| 19 | - <p>02. GET SOME SOL</p> | |
| 20 | - <p> | |
| 21 | - Have SOL in your wallet to switch to $TWENCH. If you don't have | |
| 22 | - any SOL, you can buy directly on Phantom, transfer from another | |
| 23 | - wallet, or buy on another exchange and send it to your wallet. | |
| 24 | - </p> | |
| 25 | - </div> | |
| 26 | - <div className="Section"> | |
| 27 | - <p>03. GO TO JUPITER</p> | |
| 28 | - <p> | |
| 29 | - Connect to Jupiter. Connect your wallet in chrome. Paste the | |
| 30 | - $TWENCH token address, select $TWENCH, and confirm. When Phantom | |
| 31 | - prompts you for a wallet signature, sign. | |
| 32 | - </p> | |
| 33 | - </div> | |
| 34 | - <div className="Section"> | |
| 35 | - <p>04. SWAP FOR TWENCH</p> | |
| 36 | - <p> | |
| 37 | - Switch SOL for $TWENCH. We have Zero taxes so you don't need to | |
| 38 | - worry about buying with a specific slippage. | |
| 39 | - </p> | |
| 7 | + <div className="Content"> | |
| 8 | + <div className="Title">HOW TO BUY $TWENCH</div> | |
| 9 | + <div className="Bulletin"> | |
| 10 | + <div className="Text"> | |
| 11 | + <div className="Section"> | |
| 12 | + <p>01. CREATE WALLET</p> | |
| 13 | + <p> | |
| 14 | + Download Phantom or your wallet choice from the app store or | |
| 15 | + Google Play for free. Desktop users download the Google Chrome | |
| 16 | + extension by going to Phantom. | |
| 17 | + </p> | |
| 18 | + </div> | |
| 19 | + <div className="Section"> | |
| 20 | + <p>02. GET SOME SOL</p> | |
| 21 | + <p> | |
| 22 | + Have SOL in your wallet to switch to $TWENCH. If you don't have | |
| 23 | + any SOL, you can buy directly on Phantom, transfer from another | |
| 24 | + wallet, or buy on another exchange and send it to your wallet. | |
| 25 | + </p> | |
| 26 | + </div> | |
| 27 | + <div className="Section"> | |
| 28 | + <p>03. GO TO JUPITER</p> | |
| 29 | + <p> | |
| 30 | + Connect to Jupiter. Connect your wallet in chrome. Paste the | |
| 31 | + $TWENCH token address, select $TWENCH, and confirm. When Phantom | |
| 32 | + prompts you for a wallet signature, sign. | |
| 33 | + </p> | |
| 34 | + </div> | |
| 35 | + <div className="Section"> | |
| 36 | + <p>04. SWAP FOR TWENCH</p> | |
| 37 | + <p> | |
| 38 | + Switch SOL for $TWENCH. We have Zero taxes so you don't need to | |
| 39 | + worry about buying with a specific slippage. | |
| 40 | + </p> | |
| 41 | + </div> | |
| 40 | 42 | </div> |
| 41 | 43 | </div> |
| 44 | + <div className="CopyBtn">Click To Copy CA</div> | |
| 42 | 45 | </div> |
| 43 | - <div className="CopyBtn">Click To Copy CA</div> | |
| 44 | 46 | </div> |
| 45 | 47 | ); |
| 46 | 48 | }; |