garrit
/
slashdev.space
1
0
Fork 1
Code Issues Pull Requests Projects Releases Wiki Activity
Labels Milestones
New Pull Request

Remove full-page hero in favor of more density #1

Merged
garrit merged 5 commits from TobTobXX/slashdev.space-landing:main into main 3 years ago
Conversation 4 Commits 5 Files Changed 6
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