garrit
/
slashdev.space
1
0
Fork 1
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

Merge pull request 'Remove full-page hero in favor of more density' (#1) from TobTobXX/slashdev.space-landing:main into main 

Reviewed-on: garrit/slashdev.space-landing#1
grid2flex
Garrit Franke 3 years ago
parent
f3823d3f50 849dfd9851
commit
6f941f09cf
6 changed files with 48 additions and 75 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 28
      index.html
  2. 38
      styles/hero.css
  3. 3
      styles/index.css
  4. 15
      styles/introduction.css
  5. 7
      styles/services.css
  6. 32
      styles/welcome.css

28
index.html
Unescape View File

@ -8,25 +8,19 @@
<link rel="stylesheet" href="styles/index.css" /> <link rel="stylesheet" href="styles/index.css" />
</head> </head>
<body> <body>
<section class="hero"> <section class="welcome">
<div class="hero__text-area__container"> <div class="welcome__container">
<h1 class="hero__text-area__heading">/dev.space</h1> <h1 class="welcome__text-area__heading">
<h3 class="hero__text-area__subheading"> /dev.space
The digital hackerspace
</h3>
</div>
</section>
<section class="introduction">
<div class="introduction__container">
<h1 class="introduction__container__heading">
/dev.space is a platform providing online services for
developers to collectively learn and grow.
</h1> </h1>
<h3 class="introduction__container__subheading"> <h3 class="welcome__text-area__subheading">
Whether you're freshly starting out, or you are just looking Where developers can collectively learn an grow.
to connect with likeminded people. We help you turn your
project ideas into reality.
</h3> </h3>
<p class="welcome__text-area__description">
Whether you're freshly starting out, or you are just looking
to connect with likeminded people. Our suite of online services
helps you turn your project ideas into reality.
</p>
</div> </div>
</section> </section>
<section class="services"> <section class="services">

38
styles/hero.css
Unescape View File

@ -1,38 +0,0 @@
.hero {
align-items: center;
display: flex;
height: 100vh;
justify-content: center;
font-family: "Work Sans", sans-serif;
}
.hero__text-area__container {
text-align: center;
}
.hero__text-area__heading {
font-size: 4rem;
margin: 1rem;
}
.hero__text-area__subheading {
font-size: 2rem;
}
@media (min-width: 800px) {
.hero__text-area__heading {
font-size: 10rem;
}
.hero__text-area__subheading {
font-size: 3rem;
}
}
.hero__scroll-arrow {
font-size: 6rem;
font-weight: lighter;
position: absolute;
bottom: 1rem;
}

3
styles/index.css
Unescape View File

@ -2,8 +2,7 @@
@import url("https://fonts.googleapis.com/css2?family=Work+Sans:wght@200&display=swap"); @import url("https://fonts.googleapis.com/css2?family=Work+Sans:wght@200&display=swap");
/* Components */ /* Components */
@import url("./hero.css"); @import url("./welcome.css");
@import url("./introduction.css");
@import url("./services.css"); @import url("./services.css");
body { body {

15
styles/introduction.css
Unescape View File

@ -1,15 +0,0 @@
.introduction {
align-items: center;
display: flex;
justify-content: center;
text-align: center;
margin-bottom: 10rem;
}
.introduction__container__heading {
font-size: 2.5rem;
}
.introduction__container__subheading {
font-size: 1.5rem;
}

7
styles/services.css
Unescape View File

@ -3,11 +3,13 @@
display: flex; display: flex;
justify-content: center; justify-content: center;
text-align: center; text-align: center;
margin-bottom: 10rem; margin-top: 2rem;
} }
.services__heading { .services__heading {
font-size: 5rem; font-size: 3.3rem;
font-weight: bold;
margin-bottom: 1rem;
} }
.services__offers { .services__offers {
@ -18,7 +20,6 @@
} }
.services__offers__card { .services__offers__card {
margin-top: 1.5rem;
width: 15rem; width: 15rem;
} }
.services__offers__card__heading { .services__offers__card__heading {

32
styles/welcome.css
Unescape View File

@ -0,0 +1,32 @@
.welcome {
align-items: center;
display: flex;
justify-content: center;
font-family: "Work Sans", sans-serif;
}
.welcome__container {
margin-top: 8vh;
text-align: center;
}
.welcome__text-area__heading {
font-size: 5rem;
margin: 1rem;
text-align: center;
}
.welcome__text-area__subheading {
font-size: 2rem;
text-align: center;
margin-top: 0;
margin-bottom: 2em;
}
.welcome__text-area__description {
font-size: 1.5rem;
/* font-weight: 350; */ /* Can't try out, I don't have multiple weights installed. */
text-align: center;
margin-left: 12vw;
margin-right: 12vw;
}
Write Preview
Loading…
Cancel
Save