Our money, beyond states.
+
+ Decentralized cryptocurrency without the volatility.
+ Borderless, secure, transparent.
- The first Augmint token is A-Euro , targeted to Euro.
-
- Stored securely and decentralised stable crypto tokens are instantly transferable
- worldwide.
-
-
-
-
-
+
+
+
+
+
-
Actually convertible
+
- {feature.image}
+
- {feature.title}
-
-
-
- Great for business
-
-
-
-
- {keyBenefits
- .filter(item => item.type === "business")
- .map(item => (
-
-
- ))}
-
-
-
-
- And for individuals
-
-
-
-
- {keyBenefits
- .filter(item => item.type === "individual")
- .map(item => (
-
-
- ))}
-
-
-
-
-
-
-
-
-
- Augmint loans
-
-
- {howItWorks
- .filter(feature => feature.type === "loan")
- .map(feature => (
-
-
- {feature.title}
-
-
- ))}
-
-
+
+
+
- Buy and sell A-Euro
+
+
+
-
-
- {howItWorks
- .filter(feature => feature.type === "exchange")
- .map(feature => (
-
-
+
-
+ Next-day conversion to and from SEPA
+ bank accounts via exchange partners.
+
{feature.text}
- ))} - - - -
-
- {item.text}
-
-
- {item.text}
-
-
-
-
-
- 1
- Euro
-
-
- 1
- A-EUR
-
- Use your cryptocurrencies without
-
- losing them. Get a loan and spend easily.
-
- {feature.image}
-
- {feature.text}
-
+
+
+ Buy or sell A-EUR instantly on our
+ decentralized crypto exchange.
+
-
-
-
+
+ Have your crypto
+
+
+ Have your crypto
+ and spend it too
+
+ + Borrow A-EUR against your ETH collateral. No waiting for approval. +
+ {/*a className="more-link" href=""> + Learn more + */} + +
- {feature.image}
+
+
+
-
-
- {howItWorks
- .filter(feature => feature.type === "use")
- .map(feature => (
-
-
+
- {feature.title}
-
- How to use your A-Euro
+
+
+
- Crypto-backed loans
+-
+
- + for up to 6 months at + +
- + 4.9% per year (APR) and + +
- + 60% loan-to-value. + +
{feature.text}
- - ))} - - - -
-
-
-
- {feature.image}
+
+
+
- Earn more with A-Euro, get premium by locking
+
+
+
-
-
- {howItWorks
- .filter(feature => feature.type === "lock")
- .map(feature => (
+
+ {keyFeatures.map(feature => (
-
-
-
-
+
To use Augmint you need an Ethereum capable browser.
1. Install{" "}
- MetaMask Chrome plugin
+ MetaMask browser plugin
2. Connect to Main or Rinkeby test network.
-
- Video about installing MetaMask and getting test A-EUR:
-
-
diff --git a/src/styles/theme.js b/src/styles/theme.js
index 3ff4ad99..072a3e13 100644
--- a/src/styles/theme.js
+++ b/src/styles/theme.js
@@ -52,7 +52,7 @@ const theme = {
h4: remCalc(24),
h3: remCalc(26),
h2: remCalc(34),
- h1: remCalc(34)
+ h1: remCalc(38)
}
},
borderRadius: {
+
- {feature.title}
-
-
+
+
- Premium on A-EUR
+-
+
- + for up to 6 months at + +
- + 4.5% per year (APR). + +
{feature.text}
- - ))} - - +
+
+ Time is Money
+
+ Get rewarded for parking your A-EUR.
+ Earn a bonus instantly while your funds
+ remain safely locked in a smart contract.
+
+
- {feature.title}
-
+
{feature.image}
- {feature.title}
{feature.text}
))} - + +
-
-
diff --git a/src/containers/home/NotConnectedHome/styles.css b/src/containers/home/NotConnectedHome/styles.css
index e7ee1727..08012a27 100644
--- a/src/containers/home/NotConnectedHome/styles.css
+++ b/src/containers/home/NotConnectedHome/styles.css
@@ -7,17 +7,6 @@ article.segment {
margin-top: 115px !important;
}
-.key-features__header {
- margin-left: auto;
- margin-right: auto;
- max-width: 650px;
-}
-
-h2,
-.key-features__header > h2.ui.header {
- font-weight: 250;
-}
-
h1,
h1.ui.header,
h2,
@@ -67,22 +56,14 @@ p {
margin-bottom: 40px;
}
-@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
- p.opac {
- opacity: 0.6;
- }
-}
-
-.list-item {
- padding-left: 30px;
- background: url("../../../assets/images/bullet-point.svg") no-repeat left 6px;
- margin: 0 40px;
+p.opac {
+ opacity: 0.6;
}
.segment.how-to-use {
position: relative;
- padding-top: 200px;
- padding-bottom: 200px;
+ padding-top: 0px;
+ padding-bottom: 0;
background: linear-gradient(
rgba(53, 0, 55, 0) 0%,
rgba(53, 0, 55, 1) 20%,
@@ -135,7 +116,190 @@ p {
font-weight: 400;
}
-@media (max-width: 768px) and (min-width: 320px) {
+.segment.how-to-use .grid.margin {
+ margin-bottom: 140px;
+}
+
+.segment.how-to-use h5.ui.header,
+.segment.how-to-use h2.ui.header {
+ margin: 0;
+}
+
+.interchange-icon {
+ width: 50px;
+}
+
+a.try-now {
+ padding: 10px 20px;
+ width: 91px;
+}
+
+.homePage-grid {
+ justify-content: space-between;
+ margin-bottom: 120px;
+}
+.homePage-grid:last-child {
+ margin-bottom: 0;
+}
+
+.homePage-grid .homePage-column {
+ text-align: center;
+ padding: 1rem;
+}
+.homePage-grid .homePage-column .grid-cont {
+ text-align: left;
+ width: 360px;
+ margin: 0 auto;
+}
+.homePage-column p {
+ font-size: 20px;
+ line-height: 120%;
+}
+.homePage-header {
+ font-weight: bold;
+ margin: 30px auto;
+ font-size: 38px;
+}
+.homePage header h5 {
+ font-size: 20px;
+ line-height: 150%;
+ margin: "14px 0";
+}
+.homePage header {
+ margin-bottom: 150px;
+}
+h3.homePage-row-header {
+ padding-left: calc((50% - 350px) / 2);
+}
+.homePage-row-header,
+.homePage-column-header {
+ margin-bottom: 10px;
+ margin-top: 0;
+ line-height: 120%;
+ font-size: 30px;
+}
+
+.product-box {
+ background: rgba(255, 255, 255, 0.1);
+ padding: 40px;
+ height: calc(100% - 80px);
+ border-radius: 4px;
+ width: 280px;
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ align-items: center;
+ margin: 0 auto;
+}
+.product-box h4.box-header {
+ margin-top: 10px;
+ margin-bottom: 20px;
+ font-size: 24px;
+}
+.product-box ul {
+ padding: 0;
+ text-align: left;
+}
+
+.product-box ul .list-item {
+ padding-left: 25px;
+ background: url("../../../assets/images/list-arrow.svg") no-repeat left 8px;
+ list-style-type: none;
+ margin: 10px 0;
+ font-size: 20px;
+ color: rgba(255, 255, 255, 0.6);
+}
+.product-box ul .list-item span {
+ color: #ffad00;
+ font-size: 22px;
+ font-weight: 600;
+}
+.box .cta {
+ display: none;
+}
+.desc .cta {
+ display: inline-block;
+}
+.more-link {
+ display: block;
+}
+
+@media (max-width: 768px) {
+ .homePage header {
+ margin-bottom: 140px;
+ }
+ h1.homePage-header {
+ font-size: 32px;
+ margin: 10px auto 30px auto;
+ }
+ .homePage-grid {
+ justify-content: flex-start;
+ margin-bottom: 100px;
+ }
+ .homePage-grid:nth-of-type(3) {
+ margin-bottom: 0;
+ }
+ .homePage-grid .homePage-column .grid-cont {
+ text-align: center;
+ width: 100%;
+ }
+ .desc .cta {
+ display: none;
+ }
+ .homePage-grid {
+ padding-bottom: 0;
+ }
+ .box .cta {
+ display: inline-block;
+ margin-top: 10px !important;
+ }
+ .how-to-use br {
+ display: none;
+ }
+ .homePage-grid.left {
+ }
+ .homePage-grid.right {
+ flex-direction: column-reverse;
+ }
+ .homePage-grid .homePage-column {
+ text-align: center;
+ }
+ .homePage-grid .row {
+ text-align: center;
+ }
+ h3.homePage-row-header {
+ padding: 0;
+ text-align: center;
+ width: 100%;
+ }
+ .product-box {
+ padding: 20px 20px 30px 20px;
+ max-width: calc(100% - 100px);
+ width: auto;
+ height: auto;
+ }
+ .homePage-row-header,
+ .homePage-column-header {
+ font-size: 28px;
+ }
+
+ .convertible {
+ justify-content: center;
+ }
+ .homePage-column p {
+ font-size: 18px;
+ }
+ .product-box ul .list-item {
+ text-align: left;
+ font-size: 18px;
+ }
+ .product-box ul .list-item span {
+ font-size: 18px;
+ }
+ .more-link {
+ display: none;
+ }
+
.team .grid .column > img,
.partner .grid .column > img {
margin-bottom: 10px;
@@ -151,32 +315,14 @@ p {
}
}
-@media (min-width: 769px) and (max-width: 1455px) {
- .segment.how-to-use,
- .segment.team {
- padding-left: 190px;
+@media (max-width: 414px) {
+ .Site-content div.homePage {
+ max-width: 90%;
}
- .segment.advantages,
- .segment.team,
- .segment.partner {
- padding: 0px 85px;
+ .product-box {
+ max-width: calc(100% - 40px);
+ }
+ .homePage-grid:nth-of-type(3) {
+ margin-bottom: 50px;
}
-}
-
-.segment.how-to-use .grid.margin {
- margin-bottom: 140px;
-}
-
-.segment.how-to-use h5.ui.header,
-.segment.how-to-use h2.ui.header {
- margin: 0;
-}
-
-.interchange-icon {
- width: 50px;
-}
-
-a.try-now {
- padding: 10px 20px;
- width: 91px;
}
diff --git a/src/containers/home/NotConnectedHome/styles.js b/src/containers/home/NotConnectedHome/styles.js
index 2150f0e7..6c976769 100644
--- a/src/containers/home/NotConnectedHome/styles.js
+++ b/src/containers/home/NotConnectedHome/styles.js
@@ -2,7 +2,8 @@ export const keyFeaturesSegment = {
minHeight: "125px",
display: "flex",
alignItems: "center",
- justifyContent: "center"
+ justifyContent: "center",
+ marginTop: 0
};
export const keyFeaturesHeader = {
diff --git a/src/containers/home/convertible.js b/src/containers/home/convertible.js
new file mode 100644
index 00000000..fd02b976
--- /dev/null
+++ b/src/containers/home/convertible.js
@@ -0,0 +1,29 @@
+import React from "react";
+import { InterchangeIcon } from "components/Icons";
+
+function Convertible(props) {
+ const { from, to, simple } = props;
+
+ const containerStyles = {
+ display: "flex",
+ flexDirection: "row",
+ color: "white",
+ fontSize: 14
+ };
+
+ return (
+
+
+ );
+}
+
+export default Convertible;
diff --git a/src/containers/home/tryIt/HowToConnect.js b/src/containers/home/tryIt/HowToConnect.js
index 22af5b21..04f898ce 100644
--- a/src/containers/home/tryIt/HowToConnect.js
+++ b/src/containers/home/tryIt/HowToConnect.js
@@ -2,7 +2,6 @@ import React from "react";
import { Tsegment } from "components/TextContent";
import { DiscordButton, TelegramButton } from "components/LinkButtons";
-import Video from "components/augmint-ui/video";
import Header from "components/augmint-ui/header";
import { MobileView, DesktopView, StoreBadge } from "./styles";
@@ -73,26 +72,18 @@ export function HowToConnect(props) {
+ {!simple &&
+ 1
}
+ {from}
+
+ {!simple &&
+ 1
}
+ {to}
+