Generate YouTube Subscribers

import React, { useState } from 'react';
import './App.css';

function App() {
  const [username, setUsername] = useState('');
  const [subscribers, setSubscribers] = useState(0);
  const [likes, setLikes] = useState(0);
  const [generated, setGenerated] = useState(false);

  const handleGenerate = () => {
    if (username && subscribers > 0 && likes > 0) {
      setGenerated(true);
    } else {
      alert('Please fill in all fields correctly.');
    }
  };

  return (
    <div className="App">
      <header className="header">
        <h1 className="title">YouTube Subscribers & Likes Generator</h1>
      </header>
      <main className="main-content">
        <div className="input-group">
          <label className="label">Username:</label>
          <input
            type="text"
            className="input"
            value={username}
            onChange={(e) => setUsername(e.target.value)}
            placeholder="Enter your username"
          />
        </div>
        <div className="input-group">
          <label className="label">Subscribers:</label>
          <input
            type="number"
            className="input"
            value={subscribers}
            onChange={(e) => setSubscribers(Number(e.target.value))}
            placeholder="Enter number of subscribers"
          />
        </div>
        <div className="input-group">
          <label className="label">Likes:</label>
          <input
            type="number"
            className="input"
            value={likes}
            onChange={(e) => setLikes(Number(e.target.value))}
            placeholder="Enter number of likes"
          />
        </div>
        <button className="button" onClick={handleGenerate}>Generate</button>
        {generated && (
          <div className="result">
            <h2 className="result-title">Generated:</h2>
            <p className="result-text">Username: {username}</p>
            <p className="result-text">Subscribers: {subscribers}</p>
            <p className="result-text">Likes: {likes}</p>
          </div>
        )}
      </main>
      <footer className="footer">
        <p className="copyright">© 2025 YouTube Subscribers & Likes Generator. All rights reserved.</p>
      </footer>
    </div>
  );
}

export default App;