bigchaindb/site
1
0
Fork 0
mirror of https://github.com/bigchaindb/site.git synced 2024-11-21 17:26:55 +01:00
Code Releases Activity

unify photo backgrounds/color overlays

Browse Source
This commit is contained in:
Matthias Kretschmann 2016-01-29 18:45:09 +01:00
parent c851ce19a1
commit ea35b337ff
14 changed files with 57 additions and 107 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
Gemfile
View File

@ -4,7 +4,3 @@ group :jekyll do
gem 'jekyll'
gem 'jekyll-sitemap'
end
group :development do
gem 'redcarpet'
end

2
_config.yml
View File

@ -30,7 +30,7 @@ permalink: /:title/
# Content Parsing
# --------------------
#markdown: kramdown
markdown: kramdown
kramdown:
input: GFM

23
_src/_assets/styles/bigchain/_header.scss
View File

@ -1,30 +1,11 @@
.header {
position: relative;
// background
background: url('../img/photo1.jpg') no-repeat center bottom;
background-size: cover;
// color overlay
&:before {
content: "";
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
bottom: 0;
right: 0;
background: linear-gradient(to top left, $brand-main-blue 0%, $brand-main-blue-dark 100%);
opacity: .7;
z-index: 0;
}
@extend .background--photo;
background-position: bottom;
}
.header__title {
position: relative;
z-index: 1;
color: #fff;
text-align: center;
margin: 0;
padding: ($spacer * 4) 0;

23
_src/_assets/styles/bigchain/_hero.scss
View File

@ -7,10 +7,10 @@
$menu-height-md: 73px;
.hero {
@extend .background--photo;
text-align: center;
overflow: hidden;
position: relative;
text-shadow: 0 1px 0 rgba(0,0,0,.1);
.section {
@media ($screen-md) {
@ -18,27 +18,7 @@ $menu-height-md: 73px;
}
}
// background
background: url('../img/photo1.jpg') no-repeat center bottom;
background-size: cover;
// color overlay
&:before {
content: "";
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
bottom: 0;
right: 0;
background: linear-gradient(to top left, $gray-dark 0%, $gray 100%);
opacity: .7;
z-index: 0;
}
.logo--full {
fill: #fff;
fill-opacity: .8;
margin: auto;
max-width: 31em;
@ -50,7 +30,6 @@ $menu-height-md: 73px;
}
.section-title {
color: #fff;
margin-bottom: $spacer;
&:after { display: none }

2
_src/_assets/styles/bigchain/_icons.scss
View File

@ -1,7 +1,7 @@
.icon {
fill: none;
stroke: $headings-color;
stroke: $brand-main-violet;
stroke-width: 2;
stroke-linecap: round;
stroke-linejoin: round;

1
_src/_assets/styles/bigchain/_mixins.scss
View File

@ -6,3 +6,4 @@
@import "_mixins/_buttons";
@import "_mixins/_alerts";
@import "_mixins/_color-overlay";

25
_src/_assets/styles/bigchain/_mixins/_color-overlay.scss Normal file
View File

@ -0,0 +1,25 @@
@mixin color-overlay($color-from: $brand-main-blue, $color-to: $brand-main-violet) {
position: relative;
// color overlay
&:before {
content: "";
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
bottom: 0;
right: 0;
background: linear-gradient(to bottom right, $color-from 0%, $color-to 100%);
opacity: .7;
z-index: 0;
}
.row { z-index: 1 }
}
.color-overlay {
@include color-overlay();
}

19
_src/_assets/styles/bigchain/_sections.scss
View File

@ -96,3 +96,22 @@
.background--gray {
background: $brand-main-gray;
}
//
// Photo background
//
.background--photo {
@extend .color-overlay;
text-shadow: 0 1px 0 rgba(0,0,0,.1);
// background
background: url('../img/photo1.jpg') no-repeat center top;
background-size: cover;
.section-title,
.section-description,
.header__title {
//color: #fff;
}
}

2
_src/_assets/styles/bigchain/_variables.scss
View File

@ -67,7 +67,7 @@ $headings-color: $brand-main-blue-light !default;
// Scaffolding
//
$body-bg: $gray-dark !default;
$text-color: $gray-lighter !default;
$text-color: $gray-lightest !default;
$link-color: $brand-primary !default;
$link-hover-color: lighten($link-color, 15%) !default;

28
_src/_assets/styles/page-community.scss
View File

@ -25,31 +25,5 @@
}
.section-conduct {
position: relative;
// background
background: url('../img/photo1.jpg') no-repeat center top;
background-size: cover;
// color overlay
&:before {
content: "";
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
bottom: 0;
right: 0;
background: linear-gradient(to top left, $brand-main-blue 0%, $brand-main-violet 100%);
opacity: .7;
z-index: 0;
}
.row { z-index: 1 }
.section-title,
.section-description {
color: #fff;
}
@extend .background--photo;
}

28
_src/_assets/styles/page-features.scss
View File

@ -22,36 +22,8 @@
.section-timeline {
position: relative;
// background
background: url('../img/photo1.jpg') no-repeat center top;
background-size: cover;
// color overlay
&:before {
content: "";
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
bottom: 0;
right: 0;
background: linear-gradient(to top left, $brand-main-blue 0%, $brand-main-violet 100%);
opacity: .7;
z-index: 0;
}
.row { z-index: 1 }
.section-title,
.section-description,
.timeline {
color: #fff;
}
.timeline {
}
}

2
_src/features.html
View File

@ -59,7 +59,7 @@ title: Features
</section>
<section class="section section-timeline">
<section class="section section-timeline background--photo">
<div class="row">
<header class="section-header">
<h1 class="section-title">Timeline.</h1>

2
_src/index.html
View File

@ -93,7 +93,7 @@ tagline: 'Meet Bigchain, the world’s most scalable blockchain'
</div>
</section>
<section id="earlyaccess" class="section section-earlyaccess background--darker">
<section id="earlyaccess" class="section section-earlyaccess background--photo">
<div class="row">
<header class="section-header">
<h1 class="section-title">Sign Up for Early Access</h1>

3
_src/styleguide.md
View File

@ -109,8 +109,11 @@ Donec *ullamcorper nulla* non metus auctor fringilla. Duis mollis, est non commo
## Headings
# Heading 1
## Heading 2
### Heading 3
#### Heading 4