guapswap.github.io/index.html at main · GuapSwap/guapswap.github.io · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>GuapSwap</title>
        <link href="./css/main.css" rel="stylesheet">
    </head>
    <body>
        <div class="flex flex-col justify-center">
            <div class="flex flex-col justify-center">
                <img class="" src="./images/guapswap-banner.png" alt="" />
                <div class="flex flex-col justify-center space-y-3 sm:space-y-5 lg:space-y-10">
                    <span class="text-xs sm:text-xl lg:text-3xl font-sans font-black text-center">Decentralized Miner Profit Swapping For Ergo Platform.</span>
                    <span class="text-xs sm:text-xl lg:text-3xl font-sans font-black text-center">Mine ERG And Get Paid In Any Native Ergo Token.</span>
                </div>
                <div class="flex flex-row justify-center">
                    <a class="grid grid-rows-1 justify-center w-20 h-6 sm:w-32 sm:h-9 md:w-32 md:h-9 lg:w-48 lg:h-12 rounded-md sm:rounded-lg md:rounded-lg lg:rounded-xl shadow-guap shadow-red-500 hover:shadow-black text-xs sm:text-xl md:text-xl lg:text-3xl font-sans font-medium text-center my-8 sm:my-8 md:my-8 lg:my-20" href="https://drive.google.com/file/d/13t6o_XPpvfUY0EWKi2VJGtqZTVesNsHW/view?usp=sharing">
                        <span class="align-middle py-1">Whitepaper</span>
                    </a>
                </div>
            </div>
            <div class="flex flex-col justify-center space-y-2 lg:space-y-5 my-10">
                <div class="flex flex-col justify-center space-y-2 md:space-y-5 lg:space-y-10">
                    <span class="text-xs sm:text-xl md:text-xl lg:text-3xl font-sans font-black text-center">Giving Miners The Tools For Direct Access To DEFI.</span>
                </div>
                <div class="grid auto-rows-max justify-center">
                    <a class="grid grid-rows-2 gap-2 justify-center w-60 h-24 sm:w-72 sm:h-32 md:w-72 md:h-32 lg:w-96 lg:h-40 rounded-md shadow-guap shadow-blue-500 hover:shadow-black text-xs sm:text-sm md:text-md lg:text-lg font-sans font-medium text-center my-5">
                        <img class="px-2 py-2 sm:px-5 sm:py-5 md:px-5 md:py-5 lg:px-5 lg:py-5" src="./images/guapswap-gui-banner.png" alt="" />
                        <span class="align-middle py-2 sm:py-5 md:py-5 lg:py-5">Desktop GUI for all GuapSwap services.</span>
                    </a>
                    <a class="grid grid-rows-2 gap-2 justify-center w-60 h-24 sm:w-72 sm:h-32 md:w-72 md:h-32 lg:w-96 lg:h-40 rounded-md shadow-guap shadow-black hover:shadow-red-500 text-xs sm:text-sm md:text-md lg:text-lg font-sans font-medium text-center my-5">
                        <img class="px-2 py-2 sm:px-5 sm:py-5 md:px-5 md:py-5 lg:px-5 lg:py-5" src="./images/guapswap-cli-banner.png" alt="" />
                        <span class="align-middle px-2 py-1 sm:py-3 md:py-3 lg:py-3">CLI tool for miner profit swapping and mining portfolios.</span>
                    </a>
                    <a class="grid grid-rows-2 gap-2 justify-center w-60 h-24 sm:w-72 sm:h-32 md:w-72 md:h-32 lg:w-96 lg:h-40 rounded-md shadow-guap shadow-green-700 hover:shadow-black text-xs sm:text-sm md:text-md lg:text-lg font-sans font-medium text-center my-5">
                        <img class="px-2 py-2 sm:px-5 sm:py-5 md:px-5 md:py-5 lg:px-5 lg:py-5" src="./images/guapswap-pay-banner.png" alt="" />
                        <span class="align-middle px-2 py-2 sm:py-5 md:py-5 lg:py-5">Pay using any native Ergo token.</span>
                    </a>
                    <a class="grid grid-rows-2 gap-2 justify-center w-60 h-24 sm:w-72 sm:h-32 md:w-72 md:h-32 lg:w-96 lg:h-40 rounded-md shadow-guap shadow-orange-500 hover:shadow-black text-xs sm:text-sm md:text-md lg:text-lg font-sans font-medium text-center my-5">
                        <img class="px-2 py-2 sm:px-5 sm:py-5 md:px-5 md:py-5 lg:px-5 lg:py-5" src="./images/guapswap-oasis-banner.png" alt="" />
                        <span class="align-middle px-2 py-2 sm:py-5 md:py-5 lg:py-5">Babel fees liquidity support.</span>
                    </a>
                    <a class="grid grid-rows-2 gap-2 justify-center w-60 h-24 sm:w-72 sm:h-32 md:w-72 md:h-32 lg:w-96 lg:h-40 rounded-md shadow-guap shadow-purple-500 hover:shadow-black text-xs sm:text-sm md:text-md lg:text-lg font-sans font-medium text-center my-5">
                        <img class="px-2 py-2 sm:px-5 sm:py-5 md:px-5 md:py-5 lg:px-5 lg:py-5" src="./images/guapswap-lib-banner.png" alt="" />
                        <span class="align-middle px-2 py-2 sm:py-5 md:py-5 lg:py-5">Library for open-source development.</span>
                    </a>
                </div>
            </div>
            <div class="flex flex-col justify-center space-y-10 my-10 lg:my-20">
                <div class="flex flex-col justify-center space-y-3 md:space-y-5 lg:space-y-10">
                    <span class="text-xs sm:text-xl md:text-xl lg:text-3xl font-sans font-black text-center">Built For Miners, By Miners.</span>
                </div>
                <div class="flex flex-col justify-center space-y-5 sm:flex-row sm:space-x-5 sm:space-y-0 md:space-x-5 lg:space-x-10">
                    <a class="grid grid-rows-1 justify-center w-20 h-6 sm:w-32 sm:h-9 md:w-32 md:h-9 lg:w-48 lg:h-12 rounded-md sm:rounded-lg md:rounded-lg lg:rounded-xl shadow-guap shadow-red-500 hover:shadow-black text-xs sm:text-xl md:text-xl lg:text-3xl font-sans font-medium text-center mx-auto sm:my-auto sm:mx-0" href="https://linktr.ee/GuapSwap">
                        <span class="align-middle py-1">Linktree</span>
                    </a>
                </div>
            </div>
        </div>
        <footer class="grid grid-rows-2 bg-black justify-center">
            <div class="flex flex-col w-12 pt-5 md:w-24 md:pt-10 lg:w-24 lg:pt-10 m-auto justify-center">
                <img class="" src="./images/guapswap-icon.png" alt="" />
            </div>
            <div class="flex flex-col justify-center">
                <span class="text-md sm:text-md md:text-lg lg:text-xl text-white font-sans font-black text-center">GuapSwap 2022-2023</span>
            </div>
        </footer>
    </body>
</html>