Skip to content

Commit

Permalink
advance
Browse files Browse the repository at this point in the history
  • Loading branch information
@yuli-ferna
yuli-ferna committed Aug 28, 2023
1 parent 0e14f13 commit 2db1ad2
Show file tree
Hide file tree
Showing 2 changed files with 152 additions and 129 deletions.
263 changes: 136 additions & 127 deletions public/sui/index.css
View file
Original file line number Diff line number Diff line change
@@ -1,199 +1,208 @@
html {
-webkit-locale: "en";
box-sizing: border-box;
-webkit-font-smoothing: antialiased;
--vh: 10.01px;
-webkit-locale: "en";
box-sizing: border-box;
-webkit-font-smoothing: antialiased;
--vh: 10.01px;
}

body {
box-sizing: inherit;
color: #FFFFFF;
margin: 0;
font-size: 0.8125rem;
font-family: 'Poppins', sans-serif;
font-weight: 400;
line-height: 1.43;
background-size: 120%;
background-color: #17153f;
background-image: url(/static/media/bg.7f578c3eb1b9a700a83d6113bf1579e0.svg);
background-repeat: repeat-y;
background-position: top center;
overscroll-behavior-y: none;
box-sizing: inherit;
color: #ffffff;
margin: 0;
font-size: 0.8125rem;
font-family: "Poppins", sans-serif;
font-weight: 400;
line-height: 1.43;
background-size: 120%;
background-color: #17153f;
background-image: url(/static/media/bg.7f578c3eb1b9a700a83d6113bf1579e0.svg);
background-repeat: repeat-y;
background-position: top center;
overscroll-behavior-y: none;
}

.root {
box-sizing: inherit;
box-sizing: inherit;
}

.container {
box-sizing: inherit;
display: flex;
overflow: hidden;
position: relative;
min-height: 100vh;
flex-direction: column;
box-sizing: inherit;
display: flex;
overflow: hidden;
position: relative;
min-height: 100vh;
flex-direction: column;
}

.cctp-banner {
box-sizing: inherit;
width: 100%;
display: flex;
padding: 4px 16px;
font-size: 14px;
background: linear-gradient(20deg, #f44b1b 0%, #eeb430 100%);
min-height: 48px;
text-align: center;
align-items: center;
font-weight: 500;
letter-spacing: 0.02em;
justify-content: center;
box-sizing: inherit;
width: 100%;
display: flex;
padding: 4px 16px;
font-size: 14px;
background: linear-gradient(20deg, #f44b1b 0%, #eeb430 100%);
min-height: 48px;
text-align: center;
align-items: center;
font-weight: 500;
letter-spacing: 0.02em;
justify-content: center;
}
#cctp-default-text {
display: none;
}

#cctp-optimism-text {
display: none;
}

.cctp-link {
text-align: center;
box-sizing: inherit;
margin: 0;
text-decoration: none;
color: #F47B48;
display: inline-flex;
padding: 6px 12px;
font-size: 12px;
min-width: fit-content;
min-height: 32px;
align-items: center;
font-weight: 600;
margin-left: 8px;
border-radius: 20px;
letter-spacing: 0.08em;
background-color: white;
text-align: center;
box-sizing: inherit;
margin: 0;
text-decoration: none;
color: #f47b48;
display: inline-flex;
padding: 6px 12px;
font-size: 12px;
min-width: fit-content;
min-height: 32px;
align-items: center;
font-weight: 600;
margin-left: 8px;
border-radius: 20px;
letter-spacing: 0.08em;
background-color: white;
}

.header {
transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
box-shadow: none;
width: 100%;
display: flex;
z-index: 1100;
box-sizing: border-box;
flex-shrink: 0;
flex-direction: column;
position: static;
color: inherit;
background: transparent;
margin-top: 16px;
transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
box-shadow: none;
width: 100%;
display: flex;
z-index: 1100;
box-sizing: border-box;
flex-shrink: 0;
flex-direction: column;
position: static;
color: inherit;
background: transparent;
margin-top: 16px;
}

.header-inner {
color: inherit;
box-sizing: inherit;
display: flex;
position: relative;
align-items: center;
padding-left: 24px;
padding-right: 24px;
min-height: 64px;
width: 100%;
margin: auto;
max-width: 1440px;
color: inherit;
box-sizing: inherit;
display: flex;
position: relative;
align-items: center;
padding-left: 24px;
padding-right: 24px;
min-height: 64px;
width: 100%;
margin: auto;
max-width: 1440px;
}

.logo-link {
display: inline-flex;
align-items: center;
display: inline-flex;
align-items: center;
}
.logo-link:hover {
text-decoration: none;
text-decoration: none;
}

.logo {
height: 68px;
vertical-align: middle;
margin-right: 8px;
display: inline-block;
height: 68px;
vertical-align: middle;
margin-right: 8px;
display: inline-block;
}
.logo:hover {
filter: contrast(1);
filter: contrast(1);
}

.spacer {
flex: 1;
width: 100vw;
flex: 1;
width: 100vw;
}

/* .links-list {} */
@media (max-width: 599.95px) {
.links-list {
display: none;
}
.links-list {
display: none;
}

.help-container {
display: block;
}
.help-container {
display: block;
}
}

@media (min-width: 600px) {
.links-list {
display: flex;
}
.links-list {
display: flex;
}

.help-container {
display: none;
}
.help-container {
display: none;
}
}

@font-face {
font-family: 'Suisse BP Intl';
src: url('SuisseBPIntlBold.woff2');
font-family: "Suisse BP Intl";
src: url("SuisseBPIntlBold.woff2");
}

.links-list-inner {
display: flex;
align-items: center;
display: flex;
align-items: center;
}

.link {
margin: 0;
text-decoration: none;
color: white;
font-size: 0.8125rem;
font-family: Suisse BP Intl, sans-serif;
font-weight: 600;
line-height: 1.43;
text-underline-offset: 6px;
margin-left: 32px;
margin: 0;
text-decoration: none;
color: white;
font-size: 0.8125rem;
font-family:
Suisse BP Intl,
sans-serif;
font-weight: 600;
line-height: 1.43;
text-underline-offset: 6px;
margin-left: 32px;
}
.active {
text-decoration: underline;
text-decoration: underline;
}

/* .help-container {} */
/* .help-link {} */
.help-label {
color: white;
color: white;
}
.help-icon {
fill: currentColor;
width: 1em;
height: 1em;
display: inline-block;
font-size: 1.3928571428571428rem;
transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
flex-shrink: 0;
user-select: none;
fill: currentColor;
width: 1em;
height: 1em;
display: inline-block;
font-size: 1.3928571428571428rem;
transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
flex-shrink: 0;
user-select: none;
}

.footer {
display: flex;
flex-direction: column;
align-items: center;
margin-bottom: 15px;
display: flex;
flex-direction: column;
align-items: center;
margin-bottom: 15px;
}

.footer-link {
color: white;
text-decoration: underline;
color: white;
text-decoration: underline;
}

.footer-link:visited {
color: white;
color: white;
}
18 changes: 16 additions & 2 deletions public/sui/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -40,8 +40,11 @@
<div class="root">
<div class="container">
<div class="cctp-banner">
<span>
Experience frictionless USDC transfers between Ethereum and Avalanche with Circle's CCTP.
<span id="cctp-default-text">
Experience frictionless USDC transfers between Ethereum, Avalanche, and Arbitrum with Circle's CCTP.
</span>
<span id="cctp-optimism-text">
Experience frictionless USDC transfers between Ethereum, Avalanche, Arbitrum, and Optimism with Circle's CCTP.
</span>
<a class="cctp-link" href="https://portalbridge.com/usdc-bridge" target="_blank" rel="noopener noreferrer">
TRY IT NOW
Expand Down Expand Up @@ -99,5 +102,16 @@
</div>

<script src="https://www.unpkg.com/@wormhole-foundation/wormhole-connect@0.0.5/dist/main.js"></script>
<script>
// To show Optimism option on SEPT 4th 2023
if (new Date() < new Date(2023, 8, 4)) {
document.getElementById("cctp-default-text").style.display = "block";
document.getElementById("cctp-optimism-text").style.display = "none";

} else {
document.getElementById("cctp-default-text").style.display = "none";
document.getElementById("cctp-optimism-text").style.display = "block";
}
</script>
</body>
</html>

0 comments on commit 2db1ad2

Please sign in to comment.