From 661a905cf49dc8f6819632bae8e7923a9dcb3c64 Mon Sep 17 00:00:00 2001 From: Matthias Kretschmann Date: Fri, 6 Apr 2018 11:18:37 +0200 Subject: [PATCH] lots of grid tweaks * introduce small gutters modifier --- _src/_assets/styles/_page-features.scss | 3 ++- _src/_assets/styles/_page-getstarted.scss | 10 ++++++++ _src/_assets/styles/_page-styleguide.scss | 6 ++--- .../styles/_sections/_section-blog.scss | 4 ++-- _src/_assets/styles/bigchain/_grid.scss | 24 +++++++++++++++++++ _src/_assets/styles/bigchain/_variables.scss | 2 +- _src/_data/colors.yml | 3 +-- _src/_data/getstarted.yml | 2 +- _src/_includes/sections/section-blog.html | 4 ++-- _src/developers/getstarted.html | 14 +++++------ _src/styleguide.md | 21 ++++------------ 11 files changed, 56 insertions(+), 37 deletions(-) diff --git a/_src/_assets/styles/_page-features.scss b/_src/_assets/styles/_page-features.scss index 114c042..8167030 100644 --- a/_src/_assets/styles/_page-features.scss +++ b/_src/_assets/styles/_page-features.scss @@ -7,7 +7,7 @@ .feature { display: flex; - margin-bottom: $spacer * 2; + margin-bottom: $spacer; &:first-of-type { padding-top: 0; } } @@ -54,6 +54,7 @@ margin-left: ($spacer / 2); padding: ($spacer / 6) ($spacer / 2); border-radius: 2px; + white-space: nowrap; } .feature__title__new { diff --git a/_src/_assets/styles/_page-getstarted.scss b/_src/_assets/styles/_page-getstarted.scss index 64c7c17..2ea4013 100644 --- a/_src/_assets/styles/_page-getstarted.scss +++ b/_src/_assets/styles/_page-getstarted.scss @@ -272,6 +272,16 @@ } } +.choice__title--community { + text-align: center; + + &:after { + position: relative; + left: 50%; + margin-left: -1.5rem; + } +} + .architecture { text-align: center; diff --git a/_src/_assets/styles/_page-styleguide.scss b/_src/_assets/styles/_page-styleguide.scss index c8debe6..9b86c74 100644 --- a/_src/_assets/styles/_page-styleguide.scss +++ b/_src/_assets/styles/_page-styleguide.scss @@ -13,11 +13,10 @@ // color swatches .color { - padding: ($spacer / 2); - margin-bottom: 5px; + padding: $spacer $spacer / 2; + margin-bottom: 0; border-radius: $border-radius; border: 1px solid lighten($body-bg, 10%); - min-height: 70px; text-align: center; &, @@ -28,7 +27,6 @@ font-family: $font-family-monospace; font-size: 11px; color: #fff; - vertical-align: middle; opacity: 0; } diff --git a/_src/_assets/styles/_sections/_section-blog.scss b/_src/_assets/styles/_sections/_section-blog.scss index 3d9ba85..ac574a2 100644 --- a/_src/_assets/styles/_sections/_section-blog.scss +++ b/_src/_assets/styles/_sections/_section-blog.scss @@ -9,7 +9,7 @@ box-shadow: none; display: flex; align-items: center; - min-height: 7rem; + min-height: 8rem; &:hover, &:focus { @@ -22,7 +22,7 @@ .article__title, h1.article__title { - font-size: $font-size-h5; + font-size: $font-size-lg; font-weight: $font-weight-normal; margin: 0; color: #fff; diff --git a/_src/_assets/styles/bigchain/_grid.scss b/_src/_assets/styles/bigchain/_grid.scss index c21b32d..1e3f55f 100644 --- a/_src/_assets/styles/bigchain/_grid.scss +++ b/_src/_assets/styles/bigchain/_grid.scss @@ -104,26 +104,50 @@ } } +@mixin grid-gutters-small() { + margin: -($gutter-space / 3) 0 $gutter-space / 3 (-($gutter-space / 3)); + + > .grid__col { + padding: $gutter-space / 3 0 0 $gutter-space / 3; + } +} + .grid--gutters { @include grid-gutters(); } +.grid--gutters--small { + @include grid-gutters-small(); +} + @media ($screen-sm) { .grid-small--gutters { @include grid-gutters(); } + + .grid-small--gutters--small { + @include grid-gutters-small(); + } } @media ($screen-md) { .grid-medium--gutters { @include grid-gutters(); } + + .grid-medium--gutters--small { + @include grid-gutters-small(); + } } @media ($screen-lg) { .grid-large--gutters { @include grid-gutters(); } + + .grid-large--gutters--small { + @include grid-gutters-small(); + } } diff --git a/_src/_assets/styles/bigchain/_variables.scss b/_src/_assets/styles/bigchain/_variables.scss index ad9f9e0..c28e565 100644 --- a/_src/_assets/styles/bigchain/_variables.scss +++ b/_src/_assets/styles/bigchain/_variables.scss @@ -45,7 +45,7 @@ $font-size-root: 18px !default; $font-size-root-lg: 20px !default; $font-size-base: 1rem !default; -$font-size-lg: 1.3rem !default; +$font-size-lg: 1.2rem !default; $font-size-sm: .85rem !default; $font-size-xs: .65rem !default; diff --git a/_src/_data/colors.yml b/_src/_data/colors.yml index c0da36b..8a15ecf 100644 --- a/_src/_data/colors.yml +++ b/_src/_data/colors.yml @@ -11,8 +11,6 @@ primary: hex: 445261 - name: brand-main-blue-dark hex: 101A25 - -secondary: - name: brand-main-violet hex: B581CF - name: brand-main-blue-light @@ -22,6 +20,7 @@ secondary: - name: brand-main-gray-lighter hex: E8EBEF + # # Errors # diff --git a/_src/_data/getstarted.yml b/_src/_data/getstarted.yml index 54a0e5d..1e95834 100644 --- a/_src/_data/getstarted.yml +++ b/_src/_data/getstarted.yml @@ -54,7 +54,7 @@ docs: title: "Guides & Documentation " description: "Dive into our documentation with guides, examples, terminology, references and more." button_documentation: "See All Documentation" - button_guides: "See All Guides" + button_guides: "See the Guide" categories: - title: "Code Examples" diff --git a/_src/_includes/sections/section-blog.html b/_src/_includes/sections/section-blog.html index 794b9b0..a6c9300 100644 --- a/_src/_includes/sections/section-blog.html +++ b/_src/_includes/sections/section-blog.html @@ -6,10 +6,10 @@

Updates, stories and ideas from the people behind BigchainDB.

-
+
{% for article in site.articles | limit: 6 %}
- +

{{ article.title }} diff --git a/_src/developers/getstarted.html b/_src/developers/getstarted.html index 27ed962..83fcc20 100644 --- a/_src/developers/getstarted.html +++ b/_src/developers/getstarted.html @@ -205,7 +205,7 @@ conn.postTransactionSync(txSigned)

{{ content.drivers.title_official }}

-
+
{% for driver in site.data.drivers.official %} @@ -232,7 +232,7 @@ conn.postTransactionSync(txSigned)

{{ content.drivers.title_tools }}

-
+
{% for driver in site.data.drivers.tools %}
@@ -254,8 +254,8 @@ conn.postTransactionSync(txSigned)
-

{{ content.drivers.title_community }}

-
+

{{ content.drivers.title_community }}

+
{% for driver in site.data.drivers.community %}
@@ -328,7 +328,7 @@ conn.postTransactionSync(txSigned)
-
+
-
-
+
+
{{ content.community.follow.title }}

{{ content.community.follow.description }}

diff --git a/_src/styleguide.md b/_src/styleguide.md index 41c63d1..6a80d74 100644 --- a/_src/styleguide.md +++ b/_src/styleguide.md @@ -11,22 +11,9 @@ js: page-styleguide.min.js ### Primary -
+
{% for color in site.data.colors.primary %} -
-
- ${{ color.name }} - #{{ color.hex }} -
-
- {% endfor %} -
- -### Secondary - -
- {% for color in site.data.colors.secondary %} -
+
${{ color.name }} #{{ color.hex }} @@ -37,9 +24,9 @@ js: page-styleguide.min.js ### Errors -
+
{% for color in site.data.colors.errors %} -
+
${{ color.name }} #{{ color.hex }}