Browse Source

Move hero and introduction into welcome

The styling is a bit less big and bold.
pull/1/head
FiliusPatris 3 years ago
parent
commit
7951e2b1e5
Signed by untrusted user: TobTobXX
GPG Key ID: 12AC3D4752E2FA2E
  1. 28
      index.html
  2. 1
      styles/index.css
  3. 32
      styles/welcome.css

28
index.html

@ -8,25 +8,19 @@
<link rel="stylesheet" href="styles/index.css" />
</head>
<body>
<section class="hero">
<div class="hero__text-area__container">
<h1 class="hero__text-area__heading">/dev.space</h1>
<h3 class="hero__text-area__subheading">
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.
<section class="welcome">
<div class="welcome__container">
<h1 class="welcome__text-area__heading">
/dev.space
</h1>
<h3 class="introduction__container__subheading">
Whether you're freshly starting out, or you are just looking
to connect with likeminded people. We help you turn your
project ideas into reality.
<h3 class="welcome__text-area__subheading">
Where developers can collectively learn an grow.
</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
help you turn your project ideas into reality.
</p>
</div>
</section>
<section class="services">

1
styles/index.css

@ -4,6 +4,7 @@
/* Components */
@import url("./hero.css");
@import url("./introduction.css");
@import url("./welcome.css");
@import url("./services.css");
body {

32
styles/welcome.css

@ -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;
}
Loading…
Cancel
Save