Build user interface prototype

templates/conference/index.html.twig

@@ -1,20 +1,14 @@
 {% extends 'base.html.twig' %}
 
-{% block title %}Hello ConferenceController!{% endblock %}
+{% block title %}Conference Guestbook{% endblock %}
 
 {% block body %}
-<style>
-    .example-wrapper { margin: 1em auto; max-width: 800px; width: 95%; font: 18px/1.5 sans-serif; }
-    .example-wrapper code { background: #F5F5F5; padding: 2px 6px; }
-</style>
+    <h2>Give your feedback!</h2>
 
-<div class="example-wrapper">
-    <h1>Hello {{ controller_name }}! ✅</h1>
-
-    This friendly message is coming from:
-    <ul>
-        <li>Your controller at <code>/home/pablo_rodriguez/guestbook/src/Controller/ConferenceController.php</code></li>
-        <li>Your template at <code>/home/pablo_rodriguez/guestbook/templates/conference/index.html.twig</code></li>
-    </ul>
-</div>
+    {% for conference in conferences %}
+        <h4>{{ conference }}</h4>
+        <p>
+            <a href="{{ path('conference', { id: conference.id }) }}">View</a>
+        </p>
+    {% endfor %}
 {% endblock %}

templates/conference/show.html.twig

@@ -0,0 +1,24 @@
+{% extends 'base.html.twig' %}
+
+{% block title %}Conference Guestbook - {{ conference }}{% endblock %}
+
+{% block body %}
+    <h2>{{ conference }} Conference<h2>
+
+    {% if comments|length > 0 %}
+        {% for comment in comments %}
+            {% if comment.photoFilename %}
+                <img src="{{ asset('uploads/photos/' ~ comment.photofilename) }}" style="max-width: 200px"/>
+            {% endif %}
+
+            <h4>{{ comment.author }}</h4>
+            <small>
+                {{ comment.createdAt|format_datetime('medium', 'short') }}
+            </small>
+
+            <p>{{ comment.text }}</p>
+        {% endfor %}
+    {% else %}
+        <div>No comments have been posted yet for this conference.</div>
+    {% endif %}
+{% endblock %}