feat(team): restore employees carousel matching live markup

content/team/employees.md

@@ -4,39 +4,30 @@ weight = 20
 
 [extra]
 anchor = "employees"
+layout = "carousel"
+
+[[extra.slides]]
+name = "Frau Berscheidt"
+image = "Berscheidt.jpg"
+description = "Medizinische Fachangestellte, Diabetes-Assistentin"
+
+[[extra.slides]]
+name = "Frau Bolz"
+image = "Bolz.jpg"
+description = "Medizinische Fachangestellte"
+
+[[extra.slides]]
+name = "Frau Frohne"
+image = "Frohne.jpg"
+description = "Medizinische Fachangestellte"
+
+[[extra.slides]]
+name = "Frau Merhof"
+image = "Merhof.jpg"
+description = "Medizinische Fachangestellte"
+
+[[extra.slides]]
+name = "Frau Rodrigues"
+image = "Rodrigues.jpg"
+description = "Medizinische Fachangestellte"
 +++
-
-{{ img(src="team/Berscheidt.jpg", width=200, alt="Frau Berscheidt", class="float-right") }}
-
-**Frau Berscheidt**
-Medizinische Fachangestellte, Diabetes-Assistentin
-
-<div class="clearfix"></div>
-
-{{ img(src="team/Bolz.jpg", width=200, alt="Frau Bolz", class="float-right") }}
-
-**Frau Bolz**
-Medizinische Fachangestellte
-
-<div class="clearfix"></div>
-
-{{ img(src="team/Frohne.jpg", width=200, alt="Frau Frohne", class="float-right") }}
-
-**Frau Frohne**
-Medizinische Fachangestellte
-
-<div class="clearfix"></div>
-
-{{ img(src="team/Merhof.jpg", width=200, alt="Frau Merhof", class="float-right") }}
-
-**Frau Merhof**
-Medizinische Fachangestellte
-
-<div class="clearfix"></div>
-
-{{ img(src="team/Rodrigues.jpg", width=200, alt="Frau Rodrigues", class="float-right") }}
-
-**Frau Rodrigues**
-Medizinische Fachangestellte
-
-<div class="clearfix"></div>

templates/macros/team_carousel.html

@@ -0,0 +1,42 @@
+{% macro team_carousel(title, anchor, slides) %}
+<section class="employees">
+  <section class="section-title">
+    <div class="container text-center">
+      {%- if anchor %}
+      <div class="anchor" id="{{ anchor }}">
+        <h2>{{ title }}</h2>
+      </div>
+      {%- else %}
+      <h2>{{ title }}</h2>
+      {%- endif %}
+      <span class="bordered-icon"><i class="fa fa-circle-thin"></i></span>
+    </div>
+  </section>
+
+  <div class="container">
+    <div id="employeesSlider" class="carousel slide" data-ride="carousel">
+      <div class="carousel-inner" role="listbox">
+        {%- for slide in slides %}
+        <div class="item{% if loop.first %} active{% endif %}">
+          <blockquote>
+            <ul>
+              <li><img src="/images/team/{{ slide.image }}" alt="{{ slide.name }}"></li>
+              <li class="name">{{ slide.name }}</li>
+            </ul>
+            <p>{{ slide.description }}</p>
+          </blockquote>
+        </div>
+        {%- endfor %}
+      </div>
+      <a class="left carousel-control" href="#employeesSlider" role="button" data-slide="prev">
+        <span><i class="fa fa-angle-left"></i></span>
+        <span class="sr-only">Previous</span>
+      </a>
+      <a class="right carousel-control" href="#employeesSlider" role="button" data-slide="next">
+        <span><i class="fa fa-angle-right"></i></span>
+        <span class="sr-only">Next</span>
+      </a>
+    </div>
+  </div>
+</section>
+{% endmacro %}

templates/section.html

@@ -1,6 +1,7 @@
 {% extends "base.html" %}
 {% import "macros/section_title.html" as st %}
 {% import "macros/page_title.html" as pt %}
+{% import "macros/team_carousel.html" as tc %}
 
 {% block content %}
 
@@ -15,6 +16,13 @@
 {% endif %}
 
 {% for page in section.pages %}
+  {% set layout = page.extra.layout | default(value="") %}
+  {% if layout == "carousel" %}
+    {{ tc::team_carousel(
+         title=page.title,
+         anchor=page.extra.anchor | default(value=page.slug),
+         slides=page.extra.slides) }}
+  {% else %}
     <section class="text ptb-text">
       {{ st::section_title(title=page.title, anchor=page.extra.anchor | default(value=page.slug)) }}
       <div class="container">
@@ -23,6 +31,7 @@
         </div>
       </div>
     </section>
+  {% endif %}
 {% endfor %}
 
 {% endblock %}