diff --git a/asset/Inter/Inter-Black.ttf b/asset/Inter/Inter-Black.ttf new file mode 100644 index 0000000..5aecf7d Binary files /dev/null and b/asset/Inter/Inter-Black.ttf differ diff --git a/asset/Inter/Inter-Bold.ttf b/asset/Inter/Inter-Bold.ttf new file mode 100644 index 0000000..8e82c70 Binary files /dev/null and b/asset/Inter/Inter-Bold.ttf differ diff --git a/asset/Inter/Inter-ExtraBold.ttf b/asset/Inter/Inter-ExtraBold.ttf new file mode 100644 index 0000000..cb4b821 Binary files /dev/null and b/asset/Inter/Inter-ExtraBold.ttf differ diff --git a/asset/Inter/Inter-ExtraLight.ttf b/asset/Inter/Inter-ExtraLight.ttf new file mode 100644 index 0000000..64aee30 Binary files /dev/null and b/asset/Inter/Inter-ExtraLight.ttf differ diff --git a/asset/Inter/Inter-Light.ttf b/asset/Inter/Inter-Light.ttf new file mode 100644 index 0000000..9e265d8 Binary files /dev/null and b/asset/Inter/Inter-Light.ttf differ diff --git a/asset/Inter/Inter-Medium.ttf b/asset/Inter/Inter-Medium.ttf new file mode 100644 index 0000000..b53fb1c Binary files /dev/null and b/asset/Inter/Inter-Medium.ttf differ diff --git a/asset/Inter/Inter-Regular.ttf b/asset/Inter/Inter-Regular.ttf new file mode 100644 index 0000000..8d4eebf Binary files /dev/null and b/asset/Inter/Inter-Regular.ttf differ diff --git a/asset/Inter/Inter-SemiBold.ttf b/asset/Inter/Inter-SemiBold.ttf new file mode 100644 index 0000000..c6aeeb1 Binary files /dev/null and b/asset/Inter/Inter-SemiBold.ttf differ diff --git a/asset/Inter/Inter-Thin.ttf b/asset/Inter/Inter-Thin.ttf new file mode 100644 index 0000000..7aed55d Binary files /dev/null and b/asset/Inter/Inter-Thin.ttf differ diff --git a/pages/_app.tsx b/pages/_app.tsx index 021681f..d7a89e0 100644 --- a/pages/_app.tsx +++ b/pages/_app.tsx @@ -1,6 +1,47 @@ +import localFont from 'next/font/local' import '@/styles/globals.css' import type { AppProps } from 'next/app' +const inter = localFont({ + src: [ + { + path: '../asset/Inter/Inter-Regular.ttf', + weight: '400', + style: 'normal', + }, + { + path: '../asset/Inter/Inter-Medium.ttf', + weight: '500', + style: 'normal', + }, + { + path: '../asset/Inter/Inter-SemiBold.ttf', + weight: '600', + style: 'normal', + }, + { + path: '../asset/Inter/Inter-Bold.ttf', + weight: '700', + style: 'normal', + }, + { + path: '../asset/Inter/Inter-ExtraBold.ttf', + weight: '800', + style: 'normal', + }, + { + path: '../asset/Inter/Inter-Black.ttf', + weight: '900', + style: 'normal', + }, + ], + variable: '--font-inter' +}) + export default function App({ Component, pageProps }: AppProps) { - return + return ( +
+ +
+ ) } diff --git a/pages/index.tsx b/pages/index.tsx index 1701b75..4214c5f 100644 --- a/pages/index.tsx +++ b/pages/index.tsx @@ -4,177 +4,211 @@ const inter = Inter({ subsets: ['latin'] }) export default function Home() { return ( -
-
-
-
logo
-
menu
-
sign in
-
-
+
+
+
+
+ thresholdusd logo +
+ + +
+
-
-

Borrow thUSD against your tBTC

-

First bridge your BTC to tBTC.
Then borrow USD stablecoin with tBTC trustlessly.

-
- - +
+

Borrow thUSD against your tBTC

+

First bridge your BTC to tBTC.
Then borrow USD stablecoin with tBTC trustlessly.

+
+ +
-
-
-
Trades volume
-
$1,649,325,333
-
LAST 24H
-
-
-
Trades volume
-
$1,649,325,333
-
LAST 24H
-
-
-
Trades volume
-
$1,649,325,333
-
LAST 24H
+
+
+
+ Trades volume + $1,649,325,333 + LAST 24H +
+
+ Trades + 499,932 + LAST 24H +
+
+ TVL + $362,325,333 + LAST 24H +
-
-
-
Support of multiple collaterals
-
Support initially tBTC and ETH
-
-
img
+
+
+ Support of multiple collaterals + Supporting initially tBTC and ETH +
+ wavy check
-
Stablecoin backed on 110% collateral ratio
-
The price stability is maintaned by a robust system around the collateral ratio of the backing asset
+ Stablecoin backed on 110% collateral ratio + The price stability is maintaned by a robust system
around the collateral ratio of the backing asset
-
-
img
+
+ wavy check
-
Stablecoin backed on 110% collateral ratio
-
The price stability is maintaned by a robust system around the collateral ratio of the backing asset
+ Censorship resistant + No kyc, no permission required. Base code is immutable
and the protocol is governed by the ThresholdDAO.
-
-
img
+
+ wavy check
-
Stablecoin backed on 110% collateral ratio
-
The price stability is maintaned by a robust system around the collateral ratio of the backing asset
+ Don't trust, verify + The development of the contracts has been done publicly
and can be checked by anyone in Github here
-
- img +
+ collateral tokens
-
-

+

+
+
+

Security By Design

-

+

Alongside to the fact that the base protocol has been derived from Liquity protocol, our modified contracts
are currently being audited by respected 3rd parties companies.

-
-
-
img
-
Contracts being audited
-

Our contracts are undergoing an audit, which will soon be completed +

+
+ audit code icon + Contracts being audited +

Our contracts are undergoing an audit, which will soon be completed allowing for the deployment of mainnet contracts. - +

In the meantime, we invite you to check out our testnet app which is now fully operational and accessible here.

-
-
img
-
Contracts being audited
-

The thUSD stablecoin is backed initially by ETH and tBTC on a collateral ratio of at least 110%. - So users that holds BTC can bridge to tBTC and deposit their tBTC to borrow thUSD directly. +

+ bitcoin icon + A Bitcoin-backed stablecoin +

The thUSD is a USD pegged stablecoin backed initially by ETH and tBTC on a collateral ratio of at least 110%.

So users that holds BTC can firstly bridge to tBTC and after that, deposit their tBTC to borrow thUSD directly.

-
-
img
-
Contracts being audited
-

Our contracts are undergoing an audit, which will soon be completed - allowing for the deployment of mainnet contracts. - - In the meantime, we invite you to check out our testnet app which is now fully operational and accessible here. +

+ stacked coins icon + Be a stability provider +

To ensure that the stablecoin supply remains backed, Vaults that fall under the minimum col. ratio will be liquidated.

The debt of the Vault is cancelled and its collateral distributed among all Stability Providers.

-
-

+

+
+
+

Frequently Asked Questions

-
-
-
img
-
Contracts being audited
-

Our contracts are undergoing an audit, which will soon be completed - allowing for the deployment of mainnet contracts. - - In the meantime, we invite you to check out our testnet app which is now fully operational and accessible here. +

+
+ question mark icon + What is ThresholdUSD? +

+ ThresholdUSD is a decentralized protocol that enables you + to borrow thUSD, a stablecoin soft-pegged against USD + and backed by ETH and tBTC as collaterals with a minimum + collateral ratio of 110%.

-
-
img
-
Contracts being audited
-

The thUSD stablecoin is backed initially by ETH and tBTC on a collateral ratio of at least 110%. - So users that holds BTC can bridge to tBTC and deposit their tBTC to borrow thUSD directly. +

+ question mark icon + What are the key benefits of ThresholdUSD? +

+ Here follows some key benefits of using ThresholUSD: +
+
+ 1. Borrow USD stablecoin with your a backed BTC asset +
+ 2. Stake your thUSD in the BAMM contract natively +
+ 3. Redeem your collateral assets at any time

-
-
-
img
-
Contracts being audited
-

Our contracts are undergoing an audit, which will soon be completed - allowing for the deployment of mainnet contracts. - - In the meantime, we invite you to check out our testnet app which is now fully operational and accessible here. +

+
+ question mark icon + How does it works? +

+ To ensure that the entire stablecoin supply remains fully + backed by collateral, Vaults that fall under the minimum + collateral ratio of 110% will be closed (liquidated). +
+
+ The debt of the Vault is canceled and absorbed by the + Stability Pool and its collateral distributed among Stability + Providers.

-
-
img
-
Contracts being audited
-

The thUSD stablecoin is backed initially by ETH and tBTC on a collateral ratio of at least 110%. - So users that holds BTC can bridge to tBTC and deposit their tBTC to borrow thUSD directly. +

+ question mark icon + Where can I learn more about the protocol? +

+ The technical documentation can be found here.
+ More resources can be found in our Discord server.
+ Stay up-to-date with the most recent news in our + Twitter.

-
-
-
img
-
Contracts being audited
-

- Our contracts are undergoing an audit, which will soon be completed +

+ question mark icon + Full Faqs +

+ For a full list of FAQs, visit our Help Center.

-
-
-
Get Involved
-

We are a project driven by the community and open source. +

+ Get Involved +

We are a project driven by the community and open source.
If you have any feedback, ideas or questions, feel free to drop in and say hello!

-
-
-
img
- Discord +
+
+ discord logo + Discord
-
-
img
- Twitter +
+ twitter logo + Twitter
-
-
img
- Youtube +
+ youtube logo + Youtube
-
+ ) } diff --git a/public/icons/audit-code.svg b/public/icons/audit-code.svg new file mode 100644 index 0000000..943a87a --- /dev/null +++ b/public/icons/audit-code.svg @@ -0,0 +1,6 @@ + + + + + + diff --git a/public/icons/bitcoin.svg b/public/icons/bitcoin.svg new file mode 100644 index 0000000..064eebf --- /dev/null +++ b/public/icons/bitcoin.svg @@ -0,0 +1,10 @@ + + + + + + + + + + diff --git a/public/icons/discord.svg b/public/icons/discord.svg new file mode 100644 index 0000000..5133484 --- /dev/null +++ b/public/icons/discord.svg @@ -0,0 +1,3 @@ + + + diff --git a/public/icons/faq.svg b/public/icons/faq.svg new file mode 100644 index 0000000..af156b9 --- /dev/null +++ b/public/icons/faq.svg @@ -0,0 +1,6 @@ + + + + + + diff --git a/public/icons/note-search.svg b/public/icons/note-search.svg new file mode 100644 index 0000000..9e60e4a --- /dev/null +++ b/public/icons/note-search.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/public/icons/play-circle.svg b/public/icons/play-circle.svg new file mode 100644 index 0000000..2a94a8e --- /dev/null +++ b/public/icons/play-circle.svg @@ -0,0 +1,4 @@ + + + + diff --git a/public/icons/question-mark.svg b/public/icons/question-mark.svg new file mode 100644 index 0000000..cde917e --- /dev/null +++ b/public/icons/question-mark.svg @@ -0,0 +1,4 @@ + + + + diff --git a/public/icons/shield-check.svg b/public/icons/shield-check.svg new file mode 100644 index 0000000..557434e --- /dev/null +++ b/public/icons/shield-check.svg @@ -0,0 +1,4 @@ + + + + diff --git a/public/icons/stacked-coins.svg b/public/icons/stacked-coins.svg new file mode 100644 index 0000000..6b023ac --- /dev/null +++ b/public/icons/stacked-coins.svg @@ -0,0 +1,7 @@ + + + + + + + diff --git a/public/icons/threshold-usd.svg b/public/icons/threshold-usd.svg new file mode 100644 index 0000000..2c3ad49 --- /dev/null +++ b/public/icons/threshold-usd.svg @@ -0,0 +1,10 @@ + + + + + + + + + + diff --git a/public/icons/tokens-cards.svg b/public/icons/tokens-cards.svg new file mode 100644 index 0000000..1d1d854 --- /dev/null +++ b/public/icons/tokens-cards.svg @@ -0,0 +1,70 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/public/icons/twitter.svg b/public/icons/twitter.svg new file mode 100644 index 0000000..62afee3 --- /dev/null +++ b/public/icons/twitter.svg @@ -0,0 +1,3 @@ + + + diff --git a/public/icons/user-circle.svg b/public/icons/user-circle.svg new file mode 100644 index 0000000..0276506 --- /dev/null +++ b/public/icons/user-circle.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/public/icons/wavy-check.svg b/public/icons/wavy-check.svg new file mode 100644 index 0000000..248a5f8 --- /dev/null +++ b/public/icons/wavy-check.svg @@ -0,0 +1,4 @@ + + + + diff --git a/public/icons/youtube.svg b/public/icons/youtube.svg new file mode 100644 index 0000000..34b6344 --- /dev/null +++ b/public/icons/youtube.svg @@ -0,0 +1,4 @@ + + + + diff --git a/styles/globals.css b/styles/globals.css index a14b9a7..febb8e6 100644 --- a/styles/globals.css +++ b/styles/globals.css @@ -25,3 +25,21 @@ body { ) rgb(var(--background-start-rgb)); } + +h1 { + font-size: 4.5rem; + font-weight: 700; + line-height: 4.5rem; +} + +h2 { + font-size: 2.5rem; + font-weight: 700; + line-height: 4.5rem; +} + +h3 { + font-size: 1.6rem; + font-weight: 700; + line-height: 4.5rem; +} diff --git a/tailwind.config.js b/tailwind.config.js index d4dc908..7b70469 100644 --- a/tailwind.config.js +++ b/tailwind.config.js @@ -1,3 +1,7 @@ +// tailwind.config.js +const { fontFamily } = require('tailwindcss/defaultTheme') + + /** @type {import('tailwindcss').Config} */ module.exports = { content: [ @@ -6,12 +10,222 @@ module.exports = { './app/**/*.{js,ts,jsx,tsx}', ], theme: { + colors: { + transparent: '#ffffff00', + beige: '#f3f6e6', + black: '#000000', + blue: '#0052FF', + blue1: '#303442', + blue2: '#2a385f', + blue3: '#34376a', + blue4: '#17171f', + blue5: '#2a304c', + blue6: '#2b2f5b', + blue7: '#5e68ee', + blue8: '#a7a9b9', + blue9: '#595f99', + blue10: '#6481e7', + blue11: '#767fff', + blue12: '#3d406d', + blue13: '#1e2143', + blue14: '#9ea3de', + blue15: '#4b5184', + blue16: '#2d315b', + blue17: '#2f335e', + grey: '#7A7A8F', + grey2: '#D9D9D9', + grey3: '#A4A7BF', + grey4: '#5050500', + pink: '#ff008a', + pink1: '#f7d9e9', + pink2: '#e0719e', + pink3: '#FF008A', + pink4: '#d045fe', + pink5: '#6c385c', + purple: '#7C08F9', + green: '#36bc8c', + green2: '#2ecc94', + green3: '#83eac6', + green4: '#116446', + green5: '#1dffaa', + green6: '#2ae8a4', + green7: '#51bfab', + green8: '#81fd73', + green9: '#60e9d9', + white: '#ffffff', + white1: '#ffffffa3', + red: '#dc3852', + red2: '#f54e5d', + red3: '#fa528e', + red4: '#ff4a60', + red5: '#fa528e70', + yellow: '#ecc01f', + }, + + borderWidth: { + DEFAULT: '1px', + 0: '0', + 0.5: '0.5px', + 2: '2px', + 3: '3px', + 4: '4px', + 6: '6px', + 8: '8px', + }, + + fontSize: { + xxsmallest: '.525rem', + xxsmaller: '.65rem', + xxs: '.7rem', + xs: '.75rem', + ssm: '.8rem', + tinysm: '.845rem', + sm: '.875rem', + tiny: '.875rem', + tinybase: '.94rem', + base: '1rem', + baseg: '1.05rem', + lg: '1.125rem', + xl: '1.25rem', + '2xl': '1.5rem', + '25xl': '1.75rem', + '3xl': '1.875rem', + '4xl': '2.25rem', + '5xl': '3rem', + '6xl': '4rem', + '7xl': '5rem', + }, extend: { - backgroundImage: { - 'gradient-radial': 'radial-gradient(var(--tw-gradient-stops))', - 'gradient-conic': - 'conic-gradient(from 180deg at 50% 50%, var(--tw-gradient-stops))', + zIndex: { + 1: '1', + 2: '2', + 5: '5', + }, + boxShadow: { + purple: '0 0 0 1pt #6e36ff', + blue: '0 0 0 1pt #5f69ef', + }, + outline: { + purple: '1px solid #6e36ff', + blue: '1px solid #232750', + }, + screens: { + smallest: '200px', + small: '320px', + lgg: '1200px', + '1.5xl': '1430px', + }, + maxWidth: { + smallest: '11rem', + xxsmaller: '14rem', + xxs: '15.2rem', + xsmaller: '17.5rem', + xss: '19.5rem', + llg: '30rem', + '55xl': '68rem', + '8xl': '88rem' + }, + maxHeight: { + 76: '19rem', + 80: '20rem', + 102: '30rem', + 110: '38rem', + 112: '42rem', + }, + minHeight: { + 36: '9rem', + }, + width: { + 4.5: '1.12rem', + 5.5: '1.37rem', + 6.25: '1.575rem', + 6.5: '1.65rem', + 7.5: '1.85rem', + '50px': '50px', + 26: '6.5rem', + 46: '11.5rem', + 50: '12.5rem', + 58: '14.5rem', + 100: '28rem', + 104: '29rem', + 112: '31rem', }, + height: { + '3px': '3px', + '4px': '4px', + '4.5px': '4.5px', + '5px': '5px', + '50px': '50px', + 2.25: '0.5625rem', + 2.75: '0.6875rem', + 4.5: '1.12rem', + 5.5: '1.37rem', + 6.5: '1.65rem', + 7.5: '1.85rem', + 18: '4.5rem', + 25: '6.4rem', + 29: '7.2rem', + 30: '7.5rem', + 34: '8.5rem', + 35: '8.71rem', + '36rem': '36rem', + '44rem': '44rem', + }, + borderRadius: { + '100pc': '100%', + }, + lineHeight: { + 'extra-loose': '2.3', + }, + fontSize: { + '1p4': '1.4rem', + x0: '1.20rem', + '2p6': '2.6rem', + x11: '1.35rem', + '25xl': '1.7rem', + xxs: '.8rem', + }, + spacing: { + 0.75: '0.187rem', + '0p2': '0.2rem', + '4p1': '4.1rem', + }, + margin: { + 0.4: '0.1rem', + 0.75: '0.187rem', + 1.1: '0.275rem', + 3.25: '0.8125rem', + 3.75: '0.9375rem', + 4.5: '1.125rem', + 5.25: '1.32rem', + 5.5: '1.375rem', + '-4.': '-1rem', + '-4.5': '-1.125rem', + '-22': '-5.5rem', + '-24': '-6rem', + '-30': '-7.5rem', + '-54': '-13.5rem', + }, + padding: { + 0.25: '0.0625rem', + 1.25: '0.3125rem', + 4.5: '1.125rem', + 15: '3.75rem;', + 23: '5.6rem;', + 5.5: '1.375rem', + 50: '12.5rem', + }, + borderOpacity: { + 15: '0.15', + }, + }, + fontFamily: { + sans: ['var(--font-inter)', ...fontFamily.sans], + }, + backgroundImage: { + 'gradient-radial': 'radial-gradient(var(--tw-gradient-stops))', + 'gradient-conic': + 'conic-gradient(from 180deg at 50% 50%, var(--tw-gradient-stops))', }, }, plugins: [],