biobulkbende/biobulkbende.org
0
0
Fork 0
mirror of https://github.com/biobulkbende/biobulkbende.org.git synced 2025-07-19 11:41:06 +00:00
Code Issues Projects Releases Wiki Activity

about section finished

Browse Source
This commit is contained in:
Tancre
2020-09-30 18:51:32 +02:00
parent 49cbef62df
commit 7a776a7295
11 changed files with 327 additions and 66 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
app/assets/scss/modules/_btn.scss
View File

@ -6,6 +6,14 @@
display: inline-block;
border-radius: 30px;
&--medium {
margin-bottom:1.5rem;
@include atSmall(){
font-size: 1.1rem;
}
}
&--large {
padding: 1.1rem 1.9rem;
@ -13,6 +21,4 @@
font-size: 1.25rem;
}
}
}

22
app/assets/scss/modules/_generic-content-container.scss
View File

@ -1,12 +1,28 @@
.generic-content-container{
&--t-b-margin{
margin-top: 5rem;
margin-bottom: 70px;
@include atLarge{
margin-top: 7rem;
margin-bottom: 0px;
}
}
&--t-center{
text-align: center;
}
p {
font-weight: 300;
line-height: 1.65;
margin: 0 0 1.8rem 0;
margin: 0;
font-size: 1.2rem;
@include atSmall{
font-size: 1.125rem;
@include atMedium{
margin: 0 0 1.8rem 0;
font-size: 1.4rem;
}
}

54
app/assets/scss/modules/_headline.scss Normal file
View File

@ -0,0 +1,54 @@
.headline{
margin:auto;
&--s-width {
max-width: 500px;
@include atMedium(){
max-width: 1000px;
}
}
&__title {
font-weight: 500;
font-size: 1.7rem;
@include atMedium(){
font-size: 2.1rem;
}
}
&__subtitle {
font-weight: 300;
font-size: 1.4rem;
@include atMedium(){
font-size: 1.8rem;
}
}
&--centered {
text-align: center;
}
&--lightGreen {
color: $myLightGreen;
}
&--orange {
color: $myOrange;
}
&--b-margin {
margin-bottom: 2.5rem;
@include atMedium(){
margin-bottom: 4.5rem;
}
}
a {
font-weight: 400;
}
}

93
app/assets/scss/modules/_page-section.scss
View File

@ -1,42 +1,85 @@
.page-section{
padding: 1.2rem 0;
position: relative;
@include atMedium(){
position: unset;
padding: 4.5rem 0;
}
&--no-b-padding-until-medium{
padding-bottom: 0;
@include atMedium(){
padding-bottom: 4.5rem;
// &--no-b-padding-until-medium{
// padding-bottom: 0;
// @include atMedium(){
// padding-bottom: 4.5rem;
// }
// }
// &--no-b-padding-until-large{
// padding-bottom: 0;
// @include atMedium(){
// padding-bottom: 4.5rem;
// }
// }
&--b-margin{
margin-bottom: 70px;
@include atMedium{
margin-bottom: -140px;
}
}
&--no-b-padding-until-large{
padding-bottom: 0;
@include atMedium(){
padding-bottom: 4.5rem;
}
}
&--blue{
background-color: blue;
&--red{
background-color: $myRed;
color: #fff;
}
&--testimonials{
background: #e0e6ef;
// @include atMedium(){
// &.lazyloaded {
// background: url('../../assets/images/testimonials-bg.jpg') top center no-repeat;
// background-size: cover;
// }
// }
&--darkGreen{
background-color: $myDarkGreen;
color: #fff;
}
&--lightGreen{
background-color: $myLightGreen;
color: #fff;
}
&--arrow-down{
width: 0;
height: 0;
border-left: 70px solid transparent;
border-right: 70px solid transparent;
border-top: 85px solid $myRed;
position: absolute;
bottom: -60px;
left: 50%;
transform: translateX(-50%);
@include atMedium{
position: relative;
top: 70px;
margin: auto;
left: 0;
transform: translateX(0%);
}
}
// &--testimonials{
// background: #e0e6ef;
// // @include atMedium(){
// // &.lazyloaded {
// // background: url('../../assets/images/testimonials-bg.jpg') top center no-repeat;
// // background-size: cover;
// // }
// // }
// }
}

6
app/assets/scss/modules/_rows.scss
View File

@ -19,7 +19,7 @@
}
&--gutters > div {
padding-right: 65px;
padding-right: 60px;
}
&--gutters-large > div {
@ -34,7 +34,7 @@
margin-bottom: 1rem;
}
@include atMedium(){
@include atLarge(){
&__b-margin-until-medium{
margin-bottom: 0rem;
@ -46,7 +46,7 @@
}
&__medium-4--larger{
width: 37%;
width: 27%;
}
&__medium-6 {

24
app/assets/scss/modules/_video-container.scss Normal file
View File

@ -0,0 +1,24 @@
.video-container {
position:relative;
padding-bottom:56.25%;
padding-top:30px;
height:0;
overflow:hidden;
box-shadow: -3px 3px 10px #000000ba;
margin-bottom: 15px;
margin-right: -18px;
margin-left: -18px;
@include atLarge{
margin-right: 0px;
margin-left: 0px;
}
}
.video-container iframe, .video-container object, .video-container embed {
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
}