bigchaindb/site
1
0
Fork 0
mirror of https://github.com/bigchaindb/site.git synced 2025-02-14 21:10:28 +01:00
Code Releases Activity

let's go dark

Browse Source
This commit is contained in:
Matthias Kretschmann 2016-01-22 16:03:56 +01:00
parent d31f4f4239
commit c5bb43f325
19 changed files with 140 additions and 144 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
_src/_assets/styles/bigchain/_content-page.scss
View File

@ -13,7 +13,7 @@
} }
> h1, h2 { > h1, h2 {
border-bottom: 2px solid $gray-lightest; border-bottom: 1px solid $brand-main-blue-light;
padding-bottom: $spacer; padding-bottom: $spacer;
margin-bottom: ($spacer * 2); margin-bottom: ($spacer * 2);
text-align: center; text-align: center;

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

@ -2,7 +2,7 @@
.footer { .footer {
padding-top: $spacer; padding-top: $spacer;
padding-bottom: $spacer; padding-bottom: $spacer;
border-top: 1px solid $gray-lightest; border-top: 1px solid $gray-darker;
color: $gray-light; color: $gray-light;
} }

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

@ -15,8 +15,7 @@
top: 0; top: 0;
bottom: 0; bottom: 0;
right: 0; right: 0;
//background: $brand-main-brown; background: linear-gradient(to top left, $brand-main-blue 0%, $brand-main-blue-dark 100%);
background: linear-gradient(to top left, $brand-main-blue 0%, $brand-main-brown 100%);
opacity: .7; opacity: .7;
z-index: 0; z-index: 0;
} }

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

@ -32,7 +32,7 @@ $menu-height-md: 73px;
top: 0; top: 0;
bottom: 0; bottom: 0;
right: 0; right: 0;
background: linear-gradient(to top left, $brand-main-blue 0%, $brand-main-brown 100%); background: linear-gradient(to top left, $gray-dark 0%, $gray 100%);
opacity: .7; opacity: .7;
z-index: 0; z-index: 0;
} }

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

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

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

@ -6,7 +6,7 @@
// default logo // default logo
.logo { .logo {
fill: $brand-main-blue; fill: #fff;
width: 300px; width: 300px;
height: 30px; height: 30px;
} }

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

@ -3,6 +3,8 @@
padding-top: ($spacer * 2); padding-top: ($spacer * 2);
padding-bottom: ($spacer * 2); padding-bottom: ($spacer * 2);
&:last-child { border-bottom: none; }
// use this so animated elements coming in from outside of screen // use this so animated elements coming in from outside of screen
// don't affect layout // don't affect layout
overflow: hidden; overflow: hidden;
@ -43,17 +45,16 @@
// the bottom line // the bottom line
&:after { &:after {
content: ""; content: "";
height: 2px; height: 1px;
width: 5rem; width: 5rem;
display: block; display: block;
margin: ($spacer * 2) auto 0 auto; margin: ($spacer * 2) auto 0 auto;
background: $gray-lighter; background: $gray;
} }
} }
.section-description { .section-description {
font-size: $font-size-lg; font-size: $font-size-lg;
color: $headings-color;
margin-bottom: 0; margin-bottom: 0;
+ .section-description { + .section-description {
@ -76,32 +77,22 @@
// Section backgrounds // Section backgrounds
// //
.background--blue { .background--blue {
background: $brand-main-blue; // fallback background: $brand-main-blue;
background: linear-gradient(to bottom right, $brand-main-blue 0%, lighten($brand-main-blue, 10%) 100%);
.section-title,
.section-description { color: #fff }
} }
.background--dark { .background--darker {
background: $brand-main-blue-dark; // fallback background: $gray-darker;
background: linear-gradient(to bottom right, $brand-main-blue-dark 0%, lighten($brand-main-blue-dark, 10%) 100%);
.section-title,
.section-description { color: #fff }
} }
.background--light { .background--light {
background: $gray-lightest; // fallback background: $gray-lightest;
background: linear-gradient(to bottom right, $gray-lightest 0%, lighten($gray-lightest, 10%) 100%);
.section-title,
p {
color: $gray;
}
} }
.background--gray { .background--gray {
background: $brand-main-gray; // fallback background: $brand-main-gray;
background: linear-gradient(to bottom right, $brand-main-gray 0%, lighten($brand-main-gray, 10%) 100%);
.section-title,
.section-description,
.form-control,
.form-label { color: #fff }
} }

132
_src/_assets/styles/bigchain/_syntax.scss
View File

@ -1,63 +1,73 @@
// https://github.com/richleland/pygments-css/blob/master/pastie.css // https://github.com/richleland/pygments-css/blob/master/zenburn.css
.highlight .hll { background-color: #ffffcc } .highlight pre {color:#fdce93;background-color:#3f3f3f}
.highlight .c { color: #888888 } /* Comment */ .highlight .hll{background-color:#222}
.highlight .err { color: #a61717; background-color: #e3d2d2 } /* Error */ .highlight .c{color:#7f9f7f}
.highlight .k { color: #008800; font-weight: bold } /* Keyword */ .highlight .err{color:#e37170;background-color:#3d3535}
.highlight .cm { color: #888888 } /* Comment.Multiline */ .highlight .g{color:#7f9f7f}
.highlight .cp { color: #cc0000; font-weight: bold } /* Comment.Preproc */ .highlight .k{color:#f0dfaf}
.highlight .c1 { color: #888888 } /* Comment.Single */ .highlight .l{color:#ccc}
.highlight .cs { color: #cc0000; font-weight: bold; background-color: #fff0f0 } /* Comment.Special */ .highlight .n{color:#dcdccc}
.highlight .gd { color: #000000; background-color: #ffdddd } /* Generic.Deleted */ .highlight .o{color:#f0efd0}
.highlight .ge { font-style: italic } /* Generic.Emph */ .highlight .x{color:#ccc}
.highlight .gr { color: #aa0000 } /* Generic.Error */ .highlight .p{color:#41706f}
.highlight .gh { color: #303030 } /* Generic.Heading */ .highlight .cm{color:#7f9f7f}
.highlight .gi { color: #000000; background-color: #ddffdd } /* Generic.Inserted */ .highlight .cp{color:#7f9f7f}
.highlight .go { color: #888888 } /* Generic.Output */ .highlight .c1{color:#7f9f7f}
.highlight .gp { color: #555555 } /* Generic.Prompt */ .highlight .cs{color:#cd0000;font-weight:bold}
.highlight .gs { font-weight: bold } /* Generic.Strong */ .highlight .gd{color:#cd0000}
.highlight .gu { color: #606060 } /* Generic.Subheading */ .highlight .ge{color:#ccc;font-style:italic}
.highlight .gt { color: #aa0000 } /* Generic.Traceback */ .highlight .gr{color:red}
.highlight .kc { color: #008800; font-weight: bold } /* Keyword.Constant */ .highlight .gh{color:#dcdccc;font-weight:bold}
.highlight .kd { color: #008800; font-weight: bold } /* Keyword.Declaration */ .highlight .gi{color:#00cd00}
.highlight .kn { color: #008800; font-weight: bold } /* Keyword.Namespace */ .highlight .go{color:gray}
.highlight .kp { color: #008800 } /* Keyword.Pseudo */ .highlight .gp{color:#dcdccc;font-weight:bold}
.highlight .kr { color: #008800; font-weight: bold } /* Keyword.Reserved */ .highlight .gs{color:#ccc;font-weight:bold}
.highlight .kt { color: #888888; font-weight: bold } /* Keyword.Type */ .highlight .gu{color:purple;font-weight:bold}
.highlight .m { color: #0000DD; font-weight: bold } /* Literal.Number */ .highlight .gt{color:#0040D0}
.highlight .s { color: #dd2200; background-color: #fff0f0 } /* Literal.String */ .highlight .kc{color:#dca3a3}
.highlight .na { color: #336699 } /* Name.Attribute */ .highlight .kd{color:#ffff86}
.highlight .nb { color: #003388 } /* Name.Builtin */ .highlight .kn{color:#dfaf8f;font-weight:bold}
.highlight .nc { color: #bb0066; font-weight: bold } /* Name.Class */ .highlight .kp{color:#cdcf99}
.highlight .no { color: #003366; font-weight: bold } /* Name.Constant */ .highlight .kr{color:#cdcd00}
.highlight .nd { color: #555555 } /* Name.Decorator */ .highlight .kt{color:#00cd00}
.highlight .ne { color: #bb0066; font-weight: bold } /* Name.Exception */ .highlight .ld{color:#cc9393}
.highlight .nf { color: #0066bb; font-weight: bold } /* Name.Function */ .highlight .m{color:#8cd0d3}
.highlight .nl { color: #336699; font-style: italic } /* Name.Label */ .highlight .s{color:#cc9393}
.highlight .nn { color: #bb0066; font-weight: bold } /* Name.Namespace */ .highlight .na{color:#9ac39f}
.highlight .py { color: #336699; font-weight: bold } /* Name.Property */ .highlight .nb{color:#efef8f}
.highlight .nt { color: #bb0066; font-weight: bold } /* Name.Tag */ .highlight .nc{color:#efef8f}
.highlight .nv { color: #336699 } /* Name.Variable */ .highlight .no{color:#ccc}
.highlight .ow { color: #008800 } /* Operator.Word */ .highlight .nd{color:#ccc}
.highlight .w { color: #bbbbbb } /* Text.Whitespace */ .highlight .ni{color:#c28182}
.highlight .mf { color: #0000DD; font-weight: bold } /* Literal.Number.Float */ .highlight .ne{color:#c3bf9f;font-weight:bold}
.highlight .mh { color: #0000DD; font-weight: bold } /* Literal.Number.Hex */ .highlight .nf{color:#efef8f}
.highlight .mi { color: #0000DD; font-weight: bold } /* Literal.Number.Integer */ .highlight .nl{color:#ccc}
.highlight .mo { color: #0000DD; font-weight: bold } /* Literal.Number.Oct */ .highlight .nn{color:#8fbede}
.highlight .sb { color: #dd2200; background-color: #fff0f0 } /* Literal.String.Backtick */ .highlight .nx{color:#ccc}
.highlight .sc { color: #dd2200; background-color: #fff0f0 } /* Literal.String.Char */ .highlight .py{color:#ccc}
.highlight .sd { color: #dd2200; background-color: #fff0f0 } /* Literal.String.Doc */ .highlight .nt{color:#9ac39f}
.highlight .s2 { color: #dd2200; background-color: #fff0f0 } /* Literal.String.Double */ .highlight .nv{color:#dcdccc}
.highlight .se { color: #0044dd; background-color: #fff0f0 } /* Literal.String.Escape */ .highlight .ow{color:#f0efd0}
.highlight .sh { color: #dd2200; background-color: #fff0f0 } /* Literal.String.Heredoc */ .highlight .w{color:#ccc}
.highlight .si { color: #3333bb; background-color: #fff0f0 } /* Literal.String.Interpol */ .highlight .mf{color:#8cd0d3}
.highlight .sx { color: #22bb22; background-color: #f0fff0 } /* Literal.String.Other */ .highlight .mh{color:#8cd0d3}
.highlight .sr { color: #008800; background-color: #fff0ff } /* Literal.String.Regex */ .highlight .mi{color:#8cd0d3}
.highlight .s1 { color: #dd2200; background-color: #fff0f0 } /* Literal.String.Single */ .highlight .mo{color:#8cd0d3}
.highlight .ss { color: #aa6600; background-color: #fff0f0 } /* Literal.String.Symbol */ .highlight .sb{color:#cc9393}
.highlight .bp { color: #003388 } /* Name.Builtin.Pseudo */ .highlight .sc{color:#cc9393}
.highlight .vc { color: #336699 } /* Name.Variable.Class */ .highlight .sd{color:#cc9393}
.highlight .vg { color: #dd7700 } /* Name.Variable.Global */ .highlight .s2{color:#cc9393}
.highlight .vi { color: #3333bb } /* Name.Variable.Instance */ .highlight .se{color:#cc9393}
.highlight .il { color: #0000DD; font-weight: bold } /* Literal.Number.Integer.Long */ .highlight .sh{color:#cc9393}
.highlight .si{color:#cc9393}
.highlight .sx{color:#cc9393}
.highlight .sr{color:#cc9393}
.highlight .s1{color:#cc9393}
.highlight .ss{color:#cc9393}
.highlight .bp{color:#efef8f}
.highlight .vc{color:#efef8f}
.highlight .vg{color:#dcdccc}
.highlight .vi{color:#ffffc7}
.highlight .il{color:#8cd0d3}

4
_src/_assets/styles/bigchain/_team.scss
View File

@ -23,11 +23,11 @@
// the bottom line // the bottom line
&:after { &:after {
content: ""; content: "";
height: 2px; height: 1px;
width: 3rem; width: 3rem;
display: block; display: block;
margin: ($spacer / 2) auto; margin: ($spacer / 2) auto;
background: $gray-lightest; background: $brand-main-blue-light;
} }
} }

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

@ -10,7 +10,7 @@
@extend .h1; @extend .h1;
content: "Table Of Contents"; content: "Table Of Contents";
display: block; display: block;
border-bottom: 2px solid $gray-lightest; border-bottom: 1px solid $brand-main-blue-light;
padding-bottom: $spacer; padding-bottom: $spacer;
margin-bottom: ($spacer * 2); margin-bottom: ($spacer * 2);
text-align: center; text-align: center;

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

@ -7,21 +7,20 @@
// //
// Colors // Colors
// //
$brand-main-blue: #275B82 !default; $brand-main-blue: #074354 !default;
$brand-main-blue-light: #BFE6EC !default;
$brand-main-blue-dark: #101A25 !default; $brand-main-blue-dark: #101A25 !default;
$brand-main-violet: #D98FD9 !default;
$brand-main-gray: #70859B !default; $brand-main-gray: #70859B !default;
$brand-main-brown: #B56D00 !default; $gray-darker: darken($brand-main-gray, 25%) !default;
$brand-main-light: #FFFFFF !default;
$gray-dark: darken($brand-main-gray, 20%) !default; $gray-dark: darken($brand-main-gray, 20%) !default;
$gray: $brand-main-gray !default; $gray: $brand-main-gray !default;
$gray-light: lighten($brand-main-gray, 20%) !default; $gray-light: lighten($brand-main-gray, 20%) !default;
$gray-lighter: lighten($brand-main-gray, 30%) !default; $gray-lighter: lighten($brand-main-gray, 30%) !default;
$gray-lightest: lighten($brand-main-gray, 40%) !default; $gray-lightest: lighten($brand-main-gray, 40%) !default;
$brand-primary: $brand-main-blue !default; $brand-primary: $brand-main-violet !default;
$brand-success: #388250 !default; $brand-success: #388250 !default;
$brand-info: #3E91CE !default; $brand-info: #3E91CE !default;
$brand-warning: #8E8E24 !default; $brand-warning: #8E8E24 !default;
@ -61,17 +60,17 @@ $line-height: 1.5 !default;
$headings-font-family: $font-family-fira !default; $headings-font-family: $font-family-fira !default;
$headings-font-weight: $font-weight-light !default; $headings-font-weight: $font-weight-light !default;
$headings-line-height: 1.2 !default; $headings-line-height: 1.2 !default;
$headings-color: $brand-main-gray !default; $headings-color: $brand-main-blue-light !default;
// //
// Scaffolding // Scaffolding
// //
$body-bg: #fff !default; $body-bg: $gray-dark !default;
$text-color: $gray-dark !default; $text-color: $gray-lighter !default;
$link-color: $brand-main-brown !default; $link-color: $brand-primary !default;
$link-hover-color: darken($link-color, 15%) !default; $link-hover-color: lighten($link-color, 15%) !default;
// //
@ -112,14 +111,14 @@ $gutter-space: ($spacer * 3) !default;
// //
// Code // Code
// //
$code-color: #c7254e !default; $code-color: $text-color !default;
$code-bg: #f9f2f4 !default; $code-bg: $gray-darker !default;
$kbd-color: #fff !default; $kbd-color: $code-color !default;
$kbd-bg: #333 !default; $kbd-bg: $code-bg !default;
$pre-bg: #f5f5f5 !default; $pre-bg: $code-bg !default;
$pre-color: $gray-dark !default; $pre-color: $code-color !default;
$pre-scrollable-max-height: 340px !default; $pre-scrollable-max-height: 340px !default;
@ -133,8 +132,8 @@ $btn-padding-x: 1.5rem !default;
$btn-padding-y: .375rem !default; $btn-padding-y: .375rem !default;
$btn-primary-color: #fff !default; $btn-primary-color: #fff !default;
$btn-primary-bg: $brand-main-brown !default; $btn-primary-bg: $link-color !default;
$btn-primary-border: $brand-main-brown !default; $btn-primary-border: $link-color !default;
$btn-secondary-color: $gray-dark !default; $btn-secondary-color: $gray-dark !default;
$btn-secondary-bg: $gray-lightest !default; $btn-secondary-bg: $gray-lightest !default;
@ -184,13 +183,13 @@ $input-font-weight: $font-weight-normal !default;
$input-padding-x: .5rem !default; $input-padding-x: .5rem !default;
$input-padding-y: 0 !default; $input-padding-y: 0 !default;
$input-bg: rgba(255,255,255,.1) !default; $input-bg: transparent !default;
$input-bg-disabled: $gray-lighter !default; $input-bg-disabled: $gray-darker !default;
$input-color: $gray-dark !default; $input-color: $text-color !default;
$input-border-color: $gray-lighter !default; $input-border-color: $gray !default;
$input-border-focus: $gray !default; $input-border-focus: $gray-light !default;
$input-color-placeholder: $gray !default; $input-color-placeholder: $gray !default;

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

@ -16,8 +16,6 @@
} }
.section-community { .section-community {
@extend .background--light;
.grid h1 { @extend .h3; } .grid h1 { @extend .h3; }
.icon--social { .icon--social {
@ -43,7 +41,7 @@
top: 0; top: 0;
bottom: 0; bottom: 0;
right: 0; right: 0;
background: linear-gradient(to top left, $brand-main-blue 0%, $brand-main-brown 100%); background: linear-gradient(to top left, $brand-main-blue 0%, $brand-main-violet 100%);
opacity: .7; opacity: .7;
z-index: 0; z-index: 0;
} }

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

@ -1,6 +1,6 @@
.section-difference { .section-difference {
@extend .background--gray;
} }
.difference { .difference {
@ -18,8 +18,6 @@
.difference__text { .difference__text {
flex: 0 0 80%; flex: 0 0 80%;
.section-difference & { color: #fff; }
} }
@ -40,7 +38,7 @@
top: 0; top: 0;
bottom: 0; bottom: 0;
right: 0; right: 0;
background: linear-gradient(to top left, $brand-main-blue 0%, $brand-main-brown 100%); background: linear-gradient(to top left, $brand-main-blue 0%, $brand-main-violet 100%);
opacity: .7; opacity: .7;
z-index: 0; z-index: 0;
} }

2
_src/_assets/styles/page-front.scss
View File

@ -6,7 +6,6 @@
.section-features { .section-features {
text-align: center; text-align: center;
border-bottom: 1px solid lighten($brand-main-gray, 40%);
figure { figure {
display: block; display: block;
@ -18,7 +17,6 @@
display: block; display: block;
margin: auto; margin: auto;
margin-bottom: $spacer; margin-bottom: $spacer;
stroke: $brand-main-gray;
} }
} }

13
_src/_assets/styles/page-styleguide.scss
View File

@ -8,8 +8,9 @@
padding: ($spacer / 2); padding: ($spacer / 2);
margin-bottom: 5px; margin-bottom: 5px;
border-radius: $border-radius; border-radius: $border-radius;
border: 1px solid #eee; border: 1px solid $gray-darker;
min-height: 70px; min-height: 70px;
text-align: center;
&, &,
.color-meta { @extend .transition; } .color-meta { @extend .transition; }
@ -17,7 +18,7 @@
.color-meta { .color-meta {
display: block; display: block;
font-family: $font-family-monospace; font-family: $font-family-monospace;
font-size: 9px; font-size: 11px;
color: #fff; color: #fff;
vertical-align: middle; vertical-align: middle;
opacity: 0; opacity: 0;
@ -32,8 +33,7 @@
.color-hex { .color-hex {
margin-top: 5px; margin-top: 5px;
font-size: 11px !important; font-size: 16px !important;
text-align: center;
border-top: 1px solid #777; border-top: 1px solid #777;
padding-top: 5px; padding-top: 5px;
} }
@ -41,11 +41,12 @@
// colors // colors
.brand-main-blue { background: $brand-main-blue } .brand-main-blue { background: $brand-main-blue }
.brand-main-blue-light { background: $brand-main-blue-light }
.brand-main-blue-dark { background: $brand-main-blue-dark } .brand-main-blue-dark { background: $brand-main-blue-dark }
.brand-main-gray { background: $brand-main-gray } .brand-main-gray { background: $brand-main-gray }
.brand-main-brown { background: $brand-main-brown } .brand-main-violet { background: $brand-main-violet }
.brand-main-light { background: $brand-main-light }
.gray-darker { background: $gray-darker }
.gray-dark { background: $gray-dark } .gray-dark { background: $gray-dark }
.gray { background: $gray } .gray { background: $gray }
.gray-light { background: $gray-light } .gray-light { background: $gray-light }

10
_src/_data/colors.yml
View File

@ -5,20 +5,22 @@
primary: primary:
- name: brand-main-blue - name: brand-main-blue
hex: 275B82 hex: 275B82
- name: brand-main-violet
hex: D98FD9
- name: brand-main-blue-dark - name: brand-main-blue-dark
hex: 101A25 hex: 101A25
- name: brand-main-blue-light
hex: BFE6EC
- name: brand-main-gray - name: brand-main-gray
hex: 70859B hex: 70859B
- name: brand-main-brown
hex: B56D00
- name: brand-main-light
hex: FFFFFF
# #
# Grays # Grays
# #
grays: grays:
- name: gray-darker
hex: 2f3943
- name: gray-dark - name: gray-dark
hex: 445261 hex: 445261
- name: gray - name: gray

2
_src/features.html
View File

@ -25,7 +25,7 @@ title: Features
</section> </section>
<section class="section section-difference"> <section class="section section-difference background--darker">
<div class="row"> <div class="row">
<header class="section-header"> <header class="section-header">
<h1 class="section-title">Bigchain is different.</h1> <h1 class="section-title">Bigchain is different.</h1>

4
_src/index.html
View File

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

6
_src/styleguide.md
View File

@ -9,7 +9,7 @@ sitemap: false
### Primary ### Primary
<div class="grid grid--gutters grid--full grid-medium--fit"> <div class="grid grid--gutters grid--full grid-medium--third">
{% for color in site.data.colors.primary %} {% for color in site.data.colors.primary %}
<div class="grid__col"> <div class="grid__col">
<div class="color {{ color.name }}"> <div class="color {{ color.name }}">
@ -22,7 +22,7 @@ sitemap: false
### Grays ### Grays
<div class="grid grid--gutters grid--full grid-medium--fit"> <div class="grid grid--gutters grid--full grid-medium--third">
{% for color in site.data.colors.grays %} {% for color in site.data.colors.grays %}
<div class="grid__col"> <div class="grid__col">
<div class="color {{ color.name }}"> <div class="color {{ color.name }}">
@ -35,7 +35,7 @@ sitemap: false
### Errors ### Errors
<div class="grid grid--gutters grid--full grid-medium--fit"> <div class="grid grid--gutters grid--full grid-medium--third">
{% for color in site.data.colors.errors %} {% for color in site.data.colors.errors %}
<div class="grid__col"> <div class="grid__col">
<div class="color {{ color.name }}"> <div class="color {{ color.name }}">