ipdb
/
website
mirror of https://github.com/ipdb/website.git
1
0
Fork 0
Code Releases Activity

more styled vision & research section

This commit is contained in:
Matthias Kretschmann 2017-09-07 13:34:24 +02:00
parent a720d21ae8
commit 9143ad4f0e
Signed by: m
GPG Key ID: 606EEEF3C479A91F
3 changed files with 74 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
_src/_assets/scss/_sections.scss
View File

@ -9,8 +9,8 @@
align-items: center;
@media ($screen-sm) {
padding-top: $spacer * 4;
padding-bottom: $spacer * 4;
padding-top: $spacer * 5;
padding-bottom: $spacer * 5;
}
// handling long text, like URLs
@ -107,3 +107,19 @@
}
}
}
.section--border {
position: relative;
&:before {
content: '';
position: absolute;
left: 0;
right: 0;
top: -.1rem;
display: block;
height: .1rem;
background: darken($brand-05, 8%);
transform: rotate(-4deg);
}
}

53
_src/_assets/scss/page-foundation.scss
View File

@ -7,23 +7,25 @@
}
}
.feature {
padding-left: 5rem;
position: relative;
}
.section--caretakers {
.feature {
padding-left: 5rem;
position: relative;
}
.feature__image {
width: 4rem;
height: 4rem;
position: absolute;
left: 0;
top: 0;
border-radius: $border-radius;
}
.feature__image {
width: 4rem;
height: 4rem;
position: absolute;
left: 0;
top: 0;
border-radius: $border-radius;
}
.feature__title {
font-size: $font-size-h5;
margin-bottom: $spacer / 2;
.feature__title {
font-size: $font-size-h5;
margin-bottom: $spacer / 2;
}
}
.caretakers-current {
@ -37,3 +39,24 @@
opacity: 1;
}
}
.section--board {
.board {
margin-bottom: 0;
}
}
.section--vision {
.feature__image {
margin: 0;
background: $brand-05;
padding: $spacer;
padding-bottom: 0;
border-radius: $border-radius;
min-height: 9rem;
svg {
display: block;
}
}
}

28
_src/foundation/index.html
View File

@ -91,22 +91,30 @@ css: page-foundation
</div>
</section>
<section class="section section--vision" id="vision">
<section class="section section--vision section--border" id="vision">
<div class="row">
<header class="section__header">
<div class="grid grid--full grid-medium--columns grid--center grid--gutters">
<div class="grid__col grid__col--4">
<div class="grid grid--full grid-medium--columns grid--center grid--gutters">
<div class="grid__col grid__col--4">
<header class="section__header">
<h1 class="section__title">{{ content.vision.title }}</h1>
<p class="section__description">{{ content.vision.description }}</p>
</div>
<div class="grid__col grid__col--2">
</div>
</header>
</div>
</header>
</div>
</div>
<div class="row">
{{ content.vision.text | markdownify }}
<div class="grid grid--full grid-medium--columns grid--gutters">
<div class="grid__col grid__col--2">
<figure class="feature__image">
<svg>
<use xlink:href="/assets/img/sprite.svg#starbase-towers"></use>
</svg>
</figure>
</div>
<div class="grid__col grid__col--4">
{{ content.vision.text | markdownify }}
</div>
</div>
</div>
</section>