From b0590239f27510cc7988e7bd650bd5de77357fc2 Mon Sep 17 00:00:00 2001
From: XFT-dev <XFT-DEV@Offshit>
Date: Wed, 7 Apr 2021 18:23:39 +0300
Subject: [PATCH] finalizing the repo
---
frontend/Shifting/Shift.html | 200 ++++++
frontend/Shifting/faucet.html | 120 ++++
frontend/Shifting/mini.css | 1105 +++++++++++++++++++++++++++++++++
3 files changed, 1425 insertions(+)
create mode 100644 frontend/Shifting/Shift.html
create mode 100644 frontend/Shifting/faucet.html
create mode 100644 frontend/Shifting/mini.css
diff --git a/frontend/Shifting/Shift.html b/frontend/Shifting/Shift.html
new file mode 100644
index 0000000..2e3e40f
--- /dev/null
+++ b/frontend/Shifting/Shift.html
@@ -0,0 +1,200 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+ <meta charset="UTF-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <title>Shift</title>
+ <script src="https://cdn.jsdelivr.net/npm/web3@latest/dist/web3.min.js"></script>
+ <link href="./mini.css" rel="stylesheet">
+</head>
+<body><div id="main" class="">
+ <div class="min-h-screen bg-gradient-to-r from-purple-400 via-pink-500 to-red-500 py-6 flex flex-col justify-center sm:py-12 text-white dark:bg-gradient-to-r dark:from-gray-800 dark:to-gray-900">
+ <div class="dark:bg-gray-800 dark:text-white w-full mx-auto rounded-3xl shadow-lg bg-white px-10 pt-16 pb-10 text-gray-600" style="max-width: 400px" x-data="app()">
+ <div class="overflow-hidden relative mb-10">
+ <div class="font-semibold text-center text-2xl mb-4 text-gray-900 dark:text-white">Shift</div>
+ <div class="container mx-auto mb-1 pt-8">
+ <p class="mx-auto mb-3 text-purple-500 dark:text-pink-500">Amount</p>
+ <input id="amount" class="dark:border-gray-800 focus:ring-2 dark:bg-gray-600 shadow appearance-none border rounded py-2 px-10 text-grey-darker">
+ </div>
+ <div class="relative inline-flex mt-7">
+ <svg class="w-2 h-2 absolute top-0 right-0 m-4 pointer-events-none" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 412 232"><path d="M206 171.144L42.678 7.822c-9.763-9.763-25.592-9.763-35.355 0-9.763 9.764-9.763 25.592 0 35.355l181 181c4.88 4.882 11.279 7.323 17.677 7.323s12.796-2.441 17.678-7.322l181-181c9.763-9.764 9.763-25.592 0-35.355-9.763-9.763-25.592-9.763-35.355 0L206 171.144z" fill="#648299" fill-rule="nonzero"/></svg>
+ <select id="aggregator1" class="dark:border-gray-800 focus:ring-2 dark:bg-gray-600 dark:text-white border border-gray-300 rounded text-gray-600 h-10 pl-20 pr-20 bg-white hover:border-gray-400 focus:outline-none appearance-none">
+ <option>Choose an asset</option>
+ <option value="0xab4a352ac35dFE83221220D967Db41ee61A0DeFa" selected="">[XFT] Offshift</option><option value="0xECe365B379E1dD183B20fc5f022230C044d51404">[BTC] Bitcoin</option><option value="0x81570059A0cb83888f1459Ec66Aad1Ac16730243">[XAU] Gold</option><option value="0xd8bD0a1cB028a31AA859A21A3758685a95dE4623">[LINK] ChainLink</option></select>
+ </select>
+ </div>
+ <div class="container text-center pt-5">
+ <h1>TO </h1>
+ </div>
+ <div class="relative inline-flex mt-7">
+ <svg class="w-2 h-2 absolute top-0 right-0 m-4 pointer-events-none" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 412 232"><path d="M206 171.144L42.678 7.822c-9.763-9.763-25.592-9.763-35.355 0-9.763 9.764-9.763 25.592 0 35.355l181 181c4.88 4.882 11.279 7.323 17.677 7.323s12.796-2.441 17.678-7.322l181-181c9.763-9.764 9.763-25.592 0-35.355-9.763-9.763-25.592-9.763-35.355 0L206 171.144z" fill="#648299" fill-rule="nonzero"/></svg>
+ <select id="aggregator2" class="dark:border-gray-800 focus:ring-2 dark:bg-gray-600 dark:text-white border border-gray-300 rounded text-gray-600 h-10 pl-20 pr-20 bg-white hover:border-gray-400 focus:outline-none appearance-none">
+ <option>Choose an asset</optaion>
+ <option value="0xab4a352ac35dFE83221220D967Db41ee61A0DeFa" selected="">[XFT] Offshift</option><option value="0xECe365B379E1dD183B20fc5f022230C044d51404">[BTC] Bitcoin</option><option value="0x81570059A0cb83888f1459Ec66Aad1Ac16730243">[XAU] Gold</option><option value="0xd8bD0a1cB028a31AA859A21A3758685a95dE4623">[LINK] ChainLink</option></select>
+ </select>
+ </div>
+ <div>
+ </div>
+ <div class="container w-full pt-8">
+ <button onclick="approve()" class="dark:bg-gradient-to-r dark:from-purple-800 mb-auto px-7 py-3 shadow-md no-underline rounded-full bg-gradient-to-r from-green-400 to-blue-500 hover:from-pink-500 hover:to-yellow-500 text-white font-sans font-semibold text-xl border-blue btn-primary hover:text-white hover:bg-blue-light focus:outline-none active:shadow-none mr-2">Approve</button>
+ <button onclick="shifter()" class="dark:bg-gradient-to-r dark:from-purple-800 mb-auto px-11 py-3 md:ml-6 sm:ml-4 shadow-md no-underline rounded-full bg-gradient-to-r from-green-400 to-blue-500 hover:from-pink-500 hover:to-yellow-500 text-white font-sans font-semibold text-xl border-blue btn-primary hover:text-white hover:bg-blue-light focus:outline-none active:shadow-none mr-2">Shift</button>
+ </div>
+ </div>
+ <div class="absolute bottom-4 right-3">
+ <button id="mode" onclick="changeMode();" class="mb-auto px-3 py-2 shadow-md no-underline rounded-full bg-gradient-to-r from-green-400 to-blue-500 hover:from-pink-500 hover:to-yellow-500 text-white font-sans font-semibold text-xs border-blue btn-primary hover:text-white hover:bg-blue-light focus:outline-none active:shadow-none mr-2 dark:bg-gradient-to-r dark:from-purple-800">switch theme</button>
+ </div>
+ </div>
+ </div>
+</body>
+<script>
+ ethereum.request({ method: 'eth_requestAccounts' });
+ web3 = new Web3(window.ethereum);
+ web3.eth.getAccounts(async function(error, accounts) {
+ web3.eth.accounts = accounts;
+ web3.eth.defaultAccount = accounts[0];
+ });
+
+ let shift = new web3.eth.Contract([{
+ "inputs": [
+ {
+ "internalType": "address",
+ "name": "_tokenA",
+ "type": "address"
+ },
+ {
+ "internalType": "address",
+ "name": "_tokenB",
+ "type": "address"
+ }
+ ],
+ "stateMutability": "nonpayable",
+ "type": "constructor"
+ },
+ {
+ "anonymous": false,
+ "inputs": [
+ {
+ "indexed": false,
+ "internalType": "uint256",
+ "name": "value",
+ "type": "uint256"
+ }
+ ],
+ "name": "Shifted",
+ "type": "event"
+ },
+ {
+ "inputs": [
+ {
+ "internalType": "uint256",
+ "name": "amount",
+ "type": "uint256"
+ },
+ {
+ "internalType": "address",
+ "name": "tA",
+ "type": "address"
+ },
+ {
+ "internalType": "address",
+ "name": "tB",
+ "type": "address"
+ }
+ ],
+ "name": "shift",
+ "outputs": [],
+ "stateMutability": "nonpayable",
+ "type": "function"
+ }], "0x6bE4C94052BF34e09d67C255D9Fe564c5abd4f95");
+
+ let tokenA = new web3.eth.Contract([{
+ "inputs": [],
+ "stateMutability": "nonpayable",
+ "type": "constructor"
+ },
+ {
+ "inputs": [{
+ "internalType": "address",
+ "name": "spender",
+ "type": "address"
+ },
+ {
+ "internalType": "uint256",
+ "name": "amount",
+ "type": "uint256"
+ }
+ ],
+ "name": "approve",
+ "outputs": [{
+ "internalType": "bool",
+ "name": "",
+ "type": "bool"
+ }],
+ "stateMutability": "nonpayable",
+ "type": "function"
+ },
+ {
+ "inputs": [{
+ "internalType": "address",
+ "name": "owner",
+ "type": "address"
+ },
+ {
+ "internalType": "address",
+ "name": "spender",
+ "type": "address"
+ }
+ ],
+ "name": "allowance",
+ "outputs": [{
+ "internalType": "uint256",
+ "name": "",
+ "type": "uint256"
+ }],
+ "stateMutability": "view",
+ "type": "function"
+ }
+ ], "0x1190fb1B00D20656549cdFF689E55D072BA764f3");
+
+ async function approve() {
+ let amount = document.getElementById("amount").value;
+ amount = web3.utils.toWei(parseFloat(amount).toString(),'ether');
+ if (amount => 0) {
+ let approvalAmount;
+ tokenA.methods.allowance(ethereum.selectedAddress, shift._address).call({from: ethereum.selectedAddress}).then(data => approvalAmount = data);
+ if (approvalAmount >= amount) {
+ alert("already approved");
+ } else {
+ tokenA.methods.approve(shift._address, amount).send({from: ethereum.selectedAddress}).then();
+ }
+ } else {
+ alert("input a number");
+ }
+ }
+
+ function shifter() {
+ let amount = document.getElementById("amount").value;
+ let A_aggregator = document.getElementById("aggregator2").value;
+ let B_aggregator = document.getElementById("aggregator1").value;
+
+ amount = web3.utils.toWei(parseFloat(amount).toString(),'ether');
+ if (amount > 0) {
+ shift.methods.shift(amount, A_aggregator, B_aggregator).send({from: ethereum.selectedAddress}).then("amount shifted successfuly ");
+ }
+ }
+
+ function changeMode() {
+ document.getElementById("mode").innerText.replace("www")
+ if (localStorage.theme != 'dark'){
+ localStorage.theme = 'dark';
+ document.getElementById("main").classList.add("dark");
+ document.getElementById("mode").textContent = "Dark mode";
+ }else {
+ localStorage.theme = 'light';
+ document.getElementById("main").classList.remove("dark");
+ document.getElementById("mode").textContent = "Light mode";
+ }
+ }
+ changeMode();
+ </script>
+</html>
\ No newline at end of file
diff --git a/frontend/Shifting/faucet.html b/frontend/Shifting/faucet.html
new file mode 100644
index 0000000..b182e08
--- /dev/null
+++ b/frontend/Shifting/faucet.html
@@ -0,0 +1,120 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+ <meta charset="UTF-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta property="og:locale" content="en_US">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Offshift">
+ <meta property="og:description" content="Anonymous alternative to
+ centralized, fiat-backed stablecoins">
+ <meta property="og:url" content="https://offshift.io/">
+ <meta property="og:site_name" content="Offshift">
+ <meta property="article:modified_time" content="2020-08-11T09:10:25+00:00">
+ <meta property="og:image" content="https://offshift.io/wp-content/uploads/2020/07/Thumb.jpg">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <title>Faucet</title>
+ <link href="./mini.css" rel="stylesheet">
+ <script src="https://cdn.jsdelivr.net/npm/web3@latest/dist/web3.min.js"></script>
+</head>
+<body>
+ <div id="main" class="">
+ <div class="dark:bg-gradient-to-r dark:from-gray-800 dark:to-gray-900 min-h-screen bg-gradient-to-r from-purple-400 via-pink-500 to-red-500 py-6 flex flex-col justify-center sm:py-12 text-white">
+ <div class="dark:bg-gray-800 dark:text-white w-full mx-auto rounded-3xl shadow-lg bg-white px-10 pt-16 pb-10 text-gray-600" style="max-width: 400px" x-data="app()">
+ <div class="overflow-hidden relative mb-10">
+ <div class="font-semibold text-center text-2xl mb-4 text-gray-900 dark:text-white">TESTNET FAUCET</div>
+ <div class="container w-full pt-8">
+ <button onclick="faucet();" class="dark:bg-gradient-to-r dark:from-purple-800 ml-12 px-7 py-3 shadow-md no-underline rounded-full bg-gradient-to-r from-green-400 to-blue-500 hover:from-pink-500 hover:to-yellow-500 text-white font-sans font-semibold text-xl border-blue btn-primary hover:text-white hover:bg-blue-light focus:outline-none active:shadow-none mr-2">xftT(testnet) faucet</button>
+ </div>
+ </div>
+ </div>
+ <div class="absolute bottom-4 right-3">
+ <button id="mode" onclick="changeMode();" class="mb-auto px-3 py-2 shadow-md no-underline rounded-full bg-gradient-to-r from-green-400 to-blue-500 hover:from-pink-500 hover:to-yellow-500 text-white font-sans font-semibold text-xs border-blue btn-primary hover:text-white hover:bg-blue-light focus:outline-none active:shadow-none mr-2 dark:bg-gradient-to-r dark:from-purple-800">dark mode</button>
+ </div>
+ </div>
+ </div>
+</body>
+<script>
+ ethereum.request({ method: 'eth_requestAccounts' });
+ web3 = new Web3(window.ethereum);
+ web3.eth.getAccounts(async function(error, accounts) {
+ web3.eth.accounts = accounts;
+ web3.eth.defaultAccount = accounts[0];
+ });
+
+ web3.eth.getAccounts(function(error, accounts) {
+ web3.eth.defaultAccount = accounts[0];
+ })
+
+ shift = new web3.eth.Contract([
+ {
+ "inputs": [
+ {
+ "internalType": "address",
+ "name": "_tokenA",
+ "type": "address"
+ },
+ {
+ "internalType": "address",
+ "name": "_tokenB",
+ "type": "address"
+ }
+ ],
+ "stateMutability": "nonpayable",
+ "type": "constructor"
+ },
+ {
+ "anonymous": false,
+ "inputs": [
+ {
+ "indexed": false,
+ "internalType": "uint256",
+ "name": "value",
+ "type": "uint256"
+ }
+ ],
+ "name": "Shifted",
+ "type": "event"
+ },
+ {
+ "inputs": [],
+ "name": "faucet",
+ "outputs": [],
+ "stateMutability": "payable",
+ "type": "function"
+ },
+ {
+ "inputs": [
+ {
+ "internalType": "uint256",
+ "name": "amount",
+ "type": "uint256"
+ }
+ ],
+ "name": "shift",
+ "outputs": [],
+ "stateMutability": "nonpayable",
+ "type": "function"
+ }
+ ], "0x6bE4C94052BF34e09d67C255D9Fe564c5abd4f95");
+ function faucet() {
+ shift.methods.faucet().send({from: ethereum.selectedAddress}).then();
+ }
+
+
+ function changeMode() {
+ if (localStorage.theme != 'dark'){
+ localStorage.theme = 'dark';
+ document.getElementById("main").classList.add("dark");
+ document.getElementById("mode").textContent = "Dark mode";
+ }else {
+ localStorage.theme = 'light';
+ document.getElementById("main").classList.remove("dark");
+ document.getElementById("mode").textContent = "Light mode";
+ }
+ }
+ changeMode();
+ </script>
+</html>
+
\ No newline at end of file
diff --git a/frontend/Shifting/mini.css b/frontend/Shifting/mini.css
new file mode 100644
index 0000000..c017422
--- /dev/null
+++ b/frontend/Shifting/mini.css
@@ -0,0 +1,1105 @@
+/*! tailwindcss v2.0.3 | MIT License | https://tailwindcss.com */
+
+/*! modern-normalize v1.0.0 | MIT License | https://github.com/sindresorhus/modern-normalize */
+
+/*
+Document
+========
+*/
+
+/**
+Use a better box model (opinionated).
+*/
+
+*,
+*::before,
+*::after {
+ box-sizing: border-box;
+}
+
+/**
+Use a more readable tab size (opinionated).
+*/
+
+:root {
+ -moz-tab-size: 4;
+ -o-tab-size: 4;
+ tab-size: 4;
+}
+
+/**
+1. Correct the line height in all browsers.
+2. Prevent adjustments of font size after orientation changes in iOS.
+*/
+
+html {
+ line-height: 1.15; /* 1 */
+ -webkit-text-size-adjust: 100%; /* 2 */
+}
+
+/*
+Sections
+========
+*/
+
+/**
+Remove the margin in all browsers.
+*/
+
+body {
+ margin: 0;
+}
+
+/**
+Improve consistency of default fonts in all browsers. (https://github.com/sindresorhus/modern-normalize/issues/3)
+*/
+
+body {
+ font-family:
+ system-ui,
+ -apple-system, /* Firefox supports this but not yet `system-ui` */
+ 'Segoe UI',
+ Roboto,
+ Helvetica,
+ Arial,
+ sans-serif,
+ 'Apple Color Emoji',
+ 'Segoe UI Emoji';
+}
+
+/*
+Grouping content
+================
+*/
+
+/**
+1. Add the correct height in Firefox.
+2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)
+*/
+
+hr {
+ height: 0; /* 1 */
+ color: inherit; /* 2 */
+}
+
+/*
+Text-level semantics
+====================
+*/
+
+/**
+Add the correct text decoration in Chrome, Edge, and Safari.
+*/
+
+abbr[title] {
+ -webkit-text-decoration: underline dotted;
+ text-decoration: underline dotted;
+}
+
+/**
+Add the correct font weight in Edge and Safari.
+*/
+
+b,
+strong {
+ font-weight: bolder;
+}
+
+/**
+1. Improve consistency of default fonts in all browsers. (https://github.com/sindresorhus/modern-normalize/issues/3)
+2. Correct the odd 'em' font sizing in all browsers.
+*/
+
+code,
+kbd,
+samp,
+pre {
+ font-family:
+ ui-monospace,
+ SFMono-Regular,
+ Consolas,
+ 'Liberation Mono',
+ Menlo,
+ monospace; /* 1 */
+ font-size: 1em; /* 2 */
+}
+
+/**
+Add the correct font size in all browsers.
+*/
+
+small {
+ font-size: 80%;
+}
+
+/**
+Prevent 'sub' and 'sup' elements from affecting the line height in all browsers.
+*/
+
+sub,
+sup {
+ font-size: 75%;
+ line-height: 0;
+ position: relative;
+ vertical-align: baseline;
+}
+
+sub {
+ bottom: -0.25em;
+}
+
+sup {
+ top: -0.5em;
+}
+
+/*
+Tabular data
+============
+*/
+
+/**
+1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)
+2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)
+*/
+
+table {
+ text-indent: 0; /* 1 */
+ border-color: inherit; /* 2 */
+}
+
+/*
+Forms
+=====
+*/
+
+/**
+1. Change the font styles in all browsers.
+2. Remove the margin in Firefox and Safari.
+*/
+
+button,
+input,
+optgroup,
+select,
+textarea {
+ font-family: inherit; /* 1 */
+ font-size: 100%; /* 1 */
+ line-height: 1.15; /* 1 */
+ margin: 0; /* 2 */
+}
+
+/**
+Remove the inheritance of text transform in Edge and Firefox.
+1. Remove the inheritance of text transform in Firefox.
+*/
+
+button,
+select { /* 1 */
+ text-transform: none;
+}
+
+/**
+Correct the inability to style clickable types in iOS and Safari.
+*/
+
+button,
+[type='button'] {
+ -webkit-appearance: button;
+}
+
+/**
+Remove the inner border and padding in Firefox.
+*/
+
+/**
+Restore the focus styles unset by the previous rule.
+*/
+
+/**
+Remove the additional ':invalid' styles in Firefox.
+See: https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737
+*/
+
+/**
+Remove the padding so developers are not caught out when they zero out 'fieldset' elements in all browsers.
+*/
+
+legend {
+ padding: 0;
+}
+
+/**
+Add the correct vertical alignment in Chrome and Firefox.
+*/
+
+progress {
+ vertical-align: baseline;
+}
+
+/**
+Correct the cursor style of increment and decrement buttons in Safari.
+*/
+
+/**
+1. Correct the odd appearance in Chrome and Safari.
+2. Correct the outline style in Safari.
+*/
+
+/**
+Remove the inner padding in Chrome and Safari on macOS.
+*/
+
+/**
+1. Correct the inability to style clickable types in iOS and Safari.
+2. Change font properties to 'inherit' in Safari.
+*/
+
+/*
+Interactive
+===========
+*/
+
+/*
+Add the correct display in Chrome and Safari.
+*/
+
+summary {
+ display: list-item;
+}
+
+/**
+ * Manually forked from SUIT CSS Base: https://github.com/suitcss/base
+ * A thin layer on top of normalize.css that provides a starting point more
+ * suitable for web applications.
+ */
+
+/**
+ * Removes the default spacing and border for appropriate elements.
+ */
+
+blockquote,
+dl,
+dd,
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+hr,
+figure,
+p,
+pre {
+ margin: 0;
+}
+
+button {
+ background-color: transparent;
+ background-image: none;
+}
+
+/**
+ * Work around a Firefox/IE bug where the transparent `button` background
+ * results in a loss of the default `button` focus styles.
+ */
+
+button:focus {
+ outline: 1px dotted;
+ outline: 5px auto -webkit-focus-ring-color;
+}
+
+fieldset {
+ margin: 0;
+ padding: 0;
+}
+
+ol,
+ul {
+ list-style: none;
+ margin: 0;
+ padding: 0;
+}
+
+/**
+ * Tailwind custom reset styles
+ */
+
+/**
+ * 1. Use the user's configured `sans` font-family (with Tailwind's default
+ * sans-serif font stack as a fallback) as a sane default.
+ * 2. Use Tailwind's default "normal" line-height so the user isn't forced
+ * to override it to ensure consistency even when using the default theme.
+ */
+
+html {
+ font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; /* 1 */
+ line-height: 1.5; /* 2 */
+}
+
+/**
+ * Inherit font-family and line-height from `html` so users can set them as
+ * a class directly on the `html` element.
+ */
+
+body {
+ font-family: inherit;
+ line-height: inherit;
+}
+
+/**
+ * 1. Prevent padding and border from affecting element width.
+ *
+ * We used to set this in the html element and inherit from
+ * the parent element for everything else. This caused issues
+ * in shadow-dom-enhanced elements like <details> where the content
+ * is wrapped by a div with box-sizing set to `content-box`.
+ *
+ * https://github.com/mozdevs/cssremedy/issues/4
+ *
+ *
+ * 2. Allow adding a border to an element by just adding a border-width.
+ *
+ * By default, the way the browser specifies that an element should have no
+ * border is by setting it's border-style to `none` in the user-agent
+ * stylesheet.
+ *
+ * In order to easily add borders to elements by just setting the `border-width`
+ * property, we change the default border-style for all elements to `solid`, and
+ * use border-width to hide them instead. This way our `border` utilities only
+ * need to set the `border-width` property instead of the entire `border`
+ * shorthand, making our border utilities much more straightforward to compose.
+ *
+ * https://github.com/tailwindcss/tailwindcss/pull/116
+ */
+
+*,
+::before,
+::after {
+ box-sizing: border-box; /* 1 */
+ border-width: 0; /* 2 */
+ border-style: solid; /* 2 */
+ border-color: #e5e7eb; /* 2 */
+}
+
+/*
+ * Ensure horizontal rules are visible by default
+ */
+
+hr {
+ border-top-width: 1px;
+}
+
+/**
+ * Undo the `border-style: none` reset that Normalize applies to images so that
+ * our `border-{width}` utilities have the expected effect.
+ *
+ * The Normalize reset is unnecessary for us since we default the border-width
+ * to 0 on all elements.
+ *
+ * https://github.com/tailwindcss/tailwindcss/issues/362
+ */
+
+img {
+ border-style: solid;
+}
+
+textarea {
+ resize: vertical;
+}
+
+input::-moz-placeholder, textarea::-moz-placeholder {
+ opacity: 1;
+ color: #9ca3af;
+}
+
+input:-ms-input-placeholder, textarea:-ms-input-placeholder {
+ opacity: 1;
+ color: #9ca3af;
+}
+
+input::placeholder,
+textarea::placeholder {
+ opacity: 1;
+ color: #9ca3af;
+}
+
+button {
+ cursor: pointer;
+}
+
+table {
+ border-collapse: collapse;
+}
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+ font-size: inherit;
+ font-weight: inherit;
+}
+
+/**
+ * Reset links to optimize for opt-in styling instead of
+ * opt-out.
+ */
+
+a {
+ color: inherit;
+ text-decoration: inherit;
+}
+
+/**
+ * Reset form element properties that are easy to forget to
+ * style explicitly so you don't inadvertently introduce
+ * styles that deviate from your design system. These styles
+ * supplement a partial reset that is already applied by
+ * normalize.css.
+ */
+
+button,
+input,
+optgroup,
+select,
+textarea {
+ padding: 0;
+ line-height: inherit;
+ color: inherit;
+}
+
+/**
+ * Use the configured 'mono' font family for elements that
+ * are expected to be rendered with a monospace font, falling
+ * back to the system monospace stack if there is no configured
+ * 'mono' font family.
+ */
+
+pre,
+code,
+kbd,
+samp {
+ font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
+}
+
+/**
+ * Make replaced elements `display: block` by default as that's
+ * the behavior you want almost all of the time. Inspired by
+ * CSS Remedy, with `svg` added as well.
+ *
+ * https://github.com/mozdevs/cssremedy/issues/14
+ */
+
+img,
+svg,
+video,
+canvas,
+audio,
+iframe,
+embed,
+object {
+ display: block;
+ vertical-align: middle;
+}
+
+/**
+ * Constrain images and videos to the parent width and preserve
+ * their instrinsic aspect ratio.
+ *
+ * https://github.com/mozdevs/cssremedy/issues/14
+ */
+
+img,
+video {
+ max-width: 100%;
+ height: auto;
+}
+
+.container {
+ width: 100%;
+}
+
+@media (min-width: 640px) {
+ .container {
+ max-width: 640px;
+ }
+}
+
+@media (min-width: 768px) {
+ .container {
+ max-width: 768px;
+ }
+}
+
+@media (min-width: 1024px) {
+ .container {
+ max-width: 1024px;
+ }
+}
+
+@media (min-width: 1280px) {
+ .container {
+ max-width: 1280px;
+ }
+}
+
+@media (min-width: 1536px) {
+ .container {
+ max-width: 1536px;
+ }
+}
+
+.appearance-none {
+ -webkit-appearance: none;
+ -moz-appearance: none;
+ appearance: none;
+}
+
+.bg-white {
+ --tw-bg-opacity: 1;
+ background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
+}
+
+.bg-gray-200 {
+ --tw-bg-opacity: 1;
+ background-color: rgba(229, 231, 235, var(--tw-bg-opacity));
+}
+
+.dark .dark\:bg-gray-600 {
+ --tw-bg-opacity: 1;
+ background-color: rgba(75, 85, 99, var(--tw-bg-opacity));
+}
+
+.dark .dark\:bg-gray-700 {
+ --tw-bg-opacity: 1;
+ background-color: rgba(55, 65, 81, var(--tw-bg-opacity));
+}
+
+.dark .dark\:bg-gray-800 {
+ --tw-bg-opacity: 1;
+ background-color: rgba(31, 41, 55, var(--tw-bg-opacity));
+}
+
+.dark .dark\:bg-purple-600 {
+ --tw-bg-opacity: 1;
+ background-color: rgba(124, 58, 237, var(--tw-bg-opacity));
+}
+
+.bg-gradient-to-r {
+ background-image: linear-gradient(to right, var(--tw-gradient-stops));
+}
+
+.from-green-400 {
+ --tw-gradient-from: #34d399;
+ --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(52, 211, 153, 0));
+}
+
+.from-purple-400 {
+ --tw-gradient-from: #a78bfa;
+ --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(167, 139, 250, 0));
+}
+
+.from-pink-500 {
+ --tw-gradient-from: #ec4899;
+ --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(236, 72, 153, 0));
+}
+
+.via-pink-500 {
+ --tw-gradient-stops: var(--tw-gradient-from), #ec4899, var(--tw-gradient-to, rgba(236, 72, 153, 0));
+}
+
+.to-red-500 {
+ --tw-gradient-to: #ef4444;
+}
+
+.to-blue-500 {
+ --tw-gradient-to: #3b82f6;
+}
+
+.to-purple-400 {
+ --tw-gradient-to: #a78bfa;
+}
+
+.hover\:from-pink-500:hover {
+ --tw-gradient-from: #ec4899;
+ --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(236, 72, 153, 0));
+}
+
+.hover\:to-yellow-500:hover {
+ --tw-gradient-to: #f59e0b;
+}
+
+.dark .dark\:from-gray-800 {
+ --tw-gradient-from: #1f2937;
+ --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(31, 41, 55, 0));
+}
+
+.dark .dark\:from-purple-800 {
+ --tw-gradient-from: #5b21b6;
+ --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(91, 33, 182, 0));
+}
+
+.dark .dark\:to-gray-900 {
+ --tw-gradient-to: #111827;
+}
+
+.dark .dark\:to-blue-500 {
+ --tw-gradient-to: #3b82f6;
+}
+
+.border-gray-300 {
+ --tw-border-opacity: 1;
+ border-color: rgba(209, 213, 219, var(--tw-border-opacity));
+}
+
+.hover\:border-gray-400:hover {
+ --tw-border-opacity: 1;
+ border-color: rgba(156, 163, 175, var(--tw-border-opacity));
+}
+
+.dark .dark\:border-gray-800 {
+ --tw-border-opacity: 1;
+ border-color: rgba(31, 41, 55, var(--tw-border-opacity));
+}
+
+.rounded {
+ border-radius: 0.25rem;
+}
+
+.rounded-3xl {
+ border-radius: 1.5rem;
+}
+
+.rounded-full {
+ border-radius: 9999px;
+}
+
+.border {
+ border-width: 1px;
+}
+
+.flex {
+ display: flex;
+}
+
+.inline-flex {
+ display: inline-flex;
+}
+
+.table {
+ display: table;
+}
+
+.flex-col {
+ flex-direction: column;
+}
+
+.justify-center {
+ justify-content: center;
+}
+
+.font-sans {
+ font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
+}
+
+.font-semibold {
+ font-weight: 600;
+}
+
+.h-2 {
+ height: 0.5rem;
+}
+
+.h-3 {
+ height: 0.75rem;
+}
+
+.h-10 {
+ height: 2.5rem;
+}
+
+.h-full {
+ height: 100%;
+}
+
+.text-xs {
+ font-size: 0.75rem;
+ line-height: 1rem;
+}
+
+.text-base {
+ font-size: 1rem;
+ line-height: 1.5rem;
+}
+
+.text-xl {
+ font-size: 1.25rem;
+ line-height: 1.75rem;
+}
+
+.text-2xl {
+ font-size: 1.5rem;
+ line-height: 2rem;
+}
+
+.m-4 {
+ margin: 1rem;
+}
+
+.mx-auto {
+ margin-left: auto;
+ margin-right: auto;
+}
+
+.mb-1 {
+ margin-bottom: 0.25rem;
+}
+
+.mr-2 {
+ margin-right: 0.5rem;
+}
+
+.mb-2 {
+ margin-bottom: 0.5rem;
+}
+
+.ml-2 {
+ margin-left: 0.5rem;
+}
+
+.mb-3 {
+ margin-bottom: 0.75rem;
+}
+
+.mb-4 {
+ margin-bottom: 1rem;
+}
+
+.ml-6 {
+ margin-left: 1.5rem;
+}
+
+.mt-7 {
+ margin-top: 1.75rem;
+}
+
+.mb-10 {
+ margin-bottom: 2.5rem;
+}
+
+.ml-10 {
+ margin-left: 2.5rem;
+}
+
+.ml-12 {
+ margin-left: 3rem;
+}
+
+.mb-auto {
+ margin-bottom: auto;
+}
+
+.max-w-xl {
+ max-width: 36rem;
+}
+
+.min-h-screen {
+ min-height: 100vh;
+}
+
+.focus\:outline-none:focus {
+ outline: 2px solid transparent;
+ outline-offset: 2px;
+}
+
+.overflow-hidden {
+ overflow: hidden;
+}
+
+.py-2 {
+ padding-top: 0.5rem;
+ padding-bottom: 0.5rem;
+}
+
+.py-3 {
+ padding-top: 0.75rem;
+ padding-bottom: 0.75rem;
+}
+
+.px-3 {
+ padding-left: 0.75rem;
+ padding-right: 0.75rem;
+}
+
+.py-6 {
+ padding-top: 1.5rem;
+ padding-bottom: 1.5rem;
+}
+
+.px-7 {
+ padding-left: 1.75rem;
+ padding-right: 1.75rem;
+}
+
+.px-8 {
+ padding-left: 2rem;
+ padding-right: 2rem;
+}
+
+.px-10 {
+ padding-left: 2.5rem;
+ padding-right: 2.5rem;
+}
+
+.px-11 {
+ padding-left: 2.75rem;
+ padding-right: 2.75rem;
+}
+
+.pt-5 {
+ padding-top: 1.25rem;
+}
+
+.pt-8 {
+ padding-top: 2rem;
+}
+
+.pb-10 {
+ padding-bottom: 2.5rem;
+}
+
+.pt-16 {
+ padding-top: 4rem;
+}
+
+.pr-20 {
+ padding-right: 5rem;
+}
+
+.pl-20 {
+ padding-left: 5rem;
+}
+
+.pointer-events-none {
+ pointer-events: none;
+}
+
+.absolute {
+ position: absolute;
+}
+
+.relative {
+ position: relative;
+}
+
+.top-0 {
+ top: 0px;
+}
+
+.right-0 {
+ right: 0px;
+}
+
+.right-3 {
+ right: 0.75rem;
+}
+
+.bottom-4 {
+ bottom: 1rem;
+}
+
+* {
+ --tw-shadow: 0 0 #0000;
+}
+
+.shadow {
+ --tw-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
+ box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
+}
+
+.shadow-md {
+ --tw-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
+ box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
+}
+
+.shadow-lg {
+ --tw-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
+ box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
+}
+
+* {
+ --tw-ring-inset: var(--tw-empty,/*!*/ /*!*/);
+ --tw-ring-offset-width: 0px;
+ --tw-ring-offset-color: #fff;
+ --tw-ring-color: rgba(59, 130, 246, 0.5);
+ --tw-ring-offset-shadow: 0 0 #0000;
+ --tw-ring-shadow: 0 0 #0000;
+}
+
+.focus\:ring-2:focus {
+ --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
+ --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
+ box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
+}
+
+.text-center {
+ text-align: center;
+}
+
+.text-white {
+ --tw-text-opacity: 1;
+ color: rgba(255, 255, 255, var(--tw-text-opacity));
+}
+
+.text-gray-600 {
+ --tw-text-opacity: 1;
+ color: rgba(75, 85, 99, var(--tw-text-opacity));
+}
+
+.text-gray-900 {
+ --tw-text-opacity: 1;
+ color: rgba(17, 24, 39, var(--tw-text-opacity));
+}
+
+.text-purple-500 {
+ --tw-text-opacity: 1;
+ color: rgba(139, 92, 246, var(--tw-text-opacity));
+}
+
+.hover\:text-white:hover {
+ --tw-text-opacity: 1;
+ color: rgba(255, 255, 255, var(--tw-text-opacity));
+}
+
+.dark .dark\:text-white {
+ --tw-text-opacity: 1;
+ color: rgba(255, 255, 255, var(--tw-text-opacity));
+}
+
+.dark .dark\:text-pink-500 {
+ --tw-text-opacity: 1;
+ color: rgba(236, 72, 153, var(--tw-text-opacity));
+}
+
+.no-underline {
+ text-decoration: none;
+}
+
+.w-2 {
+ width: 0.5rem;
+}
+
+.w-40 {
+ width: 10rem;
+}
+
+.w-full {
+ width: 100%;
+}
+
+.transition-all {
+ transition-property: all;
+ transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+ transition-duration: 150ms;
+}
+
+.ease-out {
+ transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
+}
+
+.duration-1000 {
+ transition-duration: 1000ms;
+}
+
+@-webkit-keyframes spin {
+ to {
+ transform: rotate(360deg);
+ }
+}
+
+@keyframes spin {
+ to {
+ transform: rotate(360deg);
+ }
+}
+
+@-webkit-keyframes ping {
+ 75%, 100% {
+ transform: scale(2);
+ opacity: 0;
+ }
+}
+
+@keyframes ping {
+ 75%, 100% {
+ transform: scale(2);
+ opacity: 0;
+ }
+}
+
+@-webkit-keyframes pulse {
+ 50% {
+ opacity: .5;
+ }
+}
+
+@keyframes pulse {
+ 50% {
+ opacity: .5;
+ }
+}
+
+@-webkit-keyframes bounce {
+ 0%, 100% {
+ transform: translateY(-25%);
+ -webkit-animation-timing-function: cubic-bezier(0.8,0,1,1);
+ animation-timing-function: cubic-bezier(0.8,0,1,1);
+ }
+
+ 50% {
+ transform: none;
+ -webkit-animation-timing-function: cubic-bezier(0,0,0.2,1);
+ animation-timing-function: cubic-bezier(0,0,0.2,1);
+ }
+}
+
+@keyframes bounce {
+ 0%, 100% {
+ transform: translateY(-25%);
+ -webkit-animation-timing-function: cubic-bezier(0.8,0,1,1);
+ animation-timing-function: cubic-bezier(0.8,0,1,1);
+ }
+
+ 50% {
+ transform: none;
+ -webkit-animation-timing-function: cubic-bezier(0,0,0.2,1);
+ animation-timing-function: cubic-bezier(0,0,0.2,1);
+ }
+}
+
+@media (min-width: 640px) {
+ .sm\:ml-4 {
+ margin-left: 1rem;
+ }
+
+ .sm\:py-12 {
+ padding-top: 3rem;
+ padding-bottom: 3rem;
+ }
+}
+
+@media (min-width: 768px) {
+ .md\:ml-6 {
+ margin-left: 1.5rem;
+ }
+}
+
+@media (min-width: 1024px) {
+}
+
+@media (min-width: 1280px) {
+}
+
+@media (min-width: 1536px) {
+}
\ No newline at end of file
--
GitLab