From 37e4e80831a65eed46653c50c0505afa6bdeda8e Mon Sep 17 00:00:00 2001
From: Oliver Davies <oliver@oliverdavies.uk>
Date: Tue, 9 Oct 2018 23:54:23 +0100
Subject: [PATCH] Re-add Experience page

---
 assets/js/components/Navbar.vue |  5 ++++
 source/experience.html.twig     | 44 +++++++++++++++++----------------
 2 files changed, 28 insertions(+), 21 deletions(-)

diff --git a/assets/js/components/Navbar.vue b/assets/js/components/Navbar.vue
index 76809fd0..5f82997c 100644
--- a/assets/js/components/Navbar.vue
+++ b/assets/js/components/Navbar.vue
@@ -56,6 +56,11 @@
             href: '/talks',
             pattern: '^/talks/?',
           },
+          {
+            title: 'Experience',
+            href: '/experience',
+            pattern: '^/experience/?',
+          },
           {
             title: 'Blog',
             href: '/blog',
diff --git a/source/experience.html.twig b/source/experience.html.twig
index 2198f7b7..322e88f0 100644
--- a/source/experience.html.twig
+++ b/source/experience.html.twig
@@ -115,32 +115,34 @@ experiences:
         {% for experience in page.experiences|reverse %}
             {% set company = site.companies[experience.company] %}
 
-            <div class="mb-12">
-                {% if company.logo %}
-                    <div class="float-right mt-2 mb-4 ml-4 w-16 sm:w-24 lg:w-32">
-                        <img src="/images/experience/{{ company.logo }}" alt="{{ company.name }} logo">
-                    </div>
-                {% endif %}
+            <div class="mb-16">
+                <div class="flex flex-row justify-between">
+                    <div>
+                        <h2 class="mb-0">{{ company.name }}</h2>
 
-                <div>
-                    <h2 class="mb-0">{{ company.name }}</h2>
+                        <div class="mb-4">
+                            {% if company.url -%}
+                                <a class="inline-block text-blue mb-1" href="{{ company.url }}?utm_source={{ site.short_url }}&utm_medium=experience">
+                                    {{- company.url -}}
+                                </a>
+                            {%- endif %}
 
-                    <div class="mb-4">
-                        {% if company.url -%}
-                            <a class="inline-block text-blue mb-1" href="{{ company.url }}?utm_source={{ site.short_url }}&utm_medium=experience">
-                                {{- company.url -}}
-                            </a>
-                        {%- endif %}
-
-                        <div class="text-grey-dark">
-                            {{- experience.role }} from {{ experience.start }} to {{ experience.end|default('Present') -}}
-                            {%- if experience.location %} ({{ experience.location }}){% endif %}.
+                            <div class="text-grey-dark">
+                                {{- experience.role }} from {{ experience.start }} to {{ experience.end|default('Present') -}}
+                                {%- if experience.location %} ({{ experience.location }}){% endif %}.
+                            </div>
                         </div>
+
+                        {% if experience.description %}
+                            <div class="markdown">
+                                {{ experience.description|markdown }}
+                            </div>
+                        {% endif %}
                     </div>
 
-                    {% if experience.description %}
-                        <div class="markdown">
-                            {{ experience.description|markdown }}
+                    {% if company.logo %}
+                        <div class="flex-none mt-2 mb-4 ml-4 w-16 sm:w-24 lg:w-32">
+                            <img src="/images/experience/{{ company.logo }}" alt="{{ company.name }} logo">
                         </div>
                     {% endif %}
                 </div>