CREATIEF & INNOVATIEF
100%
BETROUWBAAR
100%
FLEXIBEL
100%
NO NONSENS
100%
TIKKELTJE EIGENWIJS
25%
Bekijk onze mediamap
Marketingmaterialen
In de mediamap kunt u eenvoudig foto's bekijken en downloaden. Naast productafbeeldingen zijn er ook meer dan 350 nieuwe sfeerafbeeldingen toegevoegd. Verder vindt u in de mediamap ook video's, leaflets en inspiratie voor geefmomenten.
Afbeeldingen downloaden is heel eenvoudig:
- Eén afbeelding: Open de gewenste map, klik op de afbeelding. Rechtsboven ziet u acht iconen, klik vervolgens op de 'download' button.
- Volledige map: Open de gewenste map, klik op de naam van de map onder de zoekbalk. In het menu verschijnt de optie 'downloaden'.
.png&Crop=7&Format=webp&Quality=90&Compression=80&Width=2000)
Error executing template "Designs/TheGift_generated/Paragraph/CTAParagraph.cshtml" System.NullReferenceException: Object reference not set to an instance of an object. at Bluedesk.DynamicWeb.ItemTypes.CTAButton.GetLink(PageView pv, String navigationtag) at CompiledRazorTemplates.Dynamic.RazorEngine_b597c0930e804d5daebbc2b751617ba6.Execute() in D:\dynamicweb.net\Solutions\TheGift\Production\files\Templates\Designs\TheGift_generated\Paragraph\CTAParagraph.cshtml:line 53 at RazorEngine.Templating.TemplateBase.RazorEngine.Templating.ITemplate.Run(ExecuteContext context, TextWriter reader) at RazorEngine.Templating.RazorEngineService.RunCompile(ITemplateKey key, TextWriter writer, Type modelType, Object model, DynamicViewBag viewBag) at RazorEngine.Templating.RazorEngineServiceExtensions.<>c__DisplayClass16_0.<RunCompile>b__0(TextWriter writer) at RazorEngine.Templating.RazorEngineServiceExtensions.WithWriter(Action`1 withWriter) at Dynamicweb.Rendering.RazorTemplateRenderingProvider.Render(Template template) at Dynamicweb.Rendering.TemplateRenderingService.Render(Template template) at Dynamicweb.Rendering.Template.RenderRazorTemplate()
1 @inherits Dynamicweb.Rendering.RazorTemplateBase<Dynamicweb.Rendering.RazorTemplateModel<Dynamicweb.Rendering.Template>> 2 @using Dynamicweb; 3 @using Dynamicweb.Content.Items; 4 @using Bluedesk.DynamicWeb.ItemTypes; 5 6 @using System.Runtime.Caching; 7 8 9 @{ 10 /* 11 var paragraphID = Pageview.CurrentParagraph.ID; 12 CTAParagraph _data = Dynamicweb.Services.Items.GetItem("CTAParagraph", Pageview.CurrentParagraph.ItemId).ToCodeFirstItem<CTAParagraph>() ?? new CTAParagraph(); 13 */ 14 15 var paragraphID = Pageview.CurrentParagraph.ID; 16 CTAParagraph _data = new CTAParagraph(); 17 18 int CacheTime = 5; 19 MemoryCache memCache = MemoryCache.Default; 20 string cacheKey = $"CTAParagraph_{paragraphID}-{Pageview.AreaID}"; 21 22 if (Pageview.IsVisualEditorMode) 23 { 24 var cache = MemoryCache.Default; 25 memCache.Remove($"CTAParagraph_{paragraphID}-{Pageview.AreaID}"); 26 } 27 28 if (memCache.Contains(cacheKey)) 29 { 30 _data = memCache.Get(cacheKey) as CTAParagraph; 31 32 if (_data == null) 33 { 34 _data = Dynamicweb.Content.Services.Items.GetItem("CTAParagraph", Pageview.CurrentParagraph.ItemId).ToCodeFirstItem<CTAParagraph>() ?? new CTAParagraph(); 35 memCache.Set(cacheKey, _data, DateTimeOffset.UtcNow.AddMinutes(CacheTime)); 36 37 } 38 39 } 40 else 41 { 42 _data = Dynamicweb.Content.Services.Items.GetItem("CTAParagraph", Pageview.CurrentParagraph.ItemId).ToCodeFirstItem<CTAParagraph>() ?? new CTAParagraph(); 43 memCache.Set(cacheKey, _data, DateTimeOffset.UtcNow.AddMinutes(CacheTime)); 44 } 45 List<string> BackgroundConfigIdList = ((List<string>)Dynamicweb.Context.Current.Items["BackgroundConfigIdList"]) ?? new List<string>(); 46 BackgroundConfigIdList.Add(_data.BackgroundConfigurationID); 47 Dynamicweb.Context.Current.Items["BackgroundConfigIdList"] = BackgroundConfigIdList; 48 49 string contentRightClass = _data.ImagePosition.Equals("right") ? "image-right" : "image-left"; 50 51 string newWindow = _data.Button.NewWindow ? "target='_blank'" : ""; 52 string ariaLabel = !string.IsNullOrWhiteSpace(_data.Button.ButtonAriaLabel) ? "aria-label='" + _data.Button.ButtonAriaLabel + "'" : ""; 53 bool clickableBlock = !string.IsNullOrWhiteSpace(_data.Button.GetLink(Pageview)) && _data.Clickable; 54 string clickableClass = clickableBlock ? "cta-paragraph__container--clickable" : ""; 55 string ctaHasBackgroundImageClass = _data.ImageAsBackground ? "cta-paragraph--hasbackgroundimg" : ""; 56 57 bool hasContent = !string.IsNullOrWhiteSpace(_data.Button.ButtonText) || !string.IsNullOrWhiteSpace(_data.Content.Text) || !string.IsNullOrWhiteSpace(_data.Header.HeaderFormatted()); 58 double ColumnWidthSize = hasContent ? 0.5 : 1; 59 60 // string backgroundClass = getbackgroundclass(_data.BackgroundConfiguration.BackgroundClass); 61 62 string AnimateDirection = !string.IsNullOrWhiteSpace(_data.AnimateDirection) ? _data.AnimateDirection : ""; 63 bool AnimateHalfBlock = false; 64 int AnimationDuration = _data.AnimateDuration; 65 string DataAosValue = ""; 66 67 switch (AnimateDirection) 68 { 69 case "left": 70 DataAosValue = "fade-left"; 71 break; 72 73 case "right": 74 DataAosValue = "fade-right"; 75 break; 76 77 case "up": 78 DataAosValue = "fade-up"; 79 break; 80 81 case "down": 82 DataAosValue = "fade-down"; 83 break; 84 85 case "center": 86 AnimateHalfBlock = true; 87 break; 88 89 case "": 90 case "none": 91 // No action 92 break; 93 } 94 95 string ParagraphHeight = _data.Height == 0 ? "auto" : _data.Height + "px"; 96 97 } 98 99 @inherits Dynamicweb.Rendering.RazorTemplateBase<Dynamicweb.Rendering.RazorTemplateModel<Dynamicweb.Rendering.Template>> 100 @using Dynamicweb; 101 @using Dynamicweb.Content.Items; 102 @using Bluedesk.DynamicWeb.ItemTypes; 103 104 @inherits Dynamicweb.Rendering.RazorTemplateBase<Dynamicweb.Rendering.RazorTemplateModel<Dynamicweb.Rendering.Template>> 105 @using Dynamicweb; 106 @using Dynamicweb.Content.Items; 107 @using Bluedesk.DynamicWeb.ItemTypes; 108 109 @functions { 110 111 Dictionary<string, string> GetFontConfiguration(string TextColor, FontConfigurationItemTab FontConfiguration) 112 { 113 var colorService = new ColorSwatchService(); 114 TextColor = !string.IsNullOrWhiteSpace(TextColor) ? TextColor : "" ; 115 TextColor = !TextColor.Contains("#") ? colorService.GetHexColor(Pageview.AreaID, TextColor) : TextColor; 116 Dictionary<string, string> FontConfig = new Dictionary<string, string>() { 117 { "textColor" , TextColor }, 118 { "fontSize" , FontConfiguration.FontSize }, 119 { "lineHeight", FontConfiguration.LineHeight}, 120 { "fontFamily" , FontConfiguration.FontConfiguration.FontFamily }, 121 { "fontWeight" , FontConfiguration.FontWeight }, 122 { "fontStyle" , FontConfiguration.FontStyle } 123 }; 124 return FontConfig; 125 } 126 127 public string GenerateButtonConfigVariables(ButtonConfiguration BC, MasterConfig mc, int areaId) 128 { 129 string ButtonLabelAlignment = BC.ButtonLabelAlignment; 130 switch (ButtonLabelAlignment) 131 { 132 case "align-left": 133 ButtonLabelAlignment = "flex-start"; 134 break; 135 case "align-center": 136 ButtonLabelAlignment = "center"; 137 break; 138 case "align-right": 139 ButtonLabelAlignment = "flex-end"; 140 break; 141 case "align-full": 142 ButtonLabelAlignment = "space-between"; 143 break; 144 default: 145 ButtonLabelAlignment = "flex-start"; 146 break; 147 } 148 149 var btnStyleBlock = new System.Text.StringBuilder(); 150 151 // General Config 152 btnStyleBlock.Append(GenerateCssVar("btn-min-height", $"{mc.GeneralConfiguration.ButtonHeight}px")); 153 btnStyleBlock.Append(GenerateCssVar("btn-border-radius", $"{mc.GeneralConfiguration.RoundedCornerValue}px")); 154 155 // Button Config 156 btnStyleBlock.Append(GenerateCssVar("btn-border-width", $"{BC.BorderSize.ToString()}px")); 157 btnStyleBlock.Append(GenerateCssVar("btn-label-alignment", ButtonLabelAlignment)); 158 159 // Button Config Tab 160 btnStyleBlock.Append(GenerateCssVar("btn-bg-color", BC.ButtonColorConfiguration.BackgroundColor.GetColorCode(areaId))); 161 btnStyleBlock.Append(GenerateCssVar("btn-font-color", BC.ButtonColorConfiguration.FontColor.GetColorCode(areaId))); 162 btnStyleBlock.Append(GenerateCssVar("btn-border-color", BC.ButtonColorConfiguration.BorderColor.GetColorCode(areaId))); 163 164 // Button Config Hover tab 165 btnStyleBlock.Append(GenerateCssVar("btn-bg-color-hover", BC.ButtonHoverColorConfiguration.BackgroundColor.GetColorCode(areaId))); 166 btnStyleBlock.Append(GenerateCssVar("btn-font-color-hover", BC.ButtonHoverColorConfiguration.FontColor.GetColorCode(areaId))); 167 btnStyleBlock.Append(GenerateCssVar("btn-border-color-hover", BC.ButtonHoverColorConfiguration.BorderColor.GetColorCode(areaId))); 168 169 // Button Config Font Config 170 btnStyleBlock.Append(GenerateCssVar("btn-font-size", BC.FontConfiguration.FontSize)); 171 btnStyleBlock.Append(GenerateCssVar("btn-font-config-color", BC.FontConfiguration.Color.GetColorCode(areaId))); 172 btnStyleBlock.Append(GenerateCssVar("btn-font-line-height", BC.FontConfiguration.LineHeight)); 173 btnStyleBlock.Append(GenerateCssVar("btn-font-family", BC.FontConfiguration.FontConfiguration.FontFamily)); 174 btnStyleBlock.Append(GenerateCssVar("btn-font-weight", BC.FontConfiguration.FontWeight)); 175 btnStyleBlock.Append(GenerateCssVar("btn-font-transform", BC.FontConfiguration.FontStyle)); 176 177 return btnStyleBlock.ToString(); 178 } 179 180 public string GenerateCssVar(string name, string value) 181 { 182 if (!string.IsNullOrWhiteSpace(value)) { 183 return $"--{name}: {value};"; 184 } else { 185 return ""; 186 } 187 } 188 } 189 190 191 @inherits Dynamicweb.Rendering.RazorTemplateBase<Dynamicweb.Rendering.RazorTemplateModel<Dynamicweb.Rendering.Template>> 192 @using Dynamicweb; 193 @using Dynamicweb.Content.Items; 194 @using Bluedesk.DynamicWeb.ItemTypes; 195 @using Bluedesk.DynamicWeb.ItemTypes.Configuration; 196 197 198 @inherits Dynamicweb.Rendering.RazorTemplateBase<Dynamicweb.Rendering.RazorTemplateModel<Dynamicweb.Rendering.Template>> 199 @using Dynamicweb; 200 @using Dynamicweb.Content.Items; 201 @using Bluedesk.DynamicWeb.ItemTypes; 202 @using Bluedesk.DynamicWeb.ItemTypes.Extensions; 203 @using Bluedesk.DynamicWeb.ItemTypes.Configuration; 204 @using Bluedesk.DynamicWeb.ItemTypes.Settings.Configuration; 205 @using Dynamicweb; 206 @using Dynamicweb.Frontend 207 @using Bluedesk.DynamicWeb.ItemTypes.BaseSolution; 208 209 @helper RenderButton(CTAButton button, PageView Pageview) 210 { 211 212 if (!string.IsNullOrWhiteSpace(button.GetLink(Pageview))) 213 { 214 string Template = button.GetButtonTemplate().Replace("{{ ButtonLink }}", button.GetLink(Pageview)); 215 @Template; 216 } 217 } 218 219 220 @{ 221 222 var colorService = new ColorSwatchService(); 223 224 string fullWidthContainerClass = _data.Fullwidth ? "" : "container"; 225 226 string backgroundClass = !string.IsNullOrWhiteSpace(_data.BackgroundConfiguration.BackgroundClass) ? string.Format("bg-{0}", _data.BackgroundConfiguration.BackgroundClass) : ""; 227 string backgroundStyle = !string.IsNullOrWhiteSpace(_data.BackgroundConfiguration.BackgroundColor) ? $"background-color: {_data.BackgroundConfiguration.BackgroundColor}; " : ""; 228 backgroundStyle += !string.IsNullOrWhiteSpace(_data.BackgroundConfiguration.BackgroundImage) ? $"background-image: url({_data.BackgroundConfiguration.BackgroundImage}); " : ""; 229 230 // string backgroundClass = "null"; 231 // string backgroundStyle = ""; 232 } 233 234 235 @functions { 236 //string getbackgroundclass(string backgroundClass) 237 //{ 238 // return !string.IsNullOrWhiteSpace(backgroundClass) ? string.Format("bg-{0}", backgroundClass) : ""; 239 //} 240 } 241 242 @helper CTAParagraphImage( 243 ParagraphImageResizable Image, 244 bool hasContent, 245 bool ImageAsBackground, 246 string ImagePosition, 247 bool ParallaxImage, 248 bool Fullwidth, 249 string imagesHeight, 250 double ColumnWidthSize, 251 int AnimationDuration = 300, 252 bool AnimateHalfBlock = false 253 ) 254 { 255 if (!string.IsNullOrWhiteSpace(Image.Image)) 256 { 257 258 string image = !string.IsNullOrWhiteSpace(Image.Image) ? Image.Image : null; 259 imagesHeight = hasContent ? imagesHeight : "100%"; 260 imagesHeight = !string.IsNullOrWhiteSpace(imagesHeight) ? "height: " + imagesHeight + ";" : ""; 261 262 string imageParrallax = ParallaxImage ? "rellax" : ""; 263 string imageAsBackground = ImageAsBackground ? "cta-paragraph__image--is-background" : ""; 264 double imageWidth = 2000; 265 266 imageWidth = Fullwidth ? imageWidth : 1200; 267 imageWidth = !ImageAsBackground ? imageWidth * ColumnWidthSize : imageWidth; 268 269 string strImageWidth = imageWidth + "px"; 270 string strImageWidthSize = imageWidth + "w"; 271 272 string ImageUrl; 273 if (image.EndsWith(".gif")) 274 { 275 ImageUrl = image; 276 } 277 else 278 { 279 ImageUrl = "/Admin/Public/GetImage.ashx?Image=" + image + "&Crop=7&Format=webp&Quality=90&Compression=80"; 280 ImageUrl = ImageUrl.Replace("?x", "&x"); 281 } 282 283 string animationDirection = AnimateHalfBlock ? ImagePosition.Equals("right") ? "fade-left" : "fade-right" : ""; 284 285 if (!string.IsNullOrWhiteSpace(Image.Image)) 286 { 287 288 <figure class="cta-paragraph__image-container @imageAsBackground @Image.PositionY @Image.PositionX" style="@imagesHeight" data-aos="@animationDirection" data-aos-duration="@AnimationDuration"> 289 290 <picture class="cta-paragraph__image @Image.BackgroundSize @imageParrallax"> 291 @if (ImageUrl.EndsWith(".gif")) 292 { 293 <source media="(max-width: 400px)" srcset="@ImageUrl&Width=400"> 294 <source media="(max-width: 994px)" srcset="@ImageUrl&Width=994"> 295 <img src="@ImageUrl" loading="lazy" alt="@Image.ImageAlt" class="cta-paragraph__image @Image.BackgroundSize @imageParrallax" width="1980" height="500"> 296 } 297 else 298 { 299 <source media="(max-width: 400px)" srcset="@ImageUrl&Width=400"> 300 <source media="(max-width: 994px)" srcset="@ImageUrl&Width=994"> 301 <img src="@ImageUrl&Width=@imageWidth" loading="lazy" alt="@Image.ImageAlt" class="cta-paragraph__image @Image.BackgroundSize @imageParrallax" width="1980" height="500"> 302 } 303 </picture> 304 305 </figure> 306 } 307 } 308 } 309 310 @helper CTAParagraphContent( 311 int paragraphID, 312 ParagraphHeader Header, 313 ParagraphHeader SubHeader, 314 ParagraphContent Content, 315 CTAButton Button, 316 CTAButton ExtraButton, 317 ParagraphImage Image, 318 bool strCenterVertical, 319 string ImagePosition = "", 320 int AnimationDuration = 300, 321 bool AnimateHalfBlock = false 322 ) 323 { 324 325 bool hasImage = !string.IsNullOrWhiteSpace(Image.Image) ? true : false; 326 string noImageClass = hasImage ? "" : "no-image"; 327 328 string centerTextClass = strCenterVertical ? "text-center" : ""; 329 string centerContent = !string.IsNullOrWhiteSpace(Image.Image) ? "" : "cta-paragraph__content--center"; 330 331 string paragraphInstanceClass = "cta-paragraph__content--" + paragraphID; 332 333 string animationDirection = (AnimateHalfBlock && hasImage) ? ImagePosition.Equals("right") ? "fade-right" : "fade-left" : ""; 334 335 if (!string.IsNullOrWhiteSpace(Button.ButtonText) || !string.IsNullOrWhiteSpace(Content.Text) || !string.IsNullOrWhiteSpace(Header.HeaderFormatted("cta-paragraph__header"))) 336 { 337 338 <section class="cta-paragraph__content @paragraphInstanceClass @centerContent @noImageClass" data-aos="@animationDirection" data-aos-duration="@AnimationDuration"> 339 340 <article class="cta-paragraph__content-container @noImageClass"> 341 342 @if (!string.IsNullOrWhiteSpace(Header.HeaderFormatted("cta-paragraph__header"))) 343 { 344 <header class="cta-paragraph__header @centerTextClass"> 345 @if (SubHeader != null) 346 { 347 @SubHeader.HeaderFormatted("cta-paragraph__subheader") 348 } 349 @Header.HeaderFormatted("cta-paragraph__header") 350 </header> 351 } 352 353 @if (!string.IsNullOrWhiteSpace(Content.Text)) 354 { 355 <div class="cta-paragraph__text @centerTextClass">@Content.Text</div> 356 } 357 358 @if (!string.IsNullOrWhiteSpace(Button.GetLink(Pageview)) && !string.IsNullOrWhiteSpace(Button.ButtonText)) 359 { 360 <nav class="cta-paragraph__btn-navigation @centerTextClass"> 361 @RenderButton(Button, Pageview) 362 @RenderButton(ExtraButton, Pageview) 363 </nav> 364 } 365 366 </article> 367 </section> 368 369 } 370 371 } 372 373 @helper CTAParagraphVideo(ParagraphVideo Video, string imagesHeight) 374 { 375 if (!string.IsNullOrWhiteSpace(Video.YoutubeLink) || !string.IsNullOrWhiteSpace(Video.VimeoLink)) 376 { 377 string YoutubeID = Video.YoutubeId; 378 string YoutubeLink = Video.YoutubeLink; 379 380 string VimeoID = Video.VimeoId; 381 string VimeoLink = Video.VimeoLink; 382 383 int CleanVideo = Video.Clean ? 1 : 0; 384 int ShowControls = Video.ShowControls ? 1 : 0; 385 int AutoPlay = Video.AutoPlay ? 1 : 0; 386 int LoopVideo = Video.LoopVideo ? 1 : 0; 387 int MuteAudio = Video.MuteAudio ? 1 : 0; 388 string hideControlsClass = Video.ShowControls ? "video-player-wrapper--hidecontrols" : ""; 389 string origin = Dynamicweb.Environment.Helpers.LinkHelper.GetHttpDomain(); 390 imagesHeight = !string.IsNullOrWhiteSpace(imagesHeight) ? "height: " + imagesHeight + ";" : ""; 391 392 if (!string.IsNullOrWhiteSpace(YoutubeLink)) 393 { 394 if(AutoPlay == 1) 395 { 396 <section class="cta-paragraph__video-container" style="@imagesHeight"> 397 <div class=""> 398 <div class="video-player-wrapper @hideControlsClass"> 399 <iframe class="video-player" loading="lazy" data-video="@YoutubeID" frameborder="0" allowfullscreen allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" title="YouTube video player" src="https://www.youtube-nocookie.com/embed/@YoutubeID?autoplay=@AutoPlay&controls=@ShowControls&loop=@LoopVideo&playlist=@YoutubeID&playsinline=1&modestbranding=@CleanVideo&mute=@MuteAudio&rel=0&enablejsapi=1&origin=@origin&disablekb=0"></iframe> 400 </div> 401 </div> 402 </section> 403 } 404 else 405 { 406 <lite-youtube videoid="@YoutubeID" params="controls=@ShowControls&loop=@LoopVideo&playlist=@YoutubeID&playsinline=1&modestbranding=@CleanVideo&mute=@MuteAudio&rel=0&enablejsapi=1&origin=@origin&disablekb=0"></lite-youtube> 407 } 408 } 409 if (!string.IsNullOrWhiteSpace(VimeoLink)) 410 { 411 <section class="cta-paragraph__video-container" style="@imagesHeight"> 412 <div class=""> 413 <div class="video-player-wrapper"> 414 <iframe class="video-player" loading="lazy" data-video="@VimeoID" frameborder="0" allowfullscreen allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" title="Vimeo video player" src="https://player.vimeo.com/video/@VimeoID?title=0&byline=0&portrait=0&autoplay=@AutoPlay&controls=@ShowControls&loop=@LoopVideo&muted=@MuteAudio"></iframe> 415 </div> 416 </div> 417 </section> 418 } 419 } 420 } 421 422 @helper CTAParagraphIcon(ParagraphIcon Icon, bool strCenterVertical) 423 { 424 if (!string.IsNullOrWhiteSpace(Icon.FaIcon)) 425 { 426 string centerIconClass = strCenterVertical ? "justify-center" : "justify-start"; 427 string iconSizeClass = string.Format("cta-paragraph__icon--{0}", Icon.FaIconSize); 428 429 <div class="cta-paragraph__icon-container"> 430 <div class="cta-paragraph__icon-inner-container @centerIconClass"> 431 <span class="cta-paragraph__icon @iconSizeClass">@Icon.FaIcon</span> 432 </div> 433 </div> 434 } 435 } 436 437 @helper RenderContentAlignment(BackgroundConfiguration data) 438 { 439 440 switch (data.ContentElementAlign) 441 { 442 case "align-left": 443 <text> 444 align-items: flex-start; 445 text-align: left; 446 </text> 447 break; 448 case "align-center": 449 <text> 450 align-items: center; 451 text-align: center; 452 </text> 453 break; 454 case "align-right": 455 <text> 456 align-items: flex-end; 457 text-align: right; 458 </text> 459 break; 460 case "align-full": 461 <text> 462 align-items: flex-start; 463 text-align: justify; 464 </text> 465 break; 466 } 467 468 } 469 470 471 <style> 472 473 @@media screen and (min-width: 991px) { 474 .cta-paragraph__container--@paragraphID { 475 height: @ParagraphHeight !important; 476 } 477 } 478 479 </style> 480 481 @if (_data != null) 482 { 483 484 string BackgroundPadding = _data.BackgroundConfiguration.backgroundPadding; 485 486 bool Containerfit = _data.BackgroundConfiguration.ContainerFit == "Fit" ? true : false; 487 if (!string.IsNullOrWhiteSpace(contentRightClass)) 488 { 489 contentRightClass = Containerfit ? "" : contentRightClass; 490 } 491 492 string backgroundImageRepeatClass = _data.BackgroundConfiguration.BackgroundImageRepeat; 493 string backgroundImageSizeClass = ""; 494 495 string BackgroundImagePositionX = _data.BackgroundConfiguration.BackgroundImagePositionX; 496 string BackgroundImagePositionY = _data.BackgroundConfiguration.BackgroundImagePositionY; 497 498 499 string BackgroundImagePositionClass = ""; 500 501 if (backgroundImageRepeatClass == "no-repeat") 502 { 503 BackgroundImagePositionClass = BackgroundImagePositionY + "-" + BackgroundImagePositionX; 504 backgroundImageSizeClass = _data.BackgroundConfiguration.BackgroundImageSize; 505 } 506 507 string shadowClass = _data.BackgroundConfiguration.contentShadow ? "contentShadow" : ""; 508 509 <section class="cta-paragraph cta-paragraph--@paragraphID config--@_data.BackgroundConfigurationID @backgroundClass @_data.CssClass @backgroundImageRepeatClass @BackgroundImagePositionClass @backgroundImageSizeClass @BackgroundPadding @ctaHasBackgroundImageClass" style="@backgroundStyle" data-paragraphid="@paragraphID" id="@paragraphID" data-aos="@DataAosValue" data-aos-duration="@AnimationDuration"> 510 511 <div class="cta-paragraph__container cta-paragraph__container--@paragraphID @fullWidthContainerClass @clickableClass @contentRightClass @shadowClass"> 512 513 <style> 514 515 .cta-paragraph--@paragraphID .cta-paragraph__content { 516 @if (Containerfit) 517 { 518 <text> 519 flex-grow: 0; 520 </text> 521 } 522 } 523 524 .cta-paragraph--@paragraphID .cta-paragraph__image-container { 525 @if (Containerfit) 526 { 527 <text> 528 position: absolute; 529 top: 0; 530 left: 0; 531 right: 0; 532 bottom: 0; 533 </text> 534 } 535 } 536 537 </style> 538 539 @CTAParagraphImage( 540 _data.Image, 541 true, 542 _data.ImageAsBackground, 543 _data.ImagePosition, 544 _data.ParallaxImage, 545 _data.Fullwidth, 546 "", 547 ColumnWidthSize, 548 AnimationDuration, 549 AnimateHalfBlock 550 ) 551 @CTAParagraphContent( 552 paragraphID, 553 _data.Header, 554 _data.SubHeader, 555 _data.Content, 556 _data.Button, 557 _data.ExtraButton, 558 _data.Image, 559 _data.CenterVertical, 560 _data.ImagePosition, 561 AnimationDuration, 562 AnimateHalfBlock 563 ) 564 565 @if (clickableBlock) 566 { 567 <a href="@_data.Button.GetLink(Pageview)" class="cta-paragraph__clickable" @newWindow @ariaLabel></a> 568 } 569 570 </div> 571 572 </section> 573 } 574