From d36c60242b9c8b2aa8913e1fd8ce48453c47b283 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Bjo=CC=88rn=20Fromme?= <mail@bjo3rn.com>
Date: Thu, 6 Jun 2019 17:55:11 +0200
Subject: [PATCH] Add styles for news detail page

---
 .../Resources/Private/Assets/scss/_base.scss  |  5 +++
 .../Private/Templates/News/News/Detail.html   | 44 ++++++-------------
 2 files changed, 18 insertions(+), 31 deletions(-)

diff --git a/public/typo3conf/ext/ep_events/Resources/Private/Assets/scss/_base.scss b/public/typo3conf/ext/ep_events/Resources/Private/Assets/scss/_base.scss
index 928b9221..35e78632 100644
--- a/public/typo3conf/ext/ep_events/Resources/Private/Assets/scss/_base.scss
+++ b/public/typo3conf/ext/ep_events/Resources/Private/Assets/scss/_base.scss
@@ -121,6 +121,11 @@ ul {
 p {
     margin: 0 0 24px;
     line-height: 175%;
+
+    .lead & {
+        font-size: 18px;
+        font-weight: 700;
+    }
 }
 
 hr {
diff --git a/public/typo3conf/ext/ep_events/Resources/Private/Templates/News/News/Detail.html b/public/typo3conf/ext/ep_events/Resources/Private/Templates/News/News/Detail.html
index fbb3e6bd..8efff0c5 100644
--- a/public/typo3conf/ext/ep_events/Resources/Private/Templates/News/News/Detail.html
+++ b/public/typo3conf/ext/ep_events/Resources/Private/Templates/News/News/Detail.html
@@ -7,7 +7,7 @@
     <f:section name="content">
         <f:if condition="{newsItem}">
             <f:then>
-                <div class="blog-entry blog-entry--detail">
+                <div class="news-entry news-entry--detail">
                     <n:format.nothing>
                         <n:excludeDisplayedNews newsItem="{newsItem}" />
                         <f:if condition="{newsItem.alternativeTitle}">
@@ -24,39 +24,21 @@
                         </f:if>
                         <f:render partial="Detail/Opengraph" arguments="{newsItem: newsItem, settings:settings}" />
                     </n:format.nothing>
-                    <h2 class="headline headline--primary headline--underlined" itemprop="headline">{newsItem.title}</h2>
-                    <p class="blog-entry__info">
-                        <f:if condition="{newsItem.author}">{newsItem.author} am </f:if>
-                        <time itemprop="datePublished" datetime="{f:format.date(date:newsItem.datetime, format:'Y-m-d')}"><f:format.date format="{f:translate(key:'dateFormat')}">{newsItem.datetime}</f:format.date></time>
-                        <f:if condition="{newsItem.tags}"> in
-                            <f:for each="{newsItem.tags}" as="tag" iteration="iteration">
-                                <f:link.page title="{tag.title}" pageUid="{settings.tagListPageUid}" additionalParams="{tx_news_pi1:{overwriteDemand:{tags: tag}}}">
-                                    {tag.title}
-                                </f:link.page>
-                                {f:if(condition: iteration.isLast, else: ', ')}
-                            </f:for>
-                        </f:if>
-                    </p>
+                    <h2 class="headline headline--primary news-entry__headline" itemprop="headline">
+                        {newsItem.title}
+                        <span class="subline">
+                            <time itemprop="datePublished" datetime="{f:format.date(date:newsItem.datetime, format:'Y-m-d')}">
+                                <f:format.date format="{f:translate(key:'dateFormat')}">{newsItem.datetime}</f:format.date>
+                            </time>
+                        </span>
+                    </h2>
                     <f:if condition="{newsItem.teaser}">
-                        <f:format.html>{newsItem.teaser}</f:format.html>
+                        <div class="lead">
+                            <f:format.html>{newsItem.teaser}</f:format.html>
+                        </div>
                     </f:if>
-                    <n:renderMedia news="{newsItem}" imgClass="img-responsive" videoClass="video-wrapper" audioClass="audio-wrapper">
-                        <f:render partial="Detail/MediaContainer" arguments="{media: newsItem.media, settings:settings, id: newsItem.uid}" />
-                        <f:format.html>{newsItem.bodytext}</f:format.html>
-                    </n:renderMedia>
+                    <f:format.html>{newsItem.bodytext}</f:format.html>
                     <f:cObject typoscriptObjectPath="lib.tx_news.contentElementRendering">{newsItem.contentElementIdList}</f:cObject>
-                    <f:if condition="{newsItem.relatedFiles}">
-                        <h3 class="headline headline--underlined">Dateien</h3>
-                        <ul>
-                            <f:for each="{newsItem.relatedFiles}" as="relatedFile">
-                                <li>
-                                    <a href="{relatedFile.originalResource.publicUrl -> f:format.htmlspecialchars()}" target="_blank">
-                                        {f:if(condition:relatedFile.originalResource.title, then:relatedFile.originalResource.title, else:relatedFile.originalResource.name)}, {relatedFile.originalResource.size -> f:format.bytes()}
-                                    </a>
-                                </li>
-                            </f:for>
-                        </ul>
-                    </f:if>
                     <f:if condition="{settings.backPid}">
                         <f:link.page pageUid="{settings.backPid}" class="button button--default button--small">
                             <f:translate key="back-link" />