_layouts/feature.html in appscms-tools-theme-2.9.9 vs _layouts/feature.html in appscms-tools-theme-3.0.0

- old
+ new

@@ -1,259 +1,291 @@ -{% assign file = page.fileName %} -{% assign lang = page.lang %} -{% assign folder = page.folderName %} -{% assign featureData= site.data[folder][lang][file] %} +{% assign file = page.fileName %} {% assign lang = page.lang %} {% assign folder += page.folderName %} {% assign featureData= site.data[folder][lang][file] %} <!DOCTYPE html> <html lang="{{page.lang}}"> -{% include head/index.html %} + {% include head/index.html %} -<body> - {% include header/index.html %} - {%- if site.safeui -%} - <div class="alert alert-{{featureData.variant | default: 'info'}} alert-dismissible fade show text-center" - role="alert" id="safeui-alert"> - <div class="container"> - <img src="/assets/secure.svg" height="23px" width="18px" alt="secure" {%- if site.crossorigin -%} - crossorigin {%- endif -%}> &nbsp; - {%- if featureData.alertmsg -%} - {{featureData.alertmsg}} - {%- else -%} - We do not upload any files to server, hence your data is 100% secure. - {%- endif -%} &nbsp; - <img src="/assets/noserverupload.svg" height="23px" width="20px" alt="no server upload" {%- if - site.crossorigin -%} crossorigin {%- endif -%}> - <button type="button" class="close" data-dismiss="alert" aria-label="Close"> - <span aria-hidden="true">&times;</span> - </button> - </div> - </div> - {%- endif -%} - {%- if page.layout != "frame" and page.layout != "photo-effects-home" and page.layout != "video" -%} - <div class="flex-container pb-3"> - <div class="flex-class py-4 mt-4 mt-md-0 "> - <div id="h1-img-wrapper" class="d-flex justify-content-center align-items-center"><span id="h1-img" - class="fHhdVc"> - <div class="div-cont feature-img mr-2"> - {%- if featureData.img -%} - <img style=width:{{featureData.imgwidth}};height:{{featureData.imgheight}}; - src="{{featureData.img}}" alt="{{featureData.imgalt}}" {%- if site.crossorigin -%} - crossorigin {%- endif -%}> - {%- else -%} - <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" - viewBox="0 0 36 36" fill="#000"> - <path - d="M6,6 L9,18 L6,30 L18,27 L30,30 L27,18 L30,6 L18,9 L6,6 Z M3,3 L18,6.75 L33,3 L29.25,18 L33,33 L18,29.25 L3,33 L6.75,18 L3,3 Z"> - </path> - </svg> - {%- endif -%} - </div> - </span> - {%- assign featureh1 = featureData.H1 | replace: "$variable", page.value -%} - <h1 id="feature-h1" class="feature-h1">{%- for word in featureh1-%} - {%- if forloop.first == true -%} - {{word | capitalize }} - {%- else -%} - {{word}} - {%- endif -%} - {%- endfor -%}</h1> - </div> - {%- assign featureh2 = featureData.H2 | replace: "$variable", page.value -%} - <h2 id="feature-h2" class="feature-h2"> - {%- for word in featureh2 -%} - {%- if forloop.first == true -%} - {{word | capitalize }} - {%- else -%} - {{word}} - {%- endif -%} - {%- endfor -%} - </h2> - </div> - </div> - {%- endif -%} + <body> + {% include header/index.html %} {%- if site.safeui -%} + <div + class="alert alert-{{featureData.variant | default: 'info'}} alert-dismissible fade show text-center" + role="alert" + id="safeui-alert" + > + <div class="container"> + <img + src="/assets/secure.svg" + height="23px" + width="18px" + alt="secure" + {%- + if + site.crossorigin + -%} + crossorigin + {%- + endif + -%} + /> + &nbsp; {%- if featureData.alertmsg -%} {{featureData.alertmsg}} {%- else + -%} We do not upload any files to server, hence your data is 100% + secure. {%- endif -%} &nbsp; + <img + src="/assets/noserverupload.svg" + height="23px" + width="20px" + alt="no server upload" + {%- + if + site.crossorigin + -%} + crossorigin + {%- + endif + -%} + /> + <button + type="button" + class="close" + data-dismiss="alert" + aria-label="Close" + > + <span aria-hidden="true">&times;</span> + </button> + </div> + </div> + {%- endif -%} {%- if page.layout != "frame" and page.layout != + "photo-effects-home" and page.layout != "video" and page.layout != "audio" + -%} + <div class="flex-container pb-3"> + <div class="flex-class py-4 mt-4 mt-md-0"> + <div + id="h1-img-wrapper" + class="d-flex justify-content-center align-items-center" + > + <span id="h1-img" class="fHhdVc"> + <div class="div-cont feature-img mr-2"> + {%- if featureData.img -%} + <img + style="width:{{featureData.imgwidth}};height:{{featureData.imgheight}};" + src="{{featureData.img}}" + alt="{{featureData.imgalt}}" + {%- + if + site.crossorigin + -%} + crossorigin + {%- + endif + -%} + /> + {%- else -%} + <svg + xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink" + viewBox="0 0 36 36" + fill="#000" + > + <path + d="M6,6 L9,18 L6,30 L18,27 L30,30 L27,18 L30,6 L18,9 L6,6 Z M3,3 L18,6.75 L33,3 L29.25,18 L33,33 L18,29.25 L3,33 L6.75,18 L3,3 Z" + ></path> + </svg> + {%- endif -%} + </div> + </span> + {%- assign featureh1 = featureData.H1 | replace: "$variable", + page.value -%} + <h1 id="feature-h1" class="feature-h1"> + {%- for word in featureh1-%} {%- if forloop.first == true -%} {{word + | capitalize }} {%- else -%} {{word}} {%- endif -%} {%- endfor -%} + </h1> + </div> + {%- assign featureh2 = featureData.H2 | replace: "$variable", page.value + -%} + <h2 id="feature-h2" class="feature-h2"> + {%- for word in featureh2 -%} {%- if forloop.first == true -%} {{word + | capitalize }} {%- else -%} {{word}} {%- endif -%} {%- endfor -%} + </h2> + </div> + </div> + {%- endif -%} {%- if site.noFeatureBox == true -%} + <div class="feature-content-box" id="theme-content-box">{{content}}</div> + {%- else -%} {%- if page.noBox == true -%} + <div class="feature-content-box" id="theme-content-box">{{content}}</div> + {%- else -%} + <div class="box-padding" id="theme-content-box"> + <div class="d-flex" id="__cond-922051"> + <div class="flex-container"> + <div class="flex-class"> + <div class="d-flex flex-column"> + <div + class="box" + style="background:{{featureData.color}};min-height:{{featureData.height}};width:{{featureData.width}}" + > + <div class="box-border"></div> + <div class="content-box">{{content}}</div> + </div> + </div> + </div> + </div> + </div> + </div> + {%- endif -%} {%- endif -%} - {%- if site.noFeatureBox == true -%} - <div class="feature-content-box" id="theme-content-box"> - {{content}} - </div> - {%- else -%} - {%- if page.noBox == true -%} - <div class="feature-content-box" id="theme-content-box"> - {{content}} - </div> - {%- else -%} - <div class="box-padding" id="theme-content-box"> - <div class="d-flex" id="__cond-922051"> - <div class="flex-container"> - <div class="flex-class"> - <div class="d-flex flex-column"> - <div class="box" - style=background:{{featureData.color}};min-height:{{featureData.height}};width:{{featureData.width}}> - <div class="box-border"></div> - <div class="content-box"> - {{content}} - </div> - </div> - </div> - </div> - </div> - </div> - </div> - {%- endif -%} + <div class="container mt-4 mb-5"> + <div class="row px-0"> + {%- if site.monumetricId and page.url != '/' and page.lang == 'en' -%} - {%- endif -%} + <div class="col-md-9 mx-auto"> + <div class="row"> + {%- endif -%} {% for data in featureData.TEXTUAL_CONTENT %} + <div + class="{%- if site.monumetricId and page.url != '/' and page.lang == 'en' -%} col-md-6 my-4 {%- else -%} col-md-4 my-4 {%- endif -%}" + > + <div> + <img + class="feature-card-img" + src="{{data.logoUrl}}" + loading="lazy" + height="48px" + width="48px" + alt="{{data.header}}" + {%- + if + site.crossorigin + -%} + crossorigin + {%- + endif + -%} + /> + <div class="feature-card-title"> + {{data.header | replace: "$variable", page.value}} + </div> + <div class="feature-card-desc"> + {{data.content | replace: "$variable", page.value}} + </div> + </div> + </div> + {% endfor %} {%- if site.monumetricId and page.url != '/' and + page.lang == 'en' -%} + </div> + </div> + {%- endif -%} + </div> + </div> + <section class="how-to-section"> + <div class="container"> + <div class="row"> + {%- if site.monumetricId and page.url != '/' and page.lang == 'en' -%} - <div class="container mt-4 mb-5"> + <div class="col-md-9 mx-auto"> + <div class="row"> + {%- endif -%} + <div class="col-md-6 order-0"> + {%- if featureData.HOW_TO_CONTENT.logoImageUrl -%} + <div class="how-to-img-wrapper"> + <img + class="how-to-leftimg" + height="180px" + width="300px" + src="{{featureData.HOW_TO_CONTENT.logoImageUrl}}" + loading="lazy" + alt="{{featureData.HOW_TO_CONTENT.logoImageAlt | default: 'how to image' }}" + {%- + if + site.crossorigin + -%} + crossorigin + {%- + endif + -%} + /> + </div> + {%- endif -%} + </div> + <div class="col-md-6 order-1"> + <div class="how-to-right"> + <h3 class="how-to-title text-left"> + {{featureData.HOW_TO_CONTENT.heading | replace: "$variable", + page.value}} + </h3> + <ol class="how-to-list"> + {% for data in featureData.HOW_TO_CONTENT.steps %} - <div class="row px-0"> - {%- if site.monumetricId and page.url != '/' and page.lang == 'en' -%} - - <div class="col-md-9 mx-auto"> - <div class="row"> - {%- endif -%} - - {% for data in featureData.TEXTUAL_CONTENT %} - <div class="{%- if site.monumetricId and page.url != '/' and page.lang == 'en' -%} - col-md-6 my-4 - {%- else -%} - col-md-4 my-4 - {%- endif -%}"> - <div><img class="feature-card-img" src="{{data.logoUrl}}" loading="lazy" height="48px" - width="48px" alt="{{data.header}}" {%- if site.crossorigin -%} crossorigin {%- endif - -%}> - <div class="feature-card-title">{{data.header | replace: "$variable", page.value}}</div> - <div class="feature-card-desc">{{data.content | replace: "$variable", page.value}}</div> - </div> - </div> - {% endfor %} - {%- if site.monumetricId and page.url != '/' and page.lang == 'en' -%} - - </div> - </div> - {%- endif -%} - - - </div> - </div> - <section class="how-to-section"> - <div class="container"> - <div class="row"> - {%- if site.monumetricId and page.url != '/' and page.lang == 'en' -%} - - <div class="col-md-9 mx-auto"> - <div class="row"> - {%- endif -%} - <div class="col-md-6 order-0 "> - {%- if featureData.HOW_TO_CONTENT.logoImageUrl -%} - <div class="how-to-img-wrapper "><img class="how-to-leftimg" height="180px" width="300px" - src="{{featureData.HOW_TO_CONTENT.logoImageUrl}}" loading="lazy" - alt="{{featureData.HOW_TO_CONTENT.logoImageAlt | default: 'how to image' }}" {%- if - site.crossorigin -%} crossorigin {%- endif -%}> - </div> - {%- endif -%} - </div> - <div class="col-md-6 order-1"> - <div class="how-to-right"> - <h3 class="how-to-title text-left">{{featureData.HOW_TO_CONTENT.heading | replace: - "$variable", - page.value}}</h3> - <ol class="how-to-list"> - {% for data in featureData.HOW_TO_CONTENT.steps %} - - <li id="step{{forloop.index}}" class="how-to-list-item"> - <span>{{forloop.index}}.</span>{{data | - replace: "$variable", - page.value}} - </li> - {% endfor %} - </ol> - </div> - </div> - {%- if site.monumetricId and page.url != '/' and page.lang == 'en' -%} - - </div> - </div> - {%- endif -%} - </div> - - </div> - </section> - {%- assign showFaqs= true -%} - {%- for item in site.noFaqsList -%} - {%- if item == page.lang -%} - {%- assign showFaqs = false -%} - {%- break -%} - {%- else -%} - {%- assign showFaqs = true -%} - {%- endif -%} - {%- endfor -%} - {%- if showFaqs == true -%} - {%- if featureData.FAQ.size>0 -%} - <section class="faq-section"> - <div class="container"> - <div class="row"> - <div class="col-md-8 mx-auto"> - <div class="faq"> - <h3 class="feature-h1 text-center mb-4">{{featureData.faqheading | default: 'Frequently Asked - Questions'}}</h3> - <ul class="list-unstyled"> - {% for data in featureData.FAQ %} - <li> - <h3 class="faq-question" itemprop="name">{{data.question | replace: "$variable", - page.value}}<em style="transform: rotate(-135deg);"> - <i></i></em> - </h3> - <div style="display: block;"> - <p class="faq-answer" itemprop="text">{{data.answer | replace: "$variable", - page.value}} - </p> - </div> - </li> - {% endfor %} - </ul> - </div> - </div> - </div> - </div> - </section> - {%- endif -%} - {%- endif -%} - {%- include share/socialshare.html -%} - {%- include Rating/rating.html -%} - {%- include /Usp/usp.html -%} - {%- if featureData.display_formats -%} - <div class="container compare-table "> - {%- include fileformat/fileformatdetail.html -%} - </div> - {%- endif -%} - {%- if featureData.compare_formats -%} - <div class="container file-detail-table "> - {%- include fileformat/comparisonfiles.html -%} - </div> - {%- endif -%} - {%- assign langen = "en" -%} - {%- if site.data[folder][langen][file].categories -%} - {% assign categories= site.data[folder][langen][file].categories %} - {%- else -%} - {% assign categories= page.categories %} - {%- endif -%} - {%- if site.data[folder][langen][file].tags -%} - {% assign tags= site.data[folder][langen][file].tags %} - {%- else -%} - {% assign tags= page.tags %} - {%- endif -%} - {%- if categories.size> 0 or tags.size>0-%} - {%- include section/related_categories_post.html -%} - {%- else -%} - {%- include section/recent_posts.html -%} - {% endif %} - {%- if site.customblogdata -%} - {%- if categories.size> 0 or tags.size>0-%} - {%- include customblog/relatedposts.html -%} - {%- else -%} - {%- include customblog/recentposts.html -%} - {% endif %} - {%- endif -%} - {% include footer/index.html %} - {% include script.html %} -</body> - -</html> \ No newline at end of file + <li id="step{{forloop.index}}" class="how-to-list-item"> + <span>{{forloop.index}}.</span>{{data | replace: + "$variable", page.value}} + </li> + {% endfor %} + </ol> + </div> + </div> + {%- if site.monumetricId and page.url != '/' and page.lang == 'en' + -%} + </div> + </div> + {%- endif -%} + </div> + </div> + </section> + {%- assign showFaqs= true -%} {%- for item in site.noFaqsList -%} {%- if + item == page.lang -%} {%- assign showFaqs = false -%} {%- break -%} {%- else + -%} {%- assign showFaqs = true -%} {%- endif -%} {%- endfor -%} {%- if + showFaqs == true -%} {%- if featureData.FAQ.size>0 -%} + <section class="faq-section"> + <div class="container"> + <div class="row"> + <div class="col-md-8 mx-auto"> + <div class="faq"> + <h3 class="feature-h1 text-center mb-4"> + {{featureData.faqheading | default: 'Frequently Asked + Questions'}} + </h3> + <ul class="list-unstyled"> + {% for data in featureData.FAQ %} + <li> + <h3 class="faq-question" itemprop="name"> + {{data.question | replace: "$variable", page.value}}<em + style="transform: rotate(-135deg)" + > + <i></i + ></em> + </h3> + <div style="display: block"> + <p class="faq-answer" itemprop="text"> + {{data.answer | replace: "$variable", page.value}} + </p> + </div> + </li> + {% endfor %} + </ul> + </div> + </div> + </div> + </div> + </section> + {%- endif -%} {%- endif -%} {%- include share/socialshare.html -%} {%- + include Rating/rating.html -%} {%- include /Usp/usp.html -%} {%- if + featureData.display_formats -%} + <div class="container compare-table"> + {%- include fileformat/fileformatdetail.html -%} + </div> + {%- endif -%} {%- if featureData.compare_formats -%} + <div class="container file-detail-table"> + {%- include fileformat/comparisonfiles.html -%} + </div> + {%- endif -%} {%- assign langen = "en" -%} {%- if + site.data[folder][langen][file].categories -%} {% assign categories= + site.data[folder][langen][file].categories %} {%- else -%} {% assign + categories= page.categories %} {%- endif -%} {%- if + site.data[folder][langen][file].tags -%} {% assign tags= + site.data[folder][langen][file].tags %} {%- else -%} {% assign tags= + page.tags %} {%- endif -%} {%- if categories.size> 0 or tags.size>0-%} {%- + include section/related_categories_post.html -%} {%- else -%} {%- include + section/recent_posts.html -%} {% endif %} {%- if site.customblogdata -%} {%- + if categories.size> 0 or tags.size>0-%} {%- include + customblog/relatedposts.html -%} {%- else -%} {%- include + customblog/recentposts.html -%} {% endif %} {%- endif -%} {% include + footer/index.html %} {% include script.html %} + </body> +</html>