Add styles for news detail page

This commit is contained in:
Björn Fromme
2019-05-21 13:36:40 +02:00
parent 31605e78c9
commit 9f2f861204
2 changed files with 18 additions and 31 deletions
@@ -121,6 +121,11 @@ ul {
p { p {
margin: 0 0 24px; margin: 0 0 24px;
line-height: 175%; line-height: 175%;
.lead & {
font-size: 18px;
font-weight: 700;
}
} }
hr { hr {
@@ -7,7 +7,7 @@
<f:section name="content"> <f:section name="content">
<f:if condition="{newsItem}"> <f:if condition="{newsItem}">
<f:then> <f:then>
<div class="blog-entry blog-entry--detail"> <div class="news-entry news-entry--detail">
<n:format.nothing> <n:format.nothing>
<n:excludeDisplayedNews newsItem="{newsItem}" /> <n:excludeDisplayedNews newsItem="{newsItem}" />
<f:if condition="{newsItem.alternativeTitle}"> <f:if condition="{newsItem.alternativeTitle}">
@@ -24,39 +24,21 @@
</f:if> </f:if>
<f:render partial="Detail/Opengraph" arguments="{newsItem: newsItem, settings:settings}" /> <f:render partial="Detail/Opengraph" arguments="{newsItem: newsItem, settings:settings}" />
</n:format.nothing> </n:format.nothing>
<h2 class="headline headline--primary headline--underlined" itemprop="headline">{newsItem.title}</h2> <h2 class="headline headline--primary news-entry__headline" itemprop="headline">
<p class="blog-entry__info"> {newsItem.title}
<f:if condition="{newsItem.author}">{newsItem.author} am </f:if> <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> <time itemprop="datePublished" datetime="{f:format.date(date:newsItem.datetime, format:'Y-m-d')}">
<f:if condition="{newsItem.tags}"> in <f:format.date format="{f:translate(key:'dateFormat')}">{newsItem.datetime}</f:format.date>
<f:for each="{newsItem.tags}" as="tag" iteration="iteration"> </time>
<f:link.page title="{tag.title}" pageUid="{settings.tagListPageUid}" additionalParams="{tx_news_pi1:{overwriteDemand:{tags: tag}}}"> </span>
{tag.title} </h2>
</f:link.page>
{f:if(condition: iteration.isLast, else: ', ')}
</f:for>
</f:if>
</p>
<f:if condition="{newsItem.teaser}"> <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> </f:if>
<n:renderMedia news="{newsItem}" imgClass="img-responsive" videoClass="video-wrapper" audioClass="audio-wrapper"> <f:format.html>{newsItem.bodytext}</f:format.html>
<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:cObject typoscriptObjectPath="lib.tx_news.contentElementRendering">{newsItem.contentElementIdList}</f:cObject> <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:if condition="{settings.backPid}">
<f:link.page pageUid="{settings.backPid}" class="button button--default button--small"> <f:link.page pageUid="{settings.backPid}" class="button button--default button--small">
<f:translate key="back-link" /> <f:translate key="back-link" />