diff --git a/_src/_assets/img/starbase-bicycle.svg b/_src/_assets/img/starbase-bicycle.svg
new file mode 100644
index 0000000..ab72f96
--- /dev/null
+++ b/_src/_assets/img/starbase-bicycle.svg
@@ -0,0 +1,18 @@
+
diff --git a/_src/_assets/img/starbase-rocket.svg b/_src/_assets/img/starbase-rocket.svg
new file mode 100644
index 0000000..358ece5
--- /dev/null
+++ b/_src/_assets/img/starbase-rocket.svg
@@ -0,0 +1,14 @@
+
diff --git a/_src/_assets/img/starbase-stones.svg b/_src/_assets/img/starbase-stones.svg
new file mode 100644
index 0000000..363e1b9
--- /dev/null
+++ b/_src/_assets/img/starbase-stones.svg
@@ -0,0 +1,15 @@
+
diff --git a/_src/_assets/img/starbase-towers.svg b/_src/_assets/img/starbase-towers.svg
new file mode 100644
index 0000000..78b35df
--- /dev/null
+++ b/_src/_assets/img/starbase-towers.svg
@@ -0,0 +1,92 @@
+
diff --git a/_src/_assets/scss/_hero.scss b/_src/_assets/scss/_hero.scss
index a264201..e368211 100644
--- a/_src/_assets/scss/_hero.scss
+++ b/_src/_assets/scss/_hero.scss
@@ -4,13 +4,14 @@ $edge-height: $spacer * 4;
.hero {
background: $brand-07;
padding-top: $spacer * 2;
- padding-bottom: $spacer * 2;
- min-height: calc(100vh - #{$edge-height-sm});
+ padding-bottom: 0;
+ height: calc(100vh - #{$edge-height-sm});
+ min-height: 580px;
margin-bottom: $edge-height-sm;
position: relative;
@media ($screen-sm) {
- min-height: calc(100vh - #{$edge-height});
+ height: calc(100vh - #{$edge-height});
margin-bottom: $edge-height;
}
@@ -31,12 +32,6 @@ $edge-height: $spacer * 4;
}
}
- &,
- .hero__title,
- .hero__action {
- color: #fff;
- }
-
.menu--main {
background: $brand-03;
position: absolute;
@@ -63,28 +58,72 @@ $edge-height: $spacer * 4;
}
.menu__link {
- color: rgba(#fff, .8);
+ color: rgba($brand-05, .8);
&:after {
- background: rgba(#fff, .8);
+ background: rgba($brand-05, .8);
}
&:hover,
&:focus,
&.active {
- color: #fff;
+ color: $brand-05;
&:after {
- background: #fff;
+ background: $brand-05;
}
.logo {
- fill: #fff;
+ fill: $brand-05;
}
}
}
.logo {
- fill: rgba(#fff, .95);
+ fill: rgba($brand-05, .95);
}
}
+
+.hero__title {
+ color: $brand-05;
+ font-size: $font-size-h1 * 1.2;
+ margin-bottom: $spacer;
+}
+
+.hero__description {
+ font-size: $font-size-large;
+ margin-top: 0;
+ margin-bottom: $spacer * 2;
+ color: $brand-02;
+ line-height: $line-height;
+}
+
+
+//
+// Le star base
+//
+.starbase {
+ position: absolute;
+ bottom: 0;
+ width: 100%;
+ border-bottom: 4.5rem solid $brand-02;
+ align-self: flex-end;
+
+ .row {
+ display: flex;
+ justify-content: space-between;
+ align-items: flex-end;
+ }
+}
+
+.starbase__item--stones {
+ margin-bottom: -1rem;
+}
+
+.starbase__item--bicycle {
+ margin-bottom: -3rem;
+}
+
+.starbase__item--towers {
+ margin-bottom: -4.5rem;
+}
diff --git a/_src/_data/content-front.yml b/_src/_data/content-front.yml
index fc93991..7678963 100644
--- a/_src/_data/content-front.yml
+++ b/_src/_data/content-front.yml
@@ -1,6 +1,6 @@
hero:
- title: "The blockchain database platform for the decentralized stack"
-
+ title: "The blockchain database network for the decentralized stack"
+ description: "IPDB is a ready-to-use public network with a focus on strong governance, all powered by BigchainDB."
intro:
title: "A planetary-scale blockchain database"
diff --git a/_src/foundation/index.html b/_src/foundation/index.html
index 5fc8432..ebd534b 100644
--- a/_src/foundation/index.html
+++ b/_src/foundation/index.html
@@ -12,7 +12,7 @@ css: page-foundation