Extract into partials

source/_partials/experience-item.twig

@@ -1,37 +0,0 @@
-{% set classes = [
-    'experience',
-    'is-flex',
-    company.logo ? 'has-logo',
-    experience.featured ? 'is-featured',
-] %}
-
-<div class="{{ classes|sort|join(' ') }}">
-    <div class="inner">
-        <h2>{{ company.name }}</h2>
-
-        {% if company.website %}
-            <a href="{{ company.website }}" class="experience__website">
-                {{ company.website }}
-            </a>
-        {% endif %}
-
-        <div class="experience__role">
-            {% spaceless %}
-                {{ experience.role ~ ' from ' ~ experience.start ~ ' to ' ~ experience.end|default('Present') }}
-                {% if experience.location %}
-                    ({{ experience.location }})
-                {% endif %}
-            {% endspaceless %}.
-        </div>
-
-        <div class="experience__description">
-            {{ experience.description|raw }}
-        </div>
-    </div>{# /.inner #}
-
-    {% if company.logo %}
-        <div class="experience__logo">
-            <img src="{{ site.images_url }}/assets/images/experience/{{ company.logo }}" alt="{{ company.name }} logo">
-        </div>
-    {% endif %}
-</div>

source/_partials/experience/description.twig

@@ -0,0 +1,3 @@
+<div class="experience__description">
+    {{ experience.description|raw }}
+</div>

source/_partials/experience/item.twig

@@ -0,0 +1,18 @@
+{% set classes = [
+    'experience',
+    'is-flex',
+    company.logo ? 'has-logo',
+    experience.featured ? 'is-featured',
+] %}
+
+<div class="{{ classes|sort|join(' ') }}">
+    <div class="inner">
+        <h2>{{ company.name }}</h2>
+
+        {{ include('experience/website') }}
+        {{ include('experience/role') }}
+        {{ include('experience/description') }}
+    </div>{# /.inner #}
+
+    {{ include('experience/logo') }}
+</div>

source/_partials/experience/logo.twig

@@ -0,0 +1,5 @@
+{% if company.logo %}
+    <div class="experience__logo">
+        <img src="{{ site.images_url }}/assets/images/experience/{{ company.logo }}" alt="{{ company.name }} logo">
+    </div>
+{% endif %}

source/_partials/experience/role.twig

@@ -0,0 +1,8 @@
+<div class="experience__role">
+    {% spaceless %}
+        {{ experience.role ~ ' from ' ~ experience.start ~ ' to ' ~ experience.end|default('Present') }}
+        {% if experience.location %}
+            ({{ experience.location }})
+        {% endif %}
+    {% endspaceless %}.
+</div>

source/_partials/experience/website.twig

@@ -0,0 +1,5 @@
+{% if company.website %}
+    <a href="{{ company.website }}" class="experience__website">
+        {{ company.website }}
+    </a>
+{% endif %}

source/experience.twig

@@ -85,7 +85,7 @@ use: [posts]
 <h1>Experience</h1>
 
 {% for experience in page.experiences %}
-    {% include "experience-item" with {
+    {% include "experience/item" with {
         experience: experience,
         company: site.companies[experience.company]
     } %}