1 @inherits Dynamicweb.Rendering.ViewModelTemplate<Dynamicweb.Frontend.GridRowViewModel>
2
3 @* CUSTOM TEMPLATE SUPPORTED BY SWIFT (v1.25.0) *@
4
5 @{
6 string sectionClass = "py-3";
7 string spaceBetweenRows = Model.Item.GetRawValueString("SpaceBetweenRows", "spacing");
8 string spaceBetweenRowsMobile = Model.Item.GetRawValueString("SpaceBetweenRowsMobile", "auto");
9
10 //Row spacing mobile auto
11 if (spaceBetweenRowsMobile == "auto") {
12 spaceBetweenRowsMobile = spaceBetweenRows;
13 }
14
15 //Row spacing mobile
16 switch (spaceBetweenRowsMobile) {
17 case "none": //No spacing
18 sectionClass = "py-0";
19 break;
20 case "spacing": //Small spacing top and bottom
21 sectionClass = "py-3";
22 break;
23 case "spacing-small-top": //Small spacing top
24 sectionClass = "pt-3";
25 break;
26 case "spacing-small-bottom": //Small spacing bottom
27 sectionClass = "pb-3";
28 break;
29 case "spacing-medium": //Medium spacing top and bottom
30 sectionClass = "py-4";
31 break;
32 case "spacing-medium-top": //Medium spacing top
33 sectionClass = "pt-4";
34 break;
35 case "spacing-medium-bottom": //Medium spacing bottom
36 sectionClass = "pb-4";
37 break;
38 case "spacing-large": //Large spacing top and bottom
39 sectionClass = "py-5";
40 break;
41 case "spacing-top": //Large spacing top
42 sectionClass = "pt-5";
43 break;
44 case "spacing-bottom": //Large spacing bottom
45 sectionClass = "pb-5";
46 break;
47 }
48
49 //Row spacing dekstop
50 switch (spaceBetweenRows) {
51 case "none": //No spacing
52 sectionClass += " py-lg-0";
53 break;
54 case "spacing": //Small spacing top and bottom
55 sectionClass += " py-lg-3";
56 break;
57 case "spacing-small-top": //Small spacing top
58 sectionClass += " pt-lg-3 pb-lg-0";
59 break;
60 case "spacing-small-bottom": //Small spacing bottom
61 sectionClass += " pb-lg-3 pt-lg-0";
62 break;
63 case "spacing-medium": //Medium spacing top and bottom
64 sectionClass += " py-lg-5";
65 break;
66 case "spacing-medium-top": //Medium spacing top
67 sectionClass += " pt-lg-5 pb-lg-0";
68 break;
69 case "spacing-medium-bottom": //Medium spacing bottom
70 sectionClass += " pb-lg-5 pt-lg-0";
71 break;
72 case "spacing-large": //Large spacing top and bottom
73 sectionClass += " py-lg-6";
74 break;
75 case "spacing-top": //Large spacing top
76 sectionClass += " pt-lg-6 pb-lg-0";
77 break;
78 case "spacing-bottom": //Large spacing bottom
79 sectionClass += " pb-lg-6 pt-lg-0";
80 break;
81 }
82
83 string width = Model.Item.GetRawValueString("Width");
84 string containerClass = "container-xl";
85 if (width == "stretch")
86 {
87 containerClass = "container-fluid";
88 }
89 if (width == "none")
90 {
91 containerClass = "container-fluid px-0";
92 }
93 if (width == "compressed")
94 {
95 containerClass = " container-compressed";
96 }
97 //CUSTOM
98 if (width == "custom-semi-compressed")
99 {
100 containerClass = " container-semi-compressed";
101 }
102 //--CUSTOM
103
104 string theme = !string.IsNullOrWhiteSpace(Model.Item.GetRawValueString("Theme")) ? " theme " + Model.Item.GetRawValueString("Theme").Replace(" ", "").Trim().ToLower() : "";
105
106 string animationOnScrollCol1 = Model.Item.GetRawValueString("AnimationOnScroll", "no-animation");
107 animationOnScrollCol1 = animationOnScrollCol1 != "no-animation" ? "data-aos=" + "'" + animationOnScrollCol1 + "'" : "";
108
109 string hideOverflow = " overflow-hidden";
110 hideOverflow = animationOnScrollCol1 != "" ? hideOverflow : "";
111
112 Dynamicweb.Frontend.FileViewModel backgroundImage = Model.Item.GetFile("BackgroundImage");
113 string backgroundImagePath = backgroundImage?.Path ?? string.Empty;
114 string imagePath = $"/Admin/Public/GetImage.ashx?image={backgroundImagePath}&width=960&format=webp";
115 backgroundImagePath = Dynamicweb.Core.Encoders.HtmlEncoder.UrlPathEncode(backgroundImagePath);
116 string backgroundRepeat = Model.Item.GetRawValueString("BackgroundImageRepeat", "no-repeat");
117 string backgroundImageSize = Model.Item.GetRawValueString("BackgroundImageSize", "initial");
118 int xPos = backgroundImage?.FocalPositionFromLeft ?? 50;
119 int yPos = backgroundImage?.FocalPositionFromTop ?? 50;
120 string cssPosition = $"{xPos}% {yPos}%";
121 string gradient = Model.Item.GetRawValueString("Gradient", string.Empty);
122 string gradientOpacity = Model.Item.GetRawValueString("GradientOpacity", "0.00");
123 string gradientString = "linear-gradient(" + gradient + "deg," + "rgba(var(--swift-foreground-color-rgb)," + gradientOpacity + "), rgba(var(--swift-background-color-rgb)," + gradientOpacity + "))";
124 string backgroundImageString = "url(" + backgroundImagePath + ")";
125 string backgroundImagePositionString = "background-position:" + cssPosition + ";";
126 string backgroundRepeatString = "background-repeat:" + backgroundRepeat + ";";
127 string backgroundImageSizeString = "background-size:" + backgroundImageSize + ";";
128 string styleString = string.Empty;
129
130 var decorations = Model.Item?.GetList("CssDecorations")?.SelectedValues ?? Enumerable.Empty<string>();
131 var css = string.Empty;
132 var cssClasses = new List<string> { };
133
134 foreach (var itemId in decorations)
135 {
136 var item = Dynamicweb.Content.Services.Items.GetItem("Swift_Css", itemId);
137 item.TryGetValue("Class", out object classes);
138 if (classes is null)
139 {
140 continue;
141 }
142
143 var cssString = (string)classes;
144 if (cssString.StartsWith("["))
145 {
146 var cssArray = Dynamicweb.Core.Converter.Deserialize<string[]>(cssString);
147 cssClasses.AddRange(cssArray);
148 }
149 else
150 {
151 cssClasses.Add(cssString.Replace(",", " "));
152 }
153 }
154 css = string.Join(" ", cssClasses).Trim();
155
156 @* Only gradient *@
157
158 if (!string.IsNullOrEmpty(gradient) && string.IsNullOrEmpty(backgroundImagePath) && gradientOpacity != ("0.00"))
159 {
160 styleString += "style=\"background-image:" + gradientString + ";\"";
161 }
162
163 @* Only background image *@
164
165 else if (string.IsNullOrEmpty(gradient) && !string.IsNullOrEmpty(backgroundImagePath))
166 {
167 styleString += "style=\"background-image:" + backgroundImageString + "," + backgroundImagePositionString + backgroundRepeatString + backgroundImageSizeString + "\"";
168 }
169
170 @* Gradient and background image *@
171
172 else if (!string.IsNullOrEmpty(gradient) && !string.IsNullOrEmpty(backgroundImagePath))
173 {
174 styleString += "style=\"background-image:" + gradientString + "," + backgroundImageString + ";" + backgroundImagePositionString + backgroundRepeatString + backgroundImageSizeString + "\"";
175 }
176
177 if (Pageview.IsVisualEditorMode || !string.IsNullOrWhiteSpace(Model.Column(1).Output()))
178 {
179 <div class="@(sectionClass)@(theme) @(css) item_@Model.Item.SystemName.ToLower()" @styleString>
180 <div class="@containerClass@(hideOverflow)">
181 <div class="grid grid-1">
182 <div class="g-col" data-col-size="12" @animationOnScrollCol1 style="--bs-columns:12">
183 @Model.Column(1).Output()
184 </div>
185 </div>
186 </div>
187 </div>
188 }
189 }
190