<$
var Col = article.value('col', '');
var ColHead = article.value('col-head', '');
var numEntries = article.value('header-count');
var headstyle = "";
headstyle += '.wzp-btsticky {';
headstyle += 'position:relative; display:block; margin:0; padding:0; width:calc(100vw - 9px); margin-left:calc(-50vw + 50%);';
headstyle += '}\n';
headstyle += '.wzp-btsticky > li > div > div {';
headstyle += 'display:flex; justify-content:flex-end; margin-top:20px;';
headstyle += '}\n';
headstyle += '.wzp-btsticky_text_id' + article.id + ' {';
headstyle += 'color:' + Col + ';';
headstyle += '}\n';
headstyle += '.wzp-btsticky_text_id' + article.id + ' h1, .wzp-btsticky_text_id' + article.id + ' h2, .wzp-btsticky_text_id' + article.id + ' h3, .wzp-btsticky_text_id' + article.id + ' h4 {';
headstyle += 'color:' + ColHead + ';';
headstyle += '}';
system.addHtmlHeadElement("\n" + headstyle + "\n");
// MOBILE
var BREAK = article.value('break', '');
var FsizeMob = article.value('fsize-mob', '');
var headstyle = '@media (max-width:calc(' + BREAK + ' - 1px)) {\n';
headstyle += '.wzp-btsticky > li {';
headstyle += 'display:block; margin:0; padding:0;';
headstyle += '}\n';
headstyle += '.wzp-btsticky > li > div {';
headstyle += 'padding:20px;';
headstyle += ' font-size:' + FsizeMob + '%;';
headstyle += '}\n';
headstyle += '.wzp-btsticky > li > img {';
headstyle += 'display:block; width:100%; height:auto;';
headstyle += '}\n';
headstyle += '.wzp-btsticky_display {';
headstyle += 'display:none;';
headstyle += '}\n';
headstyle += '}';
system.addHtmlHeadElement("\n" + headstyle + "\n");
// DESKTOP
var BREAK = article.value('break', '');
var TransiTime = article.value('transi-time', '');
var FsizeDesk = article.value('fsize-desk', '');
var headstyle = '@media (min-width:' + BREAK + ') {\n';
headstyle += '.wzp-btsticky > li {';
headstyle += 'display:flex; height:100vh; width:50%; margin:0; padding:0; justify-content:center; align-items:center;';
headstyle += '}\n';
headstyle += '.wzp-btsticky > li > div {';
headstyle += 'width:80%;';
headstyle += ' font-size:' + FsizeDesk + '%;';
headstyle += '}\n';
headstyle += '.wzp-btsticky > li > img {';
headstyle += 'display:none;';
headstyle += '}\n';
headstyle += '.wzp-btsticky_display {';
headstyle += 'top:0; right:0; width:50%; height:100%; position:absolute;';
headstyle += ' background-color:transparent;';
headstyle += '}\n';
headstyle += '.wzp-btsticky_left .wzp-btsticky_display {';
headstyle += 'right:unset; left:0;';
headstyle += '}\n';
headstyle += '.wzp-btsticky_left > li {';
headstyle += 'margin-left:50%;';
headstyle += '}\n';
headstyle += '.wzp-btsticky_display > div {';
headstyle += 'position:sticky; width:100%; height:100vh; top:0; overflow:hidden;';
headstyle += '}\n';
headstyle += '.wzp-btsticky_display > div > div {';
headstyle += 'position:absolute; top:0; left:0; width:100%; height:100%; background-size:cover; background-position:center center;';
headstyle += ' transition:opacity ' + TransiTime + 's, transform ' + TransiTime + 's;';
headstyle += '}\n';
headstyle += '}';
system.addHtmlHeadElement("\n" + headstyle + "\n");
$>
<$= system.partial("article-begin.html") $>
" style="background-color:<$= article.value("hg") $>; list-style:none; margin:0; padding-left:0;">
<$ for ( var i = 1; i <= numEntries; i++){
var image = project.getImage(article.value("bild-" + i));
if ( isNull(image) ){
continue;
}
var altText = system.htmlEncode(system.removeHtmlTags(image.altText));
var beschreibung = image.description;
var title = system.htmlEncode(system.removeHtmlTags(image.description));
var imgsrc = image.contentCopyPath;
var fullsrc = image.workingCopyPath;
var TEXT = article.value("text-" + i, "");
var HTML = article.value("html-" + i, "");
$>
-
<$= TEXT $>
<$= HTML $>
<$ } $>
<$= system.partial("article-end.html") $>