<$ var Break = article.value("break",""); var headstyle = '@media (max-width: ' + Break + ') {\n'; function outputCssProperty(property, value, unit) { if (!isNull(value)) { return property + ': ' + value + (unit || '') + ' !important;'; } return ''; } var buttonAlign = article.value('buttonAlign', 'center'); var buttonMaxWidth = article.value('buttonMaxWidth', '300'); var buttonFontSize = article.value('buttonFontSize', '1.0'); var buttonFontWeight = article.value('buttonFontWeight', '400'); var buttonFontColor = article.value('buttonFontColor', ''); var buttonFontColorHover = article.value('buttonFontColorHover', ''); var buttonBackground = article.value('buttonBackground', ''); var buttonBackgroundHover = article.value('buttonBackgroundHover', ''); var buttonBorderRadius = article.value('buttonBorderRadius', ''); var buttonMargin = article.value('buttonMargin', ''); headstyle += '.wzp-tbcz_' + article.id + ' .wzp-tbcz_pos_right .wzp-tbcz_picture, .wzp-tbcz_' + article.id + ' .wzp-tbcz_pos_left .wzp-tbcz_text, .wzp-tbcz_' + article.id + ' .wzp-tbcz_pos_right .wzp-tbcz_text, .wzp-tbcz_' + article.id + ' .wzp-tbcz_pos_left .wzp-tbcz_picture {'; headstyle += 'float:none;'; headstyle += '}\n'; headstyle += '.wzp-tbcz_' + article.id + ' .wzp-tbcz_1zu1 .wzp-tbcz_picture, .wzp-tbcz_' + article.id + ' .wzp-tbcz_1zu2 .wzp-tbcz_picture, .wzp-tbcz_' + article.id + ' .wzp-tbcz_2zu1 .wzp-tbcz_picture, .wzp-tbcz_' + article.id + ' .wzp-tbcz_1zu1 .wzp-tbcz_text, .wzp-tbcz_' + article.id + ' .wzp-tbcz_1zu2 .wzp-tbcz_text, .wzp-tbcz_' + article.id + ' .wzp-tbcz_2zu1 .wzp-tbcz_text {'; headstyle += 'width:100%;'; headstyle += '}\n'; headstyle += '.wzp-tbcz_picture img {'; headstyle += 'position:static;'; headstyle += '}\n'; headstyle += '.wzp-tbcz_text {'; headstyle += 'display: block;'; headstyle += '}\n'; headstyle += '}'; headstyle += '.wzp-tbcz_button' + article.id + ' {'; headstyle += outputCssProperty('max-width', buttonMaxWidth, 'px'); headstyle += outputCssProperty('font-size', buttonFontSize, 'em'); headstyle += outputCssProperty('font-weight', buttonFontWeight); headstyle += outputCssProperty('color', buttonFontColor); headstyle += outputCssProperty('background', buttonBackground); headstyle += outputCssProperty('border-radius', buttonBorderRadius, 'px'); headstyle += outputCssProperty('margin-top', buttonMargin, 'px'); headstyle += outputCssProperty('margin-bottom', buttonMargin, 'px'); headstyle += '}'; headstyle += '.wzp-tbcz_button' + article.id + ':hover {'; headstyle += outputCssProperty('color', buttonFontColorHover); headstyle += outputCssProperty('background', buttonBackgroundHover); headstyle += '}'; system.addHtmlHeadElement("\n" + headstyle + "\n"); $> <$ var imageEins = project.getImage(article.value("bild")); var altTextEins = system.htmlEncode(system.removeHtmlTags(imageEins.altText)); var beschreibung = imageEins.description; var titleEins = system.htmlEncode(system.removeHtmlTags(imageEins.description)); $> <$ if ( article.value('vollebreite') == "1" ){ var myClassName = "zpBreakout"; } else{ var myClassName = ""; } $> <$ /* Button */ var buttonHtml = '

'; var buttonPosition = article.value("buttonPosition", ""); buttonHtml += '' + article.value("buttonText", "") + ''; buttonHtml += '

'; $> <$=system.partial('article-begin.html', myClassName)$>

;" class="wzp-tbcz <$= article.value("pos-bild") $> wzp-tbcz_<$= article.value("sp-br") $>" data-heightmode="content" data-parallax="0">

<$= altTextEins $>

" height="<$= article.value("bild-h") $>"> <$ if (buttonPosition === "overImage") { $>

<$= buttonHtml $>

<$ } $>

<$ if (buttonPosition === "belowImage") { /* TODO: Funktioniert nicht wegen des JS, muss debuggt werden */ $> <$= buttonHtml $> <$ } $>

" style="padding:<$= article.value("pad-ou") $> <$= article.value("pad-lr") $>"> <$ if (buttonPosition === "aboveText") { $> <$= buttonHtml $> <$ } $> <$ var HEAD = (article.value("head-1")); if ( !isNull(HEAD) ){ $>

; font-size:<$= article.value("head-fsize") $>; font-weight:<$= article.value("head-fw") $>; color:<$= article.value("head-col") $>;"><$= HEAD $>

<$ } $> <$ var TEXT = (article.value("text-1")); if ( !isNull(TEXT) ){ $> <$= TEXT $> <$ } $> <$ if (buttonPosition === "belowText") { $> <$= buttonHtml $> <$ } $> <$ var HTML = (article.value("html-1")); if ( !isNull(HTML) ){ $> <$= HTML $> <$ } $> <$ if (buttonPosition === "belowHTML") { $> <$= buttonHtml $> <$ } $>

<$=system.partial("article-end.html")$>