at the end of the day, it was inevitable
This commit is contained in:
@@ -0,0 +1,36 @@
|
||||
{#
|
||||
Content document comments.
|
||||
#}
|
||||
|
||||
{%- if (showUserComments != 'no') and (comments|length > 0) -%}
|
||||
|
||||
{%- if themeType == 'enhanced' -%}
|
||||
<br>
|
||||
<b>Comments</b>
|
||||
{%- endif -%}
|
||||
<div class="comments">
|
||||
{%- for comment in comments -%}
|
||||
<div class="comment">
|
||||
{%- if comment.title is not empty -%}
|
||||
<div class="comment-title">
|
||||
{{- comment.title -}}
|
||||
</div>
|
||||
{%- endif -%}
|
||||
<div class="comment-info">
|
||||
By <span class="comment-author">
|
||||
{{- comment.author.firstName -}}
|
||||
{{- comment.author.lastName -}}
|
||||
</span>
|
||||
{%- if showUserComments == 'with_author_date' -%}
|
||||
on <span class="comment-date">
|
||||
{{- comment.createdAt|date('F d, Y H:i') -}}
|
||||
</span>
|
||||
{%- endif -%}
|
||||
</div>
|
||||
<div class="comment-body">
|
||||
{{- comment.content -}}
|
||||
</div>
|
||||
</div>
|
||||
{%- endfor -%}
|
||||
</div>
|
||||
{%- endif -%}
|
||||
@@ -0,0 +1,60 @@
|
||||
{#
|
||||
Content document element.
|
||||
#}
|
||||
|
||||
{%- set isEnhanced = themeType == 'enhanced' -%}
|
||||
{%- set showImage = isEnhanced and showImages and (document.image is not empty) -%}
|
||||
|
||||
<div class="document">
|
||||
{%- if isEnhanced -%}
|
||||
<div class="document-aside">
|
||||
<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAALAQMAAAB8oI5bAAAABlBMVEX///9ucHPxuGwkAAAAAXRSTlMAQObYZgAAABpJREFUCNdj+HyAoceBYZ4DiGwAo/1I5P8DALPlCueka/iaAAAAAElFTkSuQmCC">
|
||||
</div>
|
||||
{%- endif -%}
|
||||
<div class="document-main">
|
||||
<div class="document-body">
|
||||
<div class="document-headline">
|
||||
<a href="{{- document.permalink -}}">
|
||||
{{- document.title -}}
|
||||
</a>
|
||||
</div>
|
||||
<div class="document-info">
|
||||
<span class="document-source">
|
||||
{{- document.source.title -}}
|
||||
{%- if showSourceCountry and document.source is not empty and document.source.country is not empty -%}
|
||||
({{ document.source.country }})
|
||||
{%- endif -%}
|
||||
</span>
|
||||
{%- if document.author is not empty and document.author.name is not empty -%}
|
||||
<span class="document-author">
|
||||
{%- if not isEnhanced -%}
|
||||
-
|
||||
{%- endif -%}
|
||||
{{- document.author.name -}}
|
||||
</span>
|
||||
{%- endif -%}
|
||||
<span class="document-date">
|
||||
{%- if isEnhanced -%}
|
||||
|
|
||||
{%- else -%}
|
||||
-
|
||||
{%- endif -%}
|
||||
{{- document.published|date('F d, Y H:i') -}}
|
||||
</span>
|
||||
</div>
|
||||
<div class="document-content">
|
||||
{{- document.content -}}
|
||||
</div>
|
||||
{%- include _root ~ '/Partial/Content/comments.html.twig' with {
|
||||
comments: document.comments,
|
||||
showUserComments: showUserComments,
|
||||
themeType: themeType
|
||||
} -%}
|
||||
</div>
|
||||
{%- if showImage -%}
|
||||
<div class="document-image">
|
||||
<img src="{{- document.image -}}">
|
||||
</div>
|
||||
{%- endif -%}
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,32 @@
|
||||
{#
|
||||
Content component.
|
||||
#}
|
||||
{%- set isPlain = themeType == 'plain' -%}
|
||||
|
||||
<div class="content">
|
||||
{%- for feed in feeds -%}
|
||||
<div class="feed">
|
||||
<div class="feed-title">
|
||||
{%- if not isPlain -%}
|
||||
<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAGCAQAAABUDBdwAAAAOElEQVQI12NgYPh/8//3/zAwlQEo0PwfAZxAAnb/T8Pk/9sxgMB/HyR5BoiaOiB3MlQeKrQaIg8Aiig6G17xrxEAAAAASUVORK5CYII=">
|
||||
{%- endif -%}
|
||||
{{- feed.name -}}
|
||||
{%- if isPlain -%}:{%- endif -%}
|
||||
</div>
|
||||
</div>
|
||||
<div class="documents">
|
||||
{%- for document in feed.documents -%}
|
||||
{%- include _root ~ '/Partial/Content/document.html.twig' with {
|
||||
document: document,
|
||||
showImages: showImages,
|
||||
showSourceCountry: showSourceCountry,
|
||||
showUserComments: showUserComments,
|
||||
themeType: themeType
|
||||
} -%}
|
||||
{%- endfor -%}
|
||||
</div>
|
||||
{%- if showSectionDivider and not loop.last and isPlain -%}
|
||||
<div class="feed-divider"></div>
|
||||
{%- endif -%}
|
||||
{%- endfor -%}
|
||||
</div>
|
||||
@@ -0,0 +1,145 @@
|
||||
{#
|
||||
|
||||
Content component styles.
|
||||
|
||||
#}
|
||||
{%- import _root ~ '/macros.css.twig' as macro -%}
|
||||
|
||||
.content .feed-title {
|
||||
{{- macro.renderFont(fonts.feedTitle) -}}
|
||||
margin-top: 5px;
|
||||
{%- if themeType == 'enhanced' -%}
|
||||
background: {{- colors.background.accent|raw -}};
|
||||
padding: 10px;
|
||||
color: {{- colors.text.header|raw -}};
|
||||
{%- endif -%}
|
||||
}
|
||||
|
||||
.content .feed-title img {
|
||||
padding-right: 10px;
|
||||
}
|
||||
|
||||
.content .feed-divider {
|
||||
margin: 1.8em 0.4em 1em;
|
||||
border-bottom: 1px solid black;
|
||||
display: block;
|
||||
color: rgb(55, 55, 57);
|
||||
}
|
||||
|
||||
.content .documents .document {
|
||||
{%- if themeType == 'plain'-%}
|
||||
margin-top: 10px;
|
||||
margin-left: 5px;
|
||||
{%- else -%}
|
||||
margin-top: 5px;
|
||||
display: flex;
|
||||
flex: auto;
|
||||
{%- endif -%}
|
||||
}
|
||||
|
||||
{%- if themeType == 'plain' -%}
|
||||
.content .documents .document:last-child {
|
||||
margin-bottom: 25px;
|
||||
}
|
||||
{%- endif -%}
|
||||
|
||||
{%- if themeType == 'enhanced' -%}
|
||||
.content .documents .document-aside {
|
||||
padding: 10px 5px 2px 5px;
|
||||
}
|
||||
|
||||
.content .documents .document-main {
|
||||
padding: 0 5px 10px 0;
|
||||
background: white;
|
||||
border-bottom: 1px solid #e6e6e6;
|
||||
display: flex;
|
||||
width: 100%;
|
||||
}
|
||||
.content .documents .document-body {
|
||||
flex: auto;
|
||||
padding: 8px;
|
||||
}
|
||||
|
||||
.content .documents .document-image {
|
||||
flex-basis: 170px;
|
||||
}
|
||||
|
||||
.content .documents .document-image img {
|
||||
width: 160px;
|
||||
}
|
||||
{%- endif -%}
|
||||
|
||||
.content .documents .document-headline a,
|
||||
.content .documents .document-headline a:hover,
|
||||
.content .documents .document-headline a:visited,
|
||||
.content .documents .document-headline a:active {
|
||||
{{- macro.renderFont(fonts.articleHeadline) -}}
|
||||
color: {{- colors.text.articleHeadline|raw -}};
|
||||
}
|
||||
|
||||
.content .documents .document-headline,
|
||||
.content .documents .document-info {
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
.content .documents .document-source {
|
||||
color: {{- colors.text.source|raw -}};
|
||||
{{- macro.renderFont(fonts.source) -}};
|
||||
}
|
||||
|
||||
.content .documents .document-author {
|
||||
color: {{- colors.text.author|raw -}};
|
||||
{{- macro.renderFont(fonts.author) -}};
|
||||
}
|
||||
|
||||
.content .documents .document-date {
|
||||
{%- if themeType == 'plain' -%}
|
||||
color: {{- colors.text.publishDate|raw -}};
|
||||
{%- else -%}
|
||||
color: {{- colors.text.articleContent|raw -}};
|
||||
{%- endif -%}
|
||||
{{- macro.renderFont(fonts.date) -}};
|
||||
}
|
||||
|
||||
.content .document .document-content {
|
||||
{{- macro.renderFont(fonts.articleContent) -}};
|
||||
text-align: justify;
|
||||
}
|
||||
|
||||
.content .comments {
|
||||
padding-left: 20px;
|
||||
}
|
||||
|
||||
.content .comments .comment {
|
||||
margin-top: 15px;
|
||||
}
|
||||
|
||||
{%- if themeType == 'enhanced' -%}
|
||||
.content .comments .comment-title {
|
||||
font-weight: bold;
|
||||
}
|
||||
{%- endif -%}
|
||||
|
||||
.content .comments .comment-author {
|
||||
color: {{- colors.text.author|raw -}};
|
||||
{%- if themeType == 'plain' -%}
|
||||
{{- macro.renderFont(fonts.author) -}};
|
||||
{%- endif -%}
|
||||
}
|
||||
|
||||
.content .comments .comment-date {
|
||||
{%- if themeType == 'plain' -%}
|
||||
color: {{- colors.text.publishDate|raw -}};
|
||||
{{- macro.renderFont(fonts.date) -}};
|
||||
{%- else -%}
|
||||
color: {{- colors.text.articleContent|raw -}};
|
||||
{%- endif -%}
|
||||
}
|
||||
|
||||
.content .comments .comment-info {
|
||||
margin: 5px 0 ;
|
||||
}
|
||||
|
||||
.content .comments .comment-body {
|
||||
padding-left: 20px;
|
||||
}
|
||||
Reference in New Issue
Block a user