Skip to content

Commit 197ccbe

Browse files
dashdashzakodashdashzako
committed
Update homepage robots section and rework styles
1 parent fdae0c6 commit 197ccbe

File tree

11 files changed

+138
-102
lines changed

11 files changed

+138
-102
lines changed

‎_data/i18n.yml

+40
Original file line numberDiff line numberDiff line change
@@ -5,3 +5,43 @@ legal:
55
contact_us:
66
en: Contact us
77
fr: Contactez-nous
8+
9+
index:
10+
creatures:
11+
title:
12+
en: Poppy Robots
13+
fr: Les robots Poppy
14+
humanoid_cta:
15+
en: Learn more about Poppy Humanoid
16+
fr: Découvrez Poppy Humanoid
17+
torso_cta:
18+
en: Learn more about Poppy Torso
19+
fr: Découvrez Poppy Torso
20+
ergo_cta:
21+
en: Learn more about Ergo Jr
22+
fr: Découvrez Ergo Jr
23+
24+
robots:
25+
humanoid:
26+
image_alt:
27+
en: A standing Poppy Humanoid robot
28+
fr: Un Poppy Humanoid debout
29+
description:
30+
en: Poppy Humanoid is the flagship creature. It is aesthetic, modular, and parametric. From a single arm to the complete humanoid, this platform is actively used in labs, engineering schools, FabLabs, and artistic projects.
31+
fr: Le premier robot humanoide imprimé en 3D ! Du haut de ses 85cm et pour seulement 3.5kg, Poppy Humanoid est esthétique et modulaire. Ses 25 moteurs lui offre une capacité de mouvement unique, en faisant une plateforme de choix dans les laboratoires, les écoles d'ingénieurs, les FabLabs et pour les projets artistiques.
32+
torso:
33+
image_alt:
34+
en: A facing Poppy Torso
35+
fr: Un Poppy Torso de face
36+
description:
37+
en: Poppy Torso is an humanoid robot torso meant to be used in contexts
38+
such as education, FabLabs or research projects.
39+
fr: Poppy Torso est une version simplifiée de Poppy Humanoid. Moins cher, à poser sur son bureau, il est particulièrement adapté pour des usages en classe, dans les fablabs ou toutes sortes de manifestations publiques.
40+
ergo:
41+
image_alt:
42+
en: An Ergo Jr on a table
43+
fr: Un Ergo Jr sur une table
44+
description:
45+
en: Poppy Ergo Jr was first developed for an exhibition mixing art and
46+
science. With only 6 motors it is the perfect project to start.
47+
fr: Du haut de ses 6 moteurs, Poppy Ergo Jr est la plus accessible de nos créations. Il est peu cher, transportable et facilement customisable. Parfaitement adapté aux débutants et aux plus jeunes, il permet de s'initier à la robotique grâce à une série d'activités clef en main.

‎_includes/index/creatures.html

+34
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
<section class="creatures tc">
2+
<h2 class="small-centered clish">{{ site.data.i18n.index.creatures.title[page.lang] }}</h2>
3+
4+
<div class="row" data-equalizer data-equalize-on="large">
5+
6+
<div class="large-4 columns creature">
7+
<div data-equalizer-watch>
8+
{% include robots/humanoid.html %}
9+
</div>
10+
<div class="cta">
11+
<a href="{{ site.baseurl }}/{{ page.lang }}/robots/poppy-humanoid">{{ site.data.i18n.index.creatures.humanoid_cta[page.lang] }}</a>
12+
</div>
13+
</div>
14+
15+
<div class="large-4 columns creature">
16+
<div data-equalizer-watch>
17+
{% include robots/torso.html %}
18+
</div>
19+
<div class="cta">
20+
<a href="{{ site.baseurl }}/{{ page.lang }}/robots/poppy-torso">{{ site.data.i18n.index.creatures.torso_cta[page.lang] }}</a>
21+
</div>
22+
</div>
23+
24+
<div class="large-4 columns creature">
25+
<div data-equalizer-watch>
26+
{% include robots/ergo.html %}
27+
</div>
28+
<div class="cta">
29+
<a href="{{ site.baseurl }}/{{ page.lang }}/robots/poppy-ergo-jr">{{ site.data.i18n.index.creatures.ergo_cta[page.lang] }}</a>
30+
</div>
31+
</div>
32+
33+
</div>
34+
</section>

‎_includes/robots/ergo.html

+7
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
<figure>
2+
<img width="188" height="188" src="{{ site.baseurl }}/assets/img/creatures/small/ergo.jpg" data-interchange="[{{ site.baseurl }}/assets/img/creatures/large/ergo.jpg, retina]" alt="{{ site.data.i18n.robots.ergo.image_alt[page.lang] }}">
3+
</figure>
4+
<h3>Ergo Jr</h3>
5+
<p>
6+
{{ site.data.i18n.robots.ergo.description[page.lang] }}
7+
</p>

‎_includes/robots/humanoid.html

+7
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
<figure>
2+
<img width="188" height="188" src="{{ site.baseurl }}/assets/img/creatures/small/humanoid.jpg" data-interchange="[{{ site.baseurl }}/assets/img/creatures/large/humanoid.jpg, retina]" alt="{{ site.data.i18n.robots.humanoid.image_alt[page.lang] }}">
3+
</figure>
4+
<h3>Poppy Humanoid</h3>
5+
<p>
6+
{{ site.data.i18n.robots.humanoid.description[page.lang] }}
7+
</p>

‎_includes/robots/torso.html

+7
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
<figure>
2+
<img width="188" height="188" src="{{ site.baseurl }}/assets/img/creatures/small/torso.jpg" data-interchange="[{{ site.baseurl }}/assets/img/creatures/large/torso.jpg, retina]" alt="{{ site.data.i18n.robots.torso.image_alt[page.lang] }}">
3+
</figure>
4+
<h3>Poppy Torso</h3>
5+
<p>
6+
{{ site.data.i18n.robots.torso.description[page.lang] }}
7+
</p>

‎_pages/index/en.html

+1-41
Original file line numberDiff line numberDiff line change
@@ -102,46 +102,6 @@ <h2 class="clish">
102102
</p>
103103
</div>
104104

105-
<section class="creatures tc">
106-
<h2 class="small-centered clish">Poppy Robots</h2>
107-
108-
<div class="row" data-equalizer data-equalize-on="large">
109-
110-
<a href="{{ site.baseurl }}/{{ page.lang }}/robots/poppy-humanoid" class="large-4 columns creature" data-equalizer-watch>
111-
<figure>
112-
<img width="188" height="188" src="{{ site.baseurl }}/assets/img/creatures/small/humanoid.jpg" data-interchange="[{{ site.baseurl }}/assets/img/creatures/large/humanoid.jpg, retina]" alt="A sitting Poppy Humanoid robot">
113-
</figure>
114-
<h3>Poppy Humanoid</h3>
115-
<p>
116-
Poppy Humanoid is the flagship creature. It is aesthetic, modular,
117-
and parametric. From a single arm to the complete humanoid, this
118-
platform is actively used in labs, engineering schools, FabLabs, and
119-
artistic projects.
120-
</p>
121-
</a>
122-
123-
<a href="{{ site.baseurl }}/{{ page.lang }}/robots/poppy-torso" class="large-4 columns creature" data-equalizer-watch>
124-
<figure>
125-
<img width="188" height="188" src="{{ site.baseurl }}/assets/img/creatures/small/torso.jpg" data-interchange="[{{ site.baseurl }}/assets/img/creatures/large/torso.jpg, retina]" alt="Facing Poppy Torso">
126-
</figure>
127-
<h3>Poppy Torso</h3>
128-
<p>
129-
Poppy Torso is an humanoid robot torso meant to be used in contexts
130-
such as education, FabLabs or research projects.
131-
</p>
132-
</a>
133-
134-
<a href="{{ site.baseurl }}/{{ page.lang }}/robots/poppy-ergo-jr" class="large-4 columns creature" data-equalizer-watch>
135-
<figure>
136-
<img width="188" height="188" src="{{ site.baseurl }}/assets/img/creatures/small/ergo.jpg" data-interchange="[{{ site.baseurl }}/assets/img/creatures/large/ergo.jpg, retina]" alt="Ergo close-up">
137-
</figure>
138-
<h3>Poppy Ergo Jr</h3>
139-
<p>
140-
Poppy Ergo Jr was first developed for an exhibition mixing art and
141-
science. With only 6 motors it is the perfect project to start.
142-
</p>
143-
</a>
144-
</div>
145-
</section>
105+
{% include index/creatures.html %}
146106

147107
{% include sponsors.html %}

‎_pages/index/fr.html

+1-36
Original file line numberDiff line numberDiff line change
@@ -103,41 +103,6 @@ <h2 class="clish">
103103
</p>
104104
</div>
105105

106-
<section class="creatures tc">
107-
<h2 class="small-centered clish">Robots Poppy</h2>
108-
109-
<div class="row" data-equalizer data-equalize-on="large">
110-
111-
<a href="{{ site.baseurl }}/{{ page.lang }}/robots/poppy-humanoid" class="large-4 columns creature" data-equalizer-watch>
112-
<figure>
113-
<img width="188" height="188" src="{{ site.baseurl }}/assets/img/creatures/small/humanoid.jpg" data-interchange="[{{ site.baseurl }}/assets/img/creatures/large/humanoid.jpg, retina]" alt="A sitting Poppy Humanoid robot">
114-
</figure>
115-
<h3>Poppy Humanoid</h3>
116-
<p>
117-
Le premier robot humanoide imprimé en 3D ! Du haut de ses 85cm et pour seulement 3.5kg, Poppy Humanoid est esthétique et modulaire. Ses 25 moteurs lui offre une capacité de mouvement unique, en faisant une plateforme de choix dans les laboratoires, les écoles d'ingénieurs, les FabLabs et pour les projets artistiques.
118-
</p>
119-
</a>
120-
121-
<a href="{{ site.baseurl }}/{{ page.lang }}/robots/poppy-torso" class="large-4 columns creature" data-equalizer-watch>
122-
<figure>
123-
<img width="188" height="188" src="{{ site.baseurl }}/assets/img/creatures/small/torso.jpg" data-interchange="[{{ site.baseurl }}/assets/img/creatures/large/torso.jpg, retina]" alt="Facing Poppy Torso">
124-
</figure>
125-
<h3>Poppy Torso</h3>
126-
<p>
127-
Poppy Torso est une version simplifiée de Poppy Humanoid. Moins cher, à poser sur son bureau, il est particulièrement adapté pour des usages en classe, dans les fablabs ou toutes sortes de manifestations publiques.
128-
</p>
129-
</a>
130-
131-
<a href="{{ site.baseurl }}/{{ page.lang }}/robots/poppy-ergo-jr" class="large-4 columns creature" data-equalizer-watch>
132-
<figure>
133-
<img width="188" height="188" src="{{ site.baseurl }}/assets/img/creatures/small/ergo.jpg" data-interchange="[{{ site.baseurl }}/assets/img/creatures/large/ergo.jpg, retina]" alt="Ergo close-up">
134-
</figure>
135-
<h3>Poppy Ergo Jr</h3>
136-
<p>
137-
Du haut de ses 6 moteurs, Poppy Ergo Jr est la plus accessible de nos créations. Il est peu cher, transportable et facilement customisable. Parfaitement adapté aux débutants et aux plus jeunes, il permet de s'initier à la robotique grâce à une série d'activités clef en main.
138-
</p>
139-
</a>
140-
</div>
141-
</section>
106+
{% include index/creatures.html %}
142107

143108
{% include sponsors.html %}

‎_sass/_layout.scss

+17-20
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,21 @@
66
}
77
}
88

9+
@mixin call-to-action($button-color: primary, $button-style: solid, $button-expand: true) {
10+
margin-top: 1rem;
11+
12+
@if $button-style == solid {
13+
a {
14+
@include button($expand: $button-expand);
15+
}
16+
}
17+
@else if $button-style == hollow {
18+
a {
19+
@include button($expand: $button-expand, $background: map-get($foundation-palette, $button-color), $style: $button-style);
20+
}
21+
}
22+
}
23+
924
.clear {
1025
@include clearfix;
1126
}
@@ -199,30 +214,12 @@
199214
}
200215
}
201216

202-
.creatures {
203-
204-
padding-top: 20px;
205-
padding-bottom: 20px;
206-
207-
color: $white;
208-
background-color: #162B38;
209-
210-
@include reverse-links;
211-
212-
figure {
213-
margin: 0 0 20px 0;
214-
215-
img {
216-
border-radius: 50%;
217-
}
218-
}
219-
}
220-
221217
.nodisp {
222218
display: none;
223219
}
224220

225221
@import "poppy/cover";
226222
@import "poppy/lang-switcher";
227223

228-
@import "poppy/audiences";
224+
@import "poppy/index/audiences";
225+
@import "poppy/index/robots";

‎_sass/_settings.scss

+1
Original file line numberDiff line numberDiff line change
@@ -61,6 +61,7 @@ $foundation-palette: (
6161
success: #3adb76,
6262
warning: #ffae00,
6363
alert: #ec5840,
64+
clear: #fefefe,
6465
);
6566
$light-gray: #e6e6e6;
6667
$medium-gray: #cacaca;

‎_sass/poppy/_audiences.scss ‎_sass/poppy/index/_audiences.scss

+1-5
Original file line numberDiff line numberDiff line change
@@ -52,11 +52,7 @@
5252
}
5353

5454
.cta {
55-
margin-top: 1rem;
56-
57-
a {
58-
@include button($expand: true);
59-
}
55+
@include call-to-action(primary, solid);
6056
}
6157
}
6258
}

‎_sass/poppy/index/_robots.scss

+22
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
.creatures {
2+
3+
padding-top: 20px;
4+
padding-bottom: 20px;
5+
6+
color: $white;
7+
background-color: #162B38;
8+
9+
@include reverse-links;
10+
11+
figure {
12+
margin: 0 0 20px 0;
13+
14+
img {
15+
border-radius: 50%;
16+
}
17+
}
18+
19+
.cta {
20+
@include call-to-action(clear, hollow);
21+
}
22+
}

0 commit comments

Comments
 (0)