basic outline

This commit is contained in:
Sean Yesmunt 2021-03-27 14:31:06 -04:00
parent eb5a7f8561
commit 427a0013d8
2 changed files with 46 additions and 15 deletions

View file

@ -12,8 +12,13 @@ export default function Home() {
<span className="title">TBD TITLE</span>
<div className="header__links">
<a>LINK 1</a>
<a>LINK 2</a>
<a
href="https://docs.google.com/document/d/1QYSruKLjStWZOTTmkatfUZaCdp4lHWwk6TmUvytzTx0/edit#"
rel="noopener"
target="_blannk"
>
VIEW FAQ
</a>
</div>
</header>
@ -26,9 +31,12 @@ export default function Home() {
<br />
Save Crypto
</h1>
<p className="landing__subtitle">
Some catch subtitle. The SEC are dorks.
</p>
<div className="landing__subtitle">
<div>Some catchy subtitle that says some different things.</div>
<div className="landing__subtitle-catchy">
<i>The SEC are dorks.</i>
</div>
</div>
</div>
<div className="content">

View file

@ -41,10 +41,11 @@ a {
header {
height: 8vh;
background-color: white;
color: black;
display: flex;
justify-content: space-between;
align-items: center;
padding: 0 0.5rem;
padding: 0 0.75rem;
a:not(:last-of-type) {
margin-right: $spacing-small;
@ -65,49 +66,71 @@ header {
}
.landing__img {
z-index: -1;
position: relative;
height: 10rem;
background: linear-gradient(to right, #2c5364, #203a43, #0f2027);
background-color: #111111;
color: #ffffff;
// background: linear-gradient(to right, #2c5364, #203a43, #0f2027);
@media (min-width: $breakpoint-small) {
height: 80vh;
height: 70vh;
}
}
.landing__text {
margin-top: -2rem;
margin-top: -6rem;
margin-bottom: 3rem;
margin-left: $spacing-small;
margin-right: $spacing-small;
background-color: white;
background-color: #fcd34d;
color: black;
padding: $spacing-small;
box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
padding-bottom: 2rem;
@media (min-width: $breakpoint-small) {
position: absolute;
margin: 0 10rem;
top: 25vh;
top: 20vh;
width: 40rem;
padding: $spacing-medium;
}
}
.landing__title {
font-size: 3rem;
@media (min-width: $breakpoint-small) {
font-size: 3rem;
}
}
.landing__subtitle {
margin-top: 1.5rem;
font-size: 1.5rem;
font-weight: 300;
@media (min-width: $breakpoint-small) {
font-size: 2rem;
line-height: 3rem;
}
}
.landing__subtitle-catchy {
margin-top: 1.5rem;
font-weight: bolder;
i {
background-color: #5726ab;
color: white;
padding: 0.5rem;
margin-top: 2rem;
}
}
.content {
padding: $spacing-small;
background-color: #ffffff;
color: #000000;
@media (min-width: $breakpoint-small) {
padding-top: 5rem;