NEWSROOM-APP (component )

src/app/shared/components/newsroom-app/templates

Demo Section

Each variation will be presented in the following section.

Default

Readme

newsroomApp (component)

Description

This blueprint is based on the blueprint of Veams.

Requirements

  • Veams#5.0.0

Installation

Installation with Veams from local machine

veams install bp absolute/filepath/to/newsroom-app

Fields

newsroom-app.hbs

Settings

Parameter Type Default Description
settings.newsroomAppClasses String '' Modifier classes for component
settings.newsroomAppContextClass String 'default' Context class of component

Content

Parameter Type Description
content.newsroomAppField String Please add a description!

SASS

Variables

There are multiple variables which you can change:

Variable Value Description
$newsroom-app-my-custom-var 0px Please add a description!

Modifier Classes

There are modifier classes you can add to c-newsroom-app:

Modifier Description
is-modifier Please add a description!

/* $CMS_SET(set_ft_imgTitle, “”) $$CMS_SET(set_ft_imgCopyrightTitle, “”)$

$CMS_IF(#global.context.getVariableNames().contains(“set_ft_image”))$$– –$$CMS_IF(!set_ft_image.isEmpty && !set_ft_image.isNull)$$– –$$CMS_IF(#global.context.getVariableNames().contains(“set_ft_imgDescriptionTitle”))$$– –$$CMS_IF(!set_ft_imgDescriptionTitle.isEmpty && !set_ft_imgDescriptionTitle.isNull && set_ft_imgDescriptionTitle != “”)$$– –$$CMS_ELSE$$– –$$CMS_SET(set_ft_imgDescriptionTitle,"")$$– –$$CMS_END_IF$$– –$$CMS_ELSE$$– –$$CMS_SET(set_ft_imgDescriptionTitle,"")$$– –$$CMS_END_IF$$–

	--$$CMS_IF(!ref(set_ft_image).meta("FS_0x8298","none").isEmpty && !ref(set_ft_image).meta("FS_0x8298","none").isNull && ref(set_ft_image).meta("FS_0x8298","none") != null && ref(set_ft_image).meta("FS_0x8298","none").toString != "")$$--
		--$$CMS_SET(set_ft_imgCopyrightTitle, ref(set_ft_image).meta("FS_0x8298","none").replaceAll("\"","").replaceAll("'","´").replaceAll("\n","").replaceAll("\r",""))$$--
	--$$CMS_ELSE$$--
		--$$CMS_SET(set_ft_imgCopyrightTitle, "")$$--
	--$$CMS_END_IF$$--

	--$$CMS_IF(set_ft_imgCopyrightTitle != "")$$--
		--$$CMS_IF(set_ft_imgDescriptionTitle.toString() != "")$$--
			--$$CMS_SET(set_ft_imgTitle, set_ft_imgDescriptionTitle + " | © " + set_ft_imgCopyrightTitle)$$--
		--$$CMS_ELSE$$--
			--$$CMS_SET(set_ft_imgTitle, "© " + set_ft_imgCopyrightTitle)$$--
		--$$CMS_END_IF$$--
	--$$CMS_ELSE$$--
		--$$CMS_IF(set_ft_imgDescriptionTitle != "")$$--
			--$$CMS_SET(set_ft_imgTitle, set_ft_imgDescriptionTitle)$$--
		--$$CMS_END_IF$$--
	--$$CMS_END_IF$$--
--$$CMS_END_IF$$--

–$$CMS_END_IF$$–

–$$CMS_VALUE(set_ft_imgTitle)$$– –$$CMS_SET(set_ft_image, null)$$– –$$CMS_SET(set_ft_imgdescriptionTitle, “”)$ */

Templates

newsroom-app.hbs

<div id="newsroom"
	class="c-newsroom-app{{#if settings.newsroomAppContextClass}}--{{settings.newsroomAppContextClass}}{{else}}--default{{/if}}{{#if settings.newsroomAppClasses}} {{settings.newsroomAppClasses}}{{/if}}"
	data-config='{
		"baseURL": "{{content.baseURL}}",
		"baseURL_v3": "{{content.baseURL_v3}}",
		"document": "{{content.document}}",
		"document_v3": "{{content.document_v3}}",
		"mediaMasterDocument": "{{content.mediaMasterDocument}}",
		"eventDurationFilter": "{{content.eventDurationFilter}}",
		"filters": {{#if content.filters}}{{{json content.filters}}}{{else}}[]{{/if}},
		"frontendpath": "{{content.frontendpath}}",
		"cdnpath": "{{content.cdnpath}}",
		"lng": "{{content.lng}}",
		"translatedlng": "{{content.translatedlng}}",
		"thema": "{{content.thema}}",
		"stage": "{{content.stage}}",
		"format": "{{content.format}}",
		{{#if content.pageSize}}"pageSize": {{content.pageSize}},
		{{/if}}
		"version3": {{#if content.version3}}true{{else}}false{{/if}},
		"categoryHeadline": "{{content.categoryHeadline}}"
	}'
	data-css="c-newsroom-app">
	<newsroom-app>
		<!-- Integrieren von Kleeblatt-Lösung der Startseite hier  -->
	</newsroom-app>
</div>

Data File

newsroom-app.hjson

{
	"variations": {
		"default": {
			"docs": {
				"variationName": "Default"
			},
			"settings": {
				"newsroomAppContextClass": "default",
				"newsroomAppClasses": "",
				"filter_news": false,
				"filter_all": true
			},
			"content": {
				"pageSize": 10
			}
		}
	}
}

Styles

newsroom-app.scss

/* ===================================================
component: newsroom-app
=================================================== */

/* ---------------------------------------------------
Global Styles
--------------------------------------------------- */
[data-css="c-newsroom-app"] {
}

/* ---------------------------------------------------
Context: Default
--------------------------------------------------- */
.c-newsroom-app--default {}

HTML Output

Default

<div id="newsroom" class="c-newsroom-app--default" data-config='{
		"baseURL": "",
		"baseURL_v3": "",
		"document": "",
		"document_v3": "",
		"mediaMasterDocument": "",
		"eventDurationFilter": "",
		"filters": [],
		"frontendpath": "",
		"cdnpath": "",
		"lng": "",
		"translatedlng": "",
		"thema": "",
		"stage": "",
		"format": "",
		"pageSize": 10,
		"version3": false,
		"categoryHeadline": ""
	}' data-css="c-newsroom-app">
	<newsroom-app>
		<!-- Integrieren von Kleeblatt-Lösung der Startseite hier  -->
	</newsroom-app>
</div>

Wonach suchst du?

Datenschutzhinweis mit Link