ethbrno
/
soulbound_faucet
3
0
Rozštěpit 0
Zdrojový kód Úkoly Požadavky na natažení Balíčky Projekty Vydání Wiki Aktivita

design update

This commit is contained in:
Adam Sobotka 2022-11-02 13:06:00 +01:00
rodič c581e99215
revize 3ec8a292f2
7 změnil soubory, kde provedl 17 přidání a 29 odebrání
Zobrazit statistiky Stáhněte soubor záplaty Stáhněte rozdílový soubor Rozbalit všechny soubory Sbalit všechny soubory

2
index.html
Zobrazit soubor

@ -21,7 +21,7 @@
</script>
</head>
<body class="anim">
<body>
<div id="root"></div>
<script type="module" src="/src/main.tsx"></script>
</body>

binární
public/cityscape.png Normal file
Zobrazit soubor

Binární soubor nebyl zobrazen.
Vedle sebe

Za

Šířka:  |  Výška:  |  Velikost: 56 KiB

binární
public/key_black.png Normal file
Zobrazit soubor

Binární soubor nebyl zobrazen.
Vedle sebe

Za

Šířka:  |  Výška:  |  Velikost: 14 KiB

28
src/App.tsx
Zobrazit soubor

@ -105,17 +105,8 @@ export function App() {
return (
<>
<section>
<div className="container mx-auto flex px-5 py-24 md:flex-row flex-col items-center opacity-70">
<div className="container mx-auto flex px-5 py-24 md:flex-row flex-col items-center">
<div className="lg:flex-grow md:w-1/2 lg:pr-24 md:pr-16 flex flex-col md:items-start md:text-left mb-16 md:mb-0 items-center text-center">
<div className="flex flex-col">
<img className="w-48 -ml-2" src="logo.svg" />
<h1 className="title-font sm:text-4xl text-3xl mb-4 font-medium text-white">
Soulbound
<br />
<p className="font-bold text-[#3441c0]">ETH Faucet</p>
</h1>
</div>
{!isEligible && isConnected && (
<div className="my-4 flex title-font">
<svg
@ -154,7 +145,7 @@ export function App() {
checked={network == "goerli"}
onChange={() => setNetwork("goerli")}
/>
<div className="relative w-16 h-10 flex items-center justify-center text-black peer-checked:bg-black peer-checked:text-white before:absolute before:z-[-1] before:top-0.5 before:left-0.5 before:w-full before:h-full peer-checked:before:bg-[#3441c0] cursor-pointer">
<div className="relative w-16 h-10 flex items-center justify-center peer-checked:bg-black peer-checked:text-white before:absolute before:z-[-1] before:top-0.5 before:left-0.5 before:w-full before:h-full peer-checked:before:bg-white cursor-pointer">
GOERLI
</div>
</label>
@ -167,7 +158,7 @@ export function App() {
checked={network == "sepolia"}
onChange={() => setNetwork("sepolia")}
/>
<div className="relative w-16 h-10 flex items-center justify-center text-black peer-checked:bg-black peer-checked:text-white before:absolute before:z-[-1] before:top-0.5 before:left-0.5 before:w-full before:h-full peer-checked:before:bg-[#3441c0] cursor-pointer">
<div className="relative w-16 h-10 flex items-center justify-center peer-checked:bg-black peer-checked:text-white before:absolute before:z-[-1] before:top-0.5 before:left-0.5 before:w-full before:h-full peer-checked:before:bg-white cursor-pointer">
SEPOLIA
</div>
</label>
@ -210,7 +201,7 @@ export function App() {
<div className="mb-4 text-sm font-medium">
<div className="flex space-x-4">
<button
className={isConnected ? `whitebtn` : `greenbtn`}
className={isConnected ? `greenbtn` : `greenbtn`}
onClick={() => setIsConnecting(true)}
disabled={isFetching != "none" || isConnected}
>
@ -237,11 +228,12 @@ export function App() {
)}
</div>
<div className="lg:max-w-lg lg:w-full md:w-1/3 w-5/6 flex justify-center">
<img
className="object-cover object-center w-36"
alt="ETH Logo"
src="eth-glyph-colored.png"
/>
<div className="flex flex-col">
<img className="w-48 -ml-2" src="logo.svg" />
<h1 className="title-font sm:text-4xl text-3xl mb-4 font-medium text-white">
<p className="font-bold bg-white text-black">ETH Faucet</p>
</h1>
</div>
</div>
</div>
</section>

2
src/components/Balance.tsx
Zobrazit soubor

@ -14,7 +14,7 @@ export function Balance(props: BalanceType[]) {
return (
<>
<section className="text-gray-900 body-font w-full bg-white/20 my-4 p-4 border-white/20 border">
<section className=" body-font w-full bg-white/10 my-4 p-4 border-white/20 border">
<div className="container divide-y mx-auto">
{nets.map((net) => {
return (

4
src/components/LoadingIndicator.tsx
Zobrazit soubor

@ -1,12 +1,12 @@
export function LoadingIndicator() {
return (
<div className="text-gray-900 body-font w-full bg-white/20 my-4 p-4 border-white/20 border">
<div className="body-font w-full bg-white/20 my-4 p-4 border-white/20 border">
<div className="container mx-auto">
<div className="flex justify-start align-middle items-center">
<div className="p-4 ">
<h2 className="title-font font-medium sm:text-2xl text-3xl">
<svg
className="animate-spin -ml-1 mr-3 h-5 w-5 text-black"
className="animate-spin -ml-1 mr-3 h-5 w-5 text-white"
xmlns="http://www.w3.org/2000/svg"
fill="none"
viewBox="0 0 24 24"

10
src/index.css
Zobrazit soubor

@ -4,7 +4,7 @@
@layer components {
body {
@apply text-gray-900 bg-white;
@apply text-white bg-black;
}
.title-font {
@ -12,20 +12,16 @@
}
.greenbtn {
@apply px-6 h-12 uppercase font-semibold tracking-wider border-2 border-[#3441c0] bg-[#3441c0] text-white hover:border-white disabled:opacity-10;
@apply px-6 h-12 uppercase font-semibold tracking-wider border-2 border-white bg-white text-black hover:border-white disabled:opacity-20;
}
.whitebtn {
@apply px-6 h-12 uppercase font-semibold tracking-wider border border-slate-200 text-slate-900 hover:border-[#3441c0] disabled:opacity-10 hover:bg-white/30;
@apply px-6 h-12 uppercase font-semibold tracking-wider border border-slate-200 text-white hover:border-white disabled:opacity-20 hover:bg-white/30;
}
.redbtn {
@apply px-6 h-12 uppercase font-semibold tracking-wider border-2 border-black bg-red-400 text-white hover:border-red-400 disabled:opacity-10;
}
.ethblu {
color: #3441c0
}
}
.anim {