From b421aff6530947254710efc33d2776039c9ac9f8 Mon Sep 17 00:00:00 2001
From: Johannes Kreiner <jkreiner@hotmail.de>
Date: Thu, 29 Jun 2017 11:35:10 +0200
Subject: [PATCH] [TASK] Add first draft of template

---
 .../Private/Templates/Youtube/Index.html      | 48 +++++++++++++++++++
 1 file changed, 48 insertions(+)

diff --git a/Resources/Private/Templates/Youtube/Index.html b/Resources/Private/Templates/Youtube/Index.html
index 7946f4d..9cb087f 100644
--- a/Resources/Private/Templates/Youtube/Index.html
+++ b/Resources/Private/Templates/Youtube/Index.html
@@ -1,4 +1,52 @@
 <f:layout name="Default"/>
 
 <f:section name="main">
+	<f:for each="{feed}" as="feedItem">
+		<div class="sg-youtube">
+			<f:if condition="{feedItem.thumbnail}">
+				<div class="default-content-element">
+					<div class="ce-textpic ce-center ce-above">
+						<div class="ce-gallery" data-ce-columns="1" data-ce-images="1">
+							<div class="ce-outer">
+								<div class="ce-inner">
+									<div class="ce-row">
+										<div class="ce-column">
+											<f:if condition="{feedItem.url}">
+												<f:then>
+													<a class="ce-media sg-youtube-image" href="{feedItem.url}">
+														<img src="{feedItem.thumbnail}"/>
+													</a>
+												</f:then>
+												<f:else>
+													<div class="ce-media sg-youtube-image">
+														<img src="{feedItem.thumbnail}"/>
+													</div>
+												</f:else>
+											</f:if>
+										</div>
+									</div>
+								</div>
+							</div>
+						</div>
+					</div>
+				</div>
+			</f:if>
+			<f:if condition="{feedItem.title}">
+				<div class="default-content-element default-header-element sg-youtube-title">
+					<h2 class="h2">
+						{feedItem.title}
+					</h2>
+				</div>
+			</f:if>
+			<f:if condition="{feedItem.description}">
+				<div class="default-content-element sg-youtube-text">
+					<div class="ce-textpic ce-center ce-above">
+						<div class="ce-bodytext">
+							<f:format.crop maxCharacters="200"><f:format.html>{feedItem.description}</f:format.html></f:format.crop>
+						</div>
+					</div>
+				</div>
+			</f:if>
+		</div>
+	</f:for>
 </f:section>
-- 
GitLab