index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Tip Plugin</title>
    <style>
        .hidden {
            display: none;
        }
    </style>
    <link rel="stylesheet" href="style.css">
</head>
<body>
    <div class="container">
        <button id="creatorBtn">Creator</button>
        <button id="readerBtn">Reader</button>
        <button id="walletBtn">Connect Wallet</button>

        <div id="creatorOptions" class="hidden">
            <input id="urlInput" type="text" placeholder="Enter URL">
            <button id="storeUrlButton">Store URL</button>
            <button id="withdrawButton">Withdraw</button>
        </div>

        <div id="readerOptions" class="hidden">
            <input id="tipAmount" type="number" placeholder="Enter tip amount (ETH)">
            <button id="tipButton">Send Tips</button>
        </div>
    </div>

    <script type="module" src="script.js">
    </script>
</body>
</html>