From 49515a280309d227d22ce6a33399f3bfd9d79044 Mon Sep 17 00:00:00 2001 From: Kimberly900 <96483053+Kimberly900@users.noreply.github.com> Date: Wed, 22 Dec 2021 10:15:43 +0100 Subject: [PATCH 1/3] Choice coin dev grant --- DevGrants/Kimberly_devGrant/index.html | 39 +++++ DevGrants/Kimberly_devGrant/script (1).js | 87 ++++++++++ DevGrants/Kimberly_devGrant/style.css | 197 ++++++++++++++++++++++ 3 files changed, 323 insertions(+) create mode 100644 DevGrants/Kimberly_devGrant/index.html create mode 100644 DevGrants/Kimberly_devGrant/script (1).js create mode 100644 DevGrants/Kimberly_devGrant/style.css diff --git a/DevGrants/Kimberly_devGrant/index.html b/DevGrants/Kimberly_devGrant/index.html new file mode 100644 index 000000000..23cd713df --- /dev/null +++ b/DevGrants/Kimberly_devGrant/index.html @@ -0,0 +1,39 @@ + + + + + + + + +
+
+

Choice-Coin

+ +
+ +
+ +
+
+ +
+ + +
+

Cast your votes.

+
+ +
+ + +
+ +
+ +
+
+ + + + diff --git a/DevGrants/Kimberly_devGrant/script (1).js b/DevGrants/Kimberly_devGrant/script (1).js new file mode 100644 index 000000000..9a1a13ba9 --- /dev/null +++ b/DevGrants/Kimberly_devGrant/script (1).js @@ -0,0 +1,87 @@ +// Retrieve AlgoSigner sdk from the browser +const { AlgoSigner } = window; + +//define the adddresses +const red_address = ""; +const blue_address = ""; + +//Get DOM Elements +const submitBtn = document.querySelector(".submit"); +const connectWallet = document.querySelector(".connect"); +const yes = document.querySelector(".yes-btn"); +const no = document.querySelector(".no-btn"); + +let yesOrNo = ""; +const setValue = (value) => { + yesOrNo = value; +}; +//Function to Connect User's Account +const ConnectAccount = async () => { + //Check if AlgoSigner is installed + if (!AlgoSigner) { + return alert("Please install AlgoSigner"); + } + + //Connect Account if AlgoSigner is installed + await AlgoSigner.connect() + .then((d) => {}) + .catch((e) => console.log("error in connection")); +}; + +// Sign the Transaction +const signTransaction = async (receiver = blue_address) => { + const txn = await AlgoSigner.algod({ + ledger: "TestNet", + path: "/v2/transactions/params", + }) + .then((e) => { + return e; + }) + .catch((e) => console.log("error in algod")); + + //retrieve account details + const account = await AlgoSigner.accounts({ + ledger: "TestNet", + }) + .then((value) => value[0]) + .then((result) => { + const { address } = result; + + return address; + }) + + .catch((e) => console.log("cannot retrieve accounts")); + + //Transaction signature + await AlgoSigner.sign({ + from: account, + to: receiver, + amount: document.querySelector("hi"), + note: "voting", + fee: txn["min-fee"], + }) + .then(() => console.log("complete")) + .catch((e) => console.log("error", e)); +}; + +connectWallet.addEventListener("click", async (e) => { + await ConnectAccount(); + connectWallet.value = "Connected"; +}); + +submitBtn.addEventListener("click", (e) => { + console.log("welcome user"); + + //checks to see if the user click an option + if (!yesOrNo) { + alert("Please click either yes or no"); + return; + } + if (yesOrNo == "Yes") { + signTransaction(blue_address); + } + if (yesOrNo == "No") { + signTransaction(red_address); + } + alert(`Transaction successful in successful in ${yesOrNo}`); +}); diff --git a/DevGrants/Kimberly_devGrant/style.css b/DevGrants/Kimberly_devGrant/style.css new file mode 100644 index 000000000..2b1c6fefb --- /dev/null +++ b/DevGrants/Kimberly_devGrant/style.css @@ -0,0 +1,197 @@ +* { + padding: 10px; + margin: 0; + box-sizing: border-box; + list-style: none; + text-decoration: none; + font-family: "Josefin Sans", sans-serif; + border: none; + outline: none; +} + +body { + display: flex; + align-items: center; + justify-content: space-around; + flex-direction: column; + min-height: 100vh; + background-color: mediumslateblue; +} + +.container { + border: 1px solid #fff; + width: auto; + border-radius: 5px; + box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 28px, + rgba(0, 0, 0, 0.22) 0px 10px 10px; +} + +.first { + padding: 1px; + font-size: 18px; + display: flex; + justify-content: space-between; + align-items: center; +} + +.first h4 { + font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, + Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif; + text-decoration: underline; + font-size: 20px; + font-weight: 800; + text-transform: capitalize; + color: transparent; +} + +.first ::placeholder { + color: rgba(128, 128, 128, 0.407); + font-size: 20px; +} + +.first button { + margin-left: 120px; + background-color: transparent; + font-size: 12px; + letter-spacing: 2px; + font-weight: bold; + color: #fff; + width: 140px; + padding: 10px; + font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; + font-weight: 600; + border: 1px solid #fff; + border-radius: 3px; + box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 28px, + rgba(0, 0, 0, 0.22) 0px 10px 10px; +} + +.second { + padding: 25px; + margin-left: -20px; + width: 83%; +} + +.second ::placeholder { + padding: 10px; + letter-spacing: 2px; + color: #000; + font-weight: 600; + text-transform: capitalize; +} + +.second input { + /* background-color: darkslategrey; */ + margin-left: 10px; + color: #000; + border-radius: 3px; + width: 100%; + height: 30px; + border: 1px solid gray; + box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 28px, + rgba(0, 0, 0, 0.22) 0px 10px 10px; +} + +.sec-ond { + /* margin-bottom: 10px; + margin-top: -16px; */ + margin: -16px 5px 10px 4px; + width: 40%; +} + +.sec-ond ::placeholder { + color: #000; + padding: 10px; + letter-spacing: 2px; + font-weight: 600; + text-transform: capitalize; +} + +.sec-ond input { + /* margin-left: 4px; */ + /* background-color: darkslategrey; */ + color: #000; + border-radius: 3px; + width: 100%; + height: 30px; + border: 1px solid gray; + box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 28px, + rgba(0, 0, 0, 0.22) 0px 10px 10px; +} + +.third { + padding: 40px; + margin-left: 10px; + margin-right: 10px; + border: 1px solid; + background-color: rgba(124, 104, 238, 0.39); + border-radius: 5px; + border: 1px solid #fff; + /* box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 28px, + rgba(0, 0, 0, 0.22) 0px 10px 10px; */ +} + +.third h4 { + display: flex; + color: #fff; + text-transform: uppercase; + justify-content: center; + letter-spacing: 2px; + font-family: fantasy; + font-size: 20px; + font-weight: bold; +} + +.rand-btn { + padding: 20px; + margin-left: 40px; + margin-right: 60px; + display: flex; + justify-content: space-between; +} + +.rand-btn input { + background-color: #000; + color: #fff; + font-weight: 800; + font-size: 11px; + width: 100px; + padding: 7px; + border: none; + border-radius: 5px; + font-weight: bolder; + box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 28px, + rgba(0, 0, 0, 0.22) 0px 10px 10px; +} + +.rand-btn .true { + border: 1px solid #fff; + background-color: transparent; + color: #fff; +} +.rand-btn .false { + border: 1px solid #fff; + background-color: transparent; + color: #fff; +} + +.submit { + padding: 20px; + display: flex; + justify-content: center; + align-items: center; +} + +.submit input { + width: 200px; + padding: 10px; + border: 1px solid #fff; + border-radius: 5px; + font-size: 15px; + font-weight: 800; + background-color: rgba(91, 50, 206, 0.578); + color: #fff; + letter-spacing: 2px; + box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 28px, + rgba(0, 0, 0, 0.22) 0px 10px 10px; +} From 198770951c8d0b7134adc8ba3092a5d1fc95df4c Mon Sep 17 00:00:00 2001 From: Kimberly900 <96483053+Kimberly900@users.noreply.github.com> Date: Wed, 22 Dec 2021 12:46:00 +0100 Subject: [PATCH 2/3] Delete DevGrants/Kimberly_devGrant directory --- DevGrants/Kimberly_devGrant/index.html | 39 ----- DevGrants/Kimberly_devGrant/script (1).js | 87 ---------- DevGrants/Kimberly_devGrant/style.css | 197 ---------------------- 3 files changed, 323 deletions(-) delete mode 100644 DevGrants/Kimberly_devGrant/index.html delete mode 100644 DevGrants/Kimberly_devGrant/script (1).js delete mode 100644 DevGrants/Kimberly_devGrant/style.css diff --git a/DevGrants/Kimberly_devGrant/index.html b/DevGrants/Kimberly_devGrant/index.html deleted file mode 100644 index 23cd713df..000000000 --- a/DevGrants/Kimberly_devGrant/index.html +++ /dev/null @@ -1,39 +0,0 @@ - - - - - - - - -
-
-

Choice-Coin

- -
- -
- -
-
- -
- - -
-

Cast your votes.

-
- -
- - -
- -
- -
-
- - - - diff --git a/DevGrants/Kimberly_devGrant/script (1).js b/DevGrants/Kimberly_devGrant/script (1).js deleted file mode 100644 index 9a1a13ba9..000000000 --- a/DevGrants/Kimberly_devGrant/script (1).js +++ /dev/null @@ -1,87 +0,0 @@ -// Retrieve AlgoSigner sdk from the browser -const { AlgoSigner } = window; - -//define the adddresses -const red_address = ""; -const blue_address = ""; - -//Get DOM Elements -const submitBtn = document.querySelector(".submit"); -const connectWallet = document.querySelector(".connect"); -const yes = document.querySelector(".yes-btn"); -const no = document.querySelector(".no-btn"); - -let yesOrNo = ""; -const setValue = (value) => { - yesOrNo = value; -}; -//Function to Connect User's Account -const ConnectAccount = async () => { - //Check if AlgoSigner is installed - if (!AlgoSigner) { - return alert("Please install AlgoSigner"); - } - - //Connect Account if AlgoSigner is installed - await AlgoSigner.connect() - .then((d) => {}) - .catch((e) => console.log("error in connection")); -}; - -// Sign the Transaction -const signTransaction = async (receiver = blue_address) => { - const txn = await AlgoSigner.algod({ - ledger: "TestNet", - path: "/v2/transactions/params", - }) - .then((e) => { - return e; - }) - .catch((e) => console.log("error in algod")); - - //retrieve account details - const account = await AlgoSigner.accounts({ - ledger: "TestNet", - }) - .then((value) => value[0]) - .then((result) => { - const { address } = result; - - return address; - }) - - .catch((e) => console.log("cannot retrieve accounts")); - - //Transaction signature - await AlgoSigner.sign({ - from: account, - to: receiver, - amount: document.querySelector("hi"), - note: "voting", - fee: txn["min-fee"], - }) - .then(() => console.log("complete")) - .catch((e) => console.log("error", e)); -}; - -connectWallet.addEventListener("click", async (e) => { - await ConnectAccount(); - connectWallet.value = "Connected"; -}); - -submitBtn.addEventListener("click", (e) => { - console.log("welcome user"); - - //checks to see if the user click an option - if (!yesOrNo) { - alert("Please click either yes or no"); - return; - } - if (yesOrNo == "Yes") { - signTransaction(blue_address); - } - if (yesOrNo == "No") { - signTransaction(red_address); - } - alert(`Transaction successful in successful in ${yesOrNo}`); -}); diff --git a/DevGrants/Kimberly_devGrant/style.css b/DevGrants/Kimberly_devGrant/style.css deleted file mode 100644 index 2b1c6fefb..000000000 --- a/DevGrants/Kimberly_devGrant/style.css +++ /dev/null @@ -1,197 +0,0 @@ -* { - padding: 10px; - margin: 0; - box-sizing: border-box; - list-style: none; - text-decoration: none; - font-family: "Josefin Sans", sans-serif; - border: none; - outline: none; -} - -body { - display: flex; - align-items: center; - justify-content: space-around; - flex-direction: column; - min-height: 100vh; - background-color: mediumslateblue; -} - -.container { - border: 1px solid #fff; - width: auto; - border-radius: 5px; - box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 28px, - rgba(0, 0, 0, 0.22) 0px 10px 10px; -} - -.first { - padding: 1px; - font-size: 18px; - display: flex; - justify-content: space-between; - align-items: center; -} - -.first h4 { - font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, - Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif; - text-decoration: underline; - font-size: 20px; - font-weight: 800; - text-transform: capitalize; - color: transparent; -} - -.first ::placeholder { - color: rgba(128, 128, 128, 0.407); - font-size: 20px; -} - -.first button { - margin-left: 120px; - background-color: transparent; - font-size: 12px; - letter-spacing: 2px; - font-weight: bold; - color: #fff; - width: 140px; - padding: 10px; - font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; - font-weight: 600; - border: 1px solid #fff; - border-radius: 3px; - box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 28px, - rgba(0, 0, 0, 0.22) 0px 10px 10px; -} - -.second { - padding: 25px; - margin-left: -20px; - width: 83%; -} - -.second ::placeholder { - padding: 10px; - letter-spacing: 2px; - color: #000; - font-weight: 600; - text-transform: capitalize; -} - -.second input { - /* background-color: darkslategrey; */ - margin-left: 10px; - color: #000; - border-radius: 3px; - width: 100%; - height: 30px; - border: 1px solid gray; - box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 28px, - rgba(0, 0, 0, 0.22) 0px 10px 10px; -} - -.sec-ond { - /* margin-bottom: 10px; - margin-top: -16px; */ - margin: -16px 5px 10px 4px; - width: 40%; -} - -.sec-ond ::placeholder { - color: #000; - padding: 10px; - letter-spacing: 2px; - font-weight: 600; - text-transform: capitalize; -} - -.sec-ond input { - /* margin-left: 4px; */ - /* background-color: darkslategrey; */ - color: #000; - border-radius: 3px; - width: 100%; - height: 30px; - border: 1px solid gray; - box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 28px, - rgba(0, 0, 0, 0.22) 0px 10px 10px; -} - -.third { - padding: 40px; - margin-left: 10px; - margin-right: 10px; - border: 1px solid; - background-color: rgba(124, 104, 238, 0.39); - border-radius: 5px; - border: 1px solid #fff; - /* box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 28px, - rgba(0, 0, 0, 0.22) 0px 10px 10px; */ -} - -.third h4 { - display: flex; - color: #fff; - text-transform: uppercase; - justify-content: center; - letter-spacing: 2px; - font-family: fantasy; - font-size: 20px; - font-weight: bold; -} - -.rand-btn { - padding: 20px; - margin-left: 40px; - margin-right: 60px; - display: flex; - justify-content: space-between; -} - -.rand-btn input { - background-color: #000; - color: #fff; - font-weight: 800; - font-size: 11px; - width: 100px; - padding: 7px; - border: none; - border-radius: 5px; - font-weight: bolder; - box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 28px, - rgba(0, 0, 0, 0.22) 0px 10px 10px; -} - -.rand-btn .true { - border: 1px solid #fff; - background-color: transparent; - color: #fff; -} -.rand-btn .false { - border: 1px solid #fff; - background-color: transparent; - color: #fff; -} - -.submit { - padding: 20px; - display: flex; - justify-content: center; - align-items: center; -} - -.submit input { - width: 200px; - padding: 10px; - border: 1px solid #fff; - border-radius: 5px; - font-size: 15px; - font-weight: 800; - background-color: rgba(91, 50, 206, 0.578); - color: #fff; - letter-spacing: 2px; - box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 28px, - rgba(0, 0, 0, 0.22) 0px 10px 10px; -} From dcf3ba6c5bf46968796829348a7a457fc854a496 Mon Sep 17 00:00:00 2001 From: Kimberly900 <96483053+Kimberly900@users.noreply.github.com> Date: Wed, 22 Dec 2021 12:54:22 +0100 Subject: [PATCH 3/3] Add files via upload Choice coin voting form with Algowallet integration --- DevGrants/kimberly9900_grant/index.html | 39 +++++ DevGrants/kimberly9900_grant/script.js | 87 +++++++++++ DevGrants/kimberly9900_grant/style.css | 197 ++++++++++++++++++++++++ 3 files changed, 323 insertions(+) create mode 100644 DevGrants/kimberly9900_grant/index.html create mode 100644 DevGrants/kimberly9900_grant/script.js create mode 100644 DevGrants/kimberly9900_grant/style.css diff --git a/DevGrants/kimberly9900_grant/index.html b/DevGrants/kimberly9900_grant/index.html new file mode 100644 index 000000000..23cd713df --- /dev/null +++ b/DevGrants/kimberly9900_grant/index.html @@ -0,0 +1,39 @@ + + + + + + + + +
+
+

Choice-Coin

+ +
+ +
+ +
+
+ +
+ + +
+

Cast your votes.

+
+ +
+ + +
+ +
+ +
+
+ + + + diff --git a/DevGrants/kimberly9900_grant/script.js b/DevGrants/kimberly9900_grant/script.js new file mode 100644 index 000000000..9a1a13ba9 --- /dev/null +++ b/DevGrants/kimberly9900_grant/script.js @@ -0,0 +1,87 @@ +// Retrieve AlgoSigner sdk from the browser +const { AlgoSigner } = window; + +//define the adddresses +const red_address = ""; +const blue_address = ""; + +//Get DOM Elements +const submitBtn = document.querySelector(".submit"); +const connectWallet = document.querySelector(".connect"); +const yes = document.querySelector(".yes-btn"); +const no = document.querySelector(".no-btn"); + +let yesOrNo = ""; +const setValue = (value) => { + yesOrNo = value; +}; +//Function to Connect User's Account +const ConnectAccount = async () => { + //Check if AlgoSigner is installed + if (!AlgoSigner) { + return alert("Please install AlgoSigner"); + } + + //Connect Account if AlgoSigner is installed + await AlgoSigner.connect() + .then((d) => {}) + .catch((e) => console.log("error in connection")); +}; + +// Sign the Transaction +const signTransaction = async (receiver = blue_address) => { + const txn = await AlgoSigner.algod({ + ledger: "TestNet", + path: "/v2/transactions/params", + }) + .then((e) => { + return e; + }) + .catch((e) => console.log("error in algod")); + + //retrieve account details + const account = await AlgoSigner.accounts({ + ledger: "TestNet", + }) + .then((value) => value[0]) + .then((result) => { + const { address } = result; + + return address; + }) + + .catch((e) => console.log("cannot retrieve accounts")); + + //Transaction signature + await AlgoSigner.sign({ + from: account, + to: receiver, + amount: document.querySelector("hi"), + note: "voting", + fee: txn["min-fee"], + }) + .then(() => console.log("complete")) + .catch((e) => console.log("error", e)); +}; + +connectWallet.addEventListener("click", async (e) => { + await ConnectAccount(); + connectWallet.value = "Connected"; +}); + +submitBtn.addEventListener("click", (e) => { + console.log("welcome user"); + + //checks to see if the user click an option + if (!yesOrNo) { + alert("Please click either yes or no"); + return; + } + if (yesOrNo == "Yes") { + signTransaction(blue_address); + } + if (yesOrNo == "No") { + signTransaction(red_address); + } + alert(`Transaction successful in successful in ${yesOrNo}`); +}); diff --git a/DevGrants/kimberly9900_grant/style.css b/DevGrants/kimberly9900_grant/style.css new file mode 100644 index 000000000..2b1c6fefb --- /dev/null +++ b/DevGrants/kimberly9900_grant/style.css @@ -0,0 +1,197 @@ +* { + padding: 10px; + margin: 0; + box-sizing: border-box; + list-style: none; + text-decoration: none; + font-family: "Josefin Sans", sans-serif; + border: none; + outline: none; +} + +body { + display: flex; + align-items: center; + justify-content: space-around; + flex-direction: column; + min-height: 100vh; + background-color: mediumslateblue; +} + +.container { + border: 1px solid #fff; + width: auto; + border-radius: 5px; + box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 28px, + rgba(0, 0, 0, 0.22) 0px 10px 10px; +} + +.first { + padding: 1px; + font-size: 18px; + display: flex; + justify-content: space-between; + align-items: center; +} + +.first h4 { + font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, + Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif; + text-decoration: underline; + font-size: 20px; + font-weight: 800; + text-transform: capitalize; + color: transparent; +} + +.first ::placeholder { + color: rgba(128, 128, 128, 0.407); + font-size: 20px; +} + +.first button { + margin-left: 120px; + background-color: transparent; + font-size: 12px; + letter-spacing: 2px; + font-weight: bold; + color: #fff; + width: 140px; + padding: 10px; + font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; + font-weight: 600; + border: 1px solid #fff; + border-radius: 3px; + box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 28px, + rgba(0, 0, 0, 0.22) 0px 10px 10px; +} + +.second { + padding: 25px; + margin-left: -20px; + width: 83%; +} + +.second ::placeholder { + padding: 10px; + letter-spacing: 2px; + color: #000; + font-weight: 600; + text-transform: capitalize; +} + +.second input { + /* background-color: darkslategrey; */ + margin-left: 10px; + color: #000; + border-radius: 3px; + width: 100%; + height: 30px; + border: 1px solid gray; + box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 28px, + rgba(0, 0, 0, 0.22) 0px 10px 10px; +} + +.sec-ond { + /* margin-bottom: 10px; + margin-top: -16px; */ + margin: -16px 5px 10px 4px; + width: 40%; +} + +.sec-ond ::placeholder { + color: #000; + padding: 10px; + letter-spacing: 2px; + font-weight: 600; + text-transform: capitalize; +} + +.sec-ond input { + /* margin-left: 4px; */ + /* background-color: darkslategrey; */ + color: #000; + border-radius: 3px; + width: 100%; + height: 30px; + border: 1px solid gray; + box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 28px, + rgba(0, 0, 0, 0.22) 0px 10px 10px; +} + +.third { + padding: 40px; + margin-left: 10px; + margin-right: 10px; + border: 1px solid; + background-color: rgba(124, 104, 238, 0.39); + border-radius: 5px; + border: 1px solid #fff; + /* box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 28px, + rgba(0, 0, 0, 0.22) 0px 10px 10px; */ +} + +.third h4 { + display: flex; + color: #fff; + text-transform: uppercase; + justify-content: center; + letter-spacing: 2px; + font-family: fantasy; + font-size: 20px; + font-weight: bold; +} + +.rand-btn { + padding: 20px; + margin-left: 40px; + margin-right: 60px; + display: flex; + justify-content: space-between; +} + +.rand-btn input { + background-color: #000; + color: #fff; + font-weight: 800; + font-size: 11px; + width: 100px; + padding: 7px; + border: none; + border-radius: 5px; + font-weight: bolder; + box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 28px, + rgba(0, 0, 0, 0.22) 0px 10px 10px; +} + +.rand-btn .true { + border: 1px solid #fff; + background-color: transparent; + color: #fff; +} +.rand-btn .false { + border: 1px solid #fff; + background-color: transparent; + color: #fff; +} + +.submit { + padding: 20px; + display: flex; + justify-content: center; + align-items: center; +} + +.submit input { + width: 200px; + padding: 10px; + border: 1px solid #fff; + border-radius: 5px; + font-size: 15px; + font-weight: 800; + background-color: rgba(91, 50, 206, 0.578); + color: #fff; + letter-spacing: 2px; + box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 28px, + rgba(0, 0, 0, 0.22) 0px 10px 10px; +}