Switch to Tailwind

source/testimonials.html.twig

@@ -5,13 +5,13 @@ use: [posts]
 testimonials:
     - name: Ed Welsby
       image: ed-welsby.png
-      role: Senior Developer at <a class="blue dim" href="http://www.proctors.co.uk">Proctor & Stevenson</a>
+      role: Senior Developer at <a class="text-blue inline-block" href="http://www.proctors.co.uk">Proctor & Stevenson</a>
       text: |
           Oliver was great to work with, he has a solid knowledge of the various aspects of web development and never minded helping me out with Linux commands!
 
     - name: Brian Healy
       image: brian-healy.png
-      role: Director of Business Development at <a class="blue dim" href="http://tincan.co.uk">Tincan</a>.
+      role: Director of Business Development at <a class="text-blue inline-block" href="http://tincan.co.uk">Tincan</a>.
       text: |
           Oliver was fantastic to work with - pro-active and highly responsive, he worked well remotely and as part of a project team. His understanding of the project requirement(s) and ability to translate it into working code was essential and he delivered.
 
@@ -31,21 +31,21 @@ testimonials:
           Oliver is seasoned Drupal and all round highly skilled and experienced web developer. I have worked with Oliver on an important project where he was reliable, prompt and ensured strict client deadline delivery and confidentiality at all times.
 
     - name: James Chapman
-      role: Director at <a class="blue dim" href="http://www.developmentdoneright.co.uk">Development Done Right</a>
+      role: Director at <a class="text-blue inline-block" href="http://www.developmentdoneright.co.uk">Development Done Right</a>
       image: james-chapman.png
       text: |
           We used Oliver on a number of occasions throughout 2012 and I have to say we've been delighted with his work. His skills working with Drupal are excellent particularly with custom module development and we wouldn’t hesitate to recommend him others.
 
     - name: Léonie Watson
       role: >
-          Director of Accessibility at <a class="blue dim" href="http://www.nomensa.com">Nomensa</a>
+          Director of Accessibility at <a class="text-blue inline-block" href="http://www.nomensa.com">Nomensa</a>
       image: leonie-watson.jpg
       text: |
           Oliver is a flexible and hardworking developer, with a terrific knowledge of Drupal. He promotes accessibility best practice within the Drupal community, and is always happy to share his knowledge with other people.
 
     - name: Holly Ross
       role: >
-          Executive Director at the <a class="blue dim" href="https://assoc.drupal.org">Drupal Association</a>
+          Executive Director at the <a class="text-blue inline-block" href="https://assoc.drupal.org">Drupal Association</a>
       image: holly-ross.png
       text: |
           Oliver has been an outstanding contributor to the Drupal Association team. He is a talented developer who writes great code and applies his curiosity and love of learning to every project. He is also a fantastic team member, who gives to the team as much as he gets.
@@ -53,7 +53,7 @@ testimonials:
           Oliver is the embodiment of everything good about the Drupal community.
 
     - name: Josh Mitchell
-      role: CTO at the <a class="blue dim" href="https://assoc.drupal.org">Drupal Association</a>
+      role: CTO at the <a class="text-blue inline-block" href="https://assoc.drupal.org">Drupal Association</a>
       image: josh-mitchell.png
       text: |
           Oliver is a skilled Drupal developer with a passion for the Drupal community. As his direct supervisor, I was able to watch Oliver grow with the Drupal Association and contribute an amazing amount of effort and integrity to all of his work.
@@ -62,33 +62,34 @@ testimonials:
 
     - name: Chris Jarvis
       image: chris-jarvis.jpg
-      role: Developer at <a class="blue dim" href="https://microserve.io">Microserve</a>
+      role: Developer at <a class="text-blue inline-block" href="https://microserve.io">Microserve</a>
       text: |
           Oliver is an amazing colleague, he's professional, full of knowledge and I could not recommend him more.
 ---
 {% block content %}
-    {% for testimonial in page.testimonials|reverse %}
-        <article class="cf mb4">
-            <h2 class="mv0">{{ testimonial.name }}</h2>
+    <div class="listing">
+        {% for testimonial in page.testimonials|reverse %}
+            <article class="listing-item">
+                {% if testimonial.image %}
+                    <div class="float-right mb-4 ml-4">
+                        <img src="{{ site.url }}/assets/images/testimonials/{{ testimonial.image }}"
+                             alt="{{ testimonial.name }}"
+                             class="testimonial-image">
+                    </div>
+                {% endif %}
 
-            {% if testimonial.image %}
-                <img
-                    src="{{ site.url }}/assets/images/testimonials/{{ testimonial.image }}"
-                    alt="{{ testimonial.name }}"
-                    class="fr mw3 br-100 ml4 mb4"
-                    height="65"
-                    width="65">
-            {% endif %}
+                <div class="mb-4">
+                    <h2>{{ testimonial.name }}</h2>
 
-            {% if testimonial.role %}
-                <div class="black-50 mb3">
-                    {{ testimonial.role|raw }}
+                    {% if testimonial.role %}
+                        <div>
+                            {{ testimonial.role|raw }}
+                        </div>
+                    {% endif %}
                 </div>
-            {% endif %}
 
-            <div>
                 {{ testimonial.text|markdown }}
-            </div>
-        </article>
-    {% endfor %}
+            </article>
+        {% endfor %}
+    </div>
 {% endblock %}