Candy Machine V2 - TAILWIND - Template

by Halaprix.
Live preview here
1click deploy:

Installation

0. Prerequisities:

   • node.js
   • yarn - npm add -g yarn (run as root / su eg. sudo npm add -g yarn)

1. Clone the repository:

   git clone https://github.com/halaprix/mint-web-bootstrap-shapes

   cd mint-web-bootstrap-shapes

2. use yarn to install all dependencies:

   yarn install

3. Fill .env-example with your Candy Machine details (can be found in .json file in .cache directory, after CM upload). Rename the file to .env.

4. Run yarn start to start the developement server.

   yarn start

5. If you are using traditional hosting, run yarn build and uplaod contents of the build folder to your hostings public_html

6. (Optional) - If deploying to Vercel, use the ENV VARIABLES from .env file here or use one click prefilled deploy:
   
   

---

Example configuration

Devnet:

- REACT_APP_SOLANA_NETWORK=devnet
- REACT_APP_SOLANA_RPC_HOST=https://psytrbhymqlkfrhudd.dev.genesysgo.net:8899/

Mainnet-beta:

- REACT_APP_SOLANA_NETWORK=mainnet-beta
- REACT_APP_SOLANA_RPC_HOST=https://ssc-dao.genesysgo.net/

Styling

Favicon, Phantom styling - index.html

• Use this generator to generate favicons, metadata and images, to be put to /public.

Buttons - /src/MintButton.tsx and src/Home.tsx

• Change the style of the buttons in styled components. background: linear-gradient(29deg, #34342F 0%, #44C3A1 100%); is reponsible for the button gradient.

Images - /public

• /public/logo.png is the top logo
• /public/animation.gif is the middle container image.

Styles - /src/index.css

• Change the styles of the website. background: linear-gradient(29deg, #34342f 0%, #5ff1cb 50%, #44c3a1 100%); is the background gradient. You can generate the gradient using this generator
• change the Paper style (the three containers) in /src/Home.tsx :

  const StyledPaper = styled(Paper)`
  padding: 24px;
  background-color: #34342f;
  border-radius: 6px;
  margin: 10px;
  `;
  

---