Untitled
unknown
plain_text
2 years ago
14 kB
7
Indexable
(function(){ (function (w) { "use strict"; var tag = "cv-2", debug = document.cookie.indexOf("cfQA") > -1, window = typeof unsafeWindow !== "undefined" ? unsafeWindow : w, testData = { "assets": { "logo": "https://cfactory-img.s3.amazonaws.com/pitches/chrysaliscourses/cvClogo.png", "featuredLogos": [ "https://cfactory-img.s3.amazonaws.com/pitches/chrysaliscourses/Frame%20279.png", "https://cfactory-img.s3.amazonaws.com/pitches/chrysaliscourses/Frame%20277.png", "https://cfactory-img.s3.amazonaws.com/pitches/chrysaliscourses/Frame%20278.png", "https://cfactory-img.s3.amazonaws.com/pitches/chrysaliscourses/Frame%20280.png" ], "heroBigImg": "https://cfactory-img.s3.amazonaws.com/pitches/chrysaliscourses/cvDesktopHero.png", "ratingStars": "https://cfactory-img.s3.amazonaws.com/pitches/chrysaliscourses/Trustrating.svg" }, "reviews": [ { "date": "28 May 2023", "comment": "I did the Level 5 Diploma in Psychotherapeutic Counselling over two years and loved it. I <strong>felt fullly supported</strong> by student support and had no issues during my time", "author": "donna hastings" }, { "date": "4 Aug 2023", "comment": "<strong>Great support</strong>, thank you. Clear information and advice, quick response and very professional.", "author": "N Waters" }, { "date": "19 Jul 2023", "comment": "<strong>The course has been superb</strong>, catering for all abilities and learning preferences.", "author": "Sarah" }, ], "heroCopy": { "headline": "Start your", "subHeadline": '"Have you ever imagined what your life would be like if you could make a real difference to people’s lives in a career that you love?" Become a Counsellor with Chrysalis', "ctaText": "Contact US" } }; window[tag] = { log: function (msg) { if (debug) console.log("[CV]", tag, "-->", msg); }, waitForElement: function (cssSelector, callback, timeout = 5000) { var stop, elementCached, timeout, check = function () { try { elementCached = document.querySelector(cssSelector); if (stop) return; if (elementCached) { callback(elementCached); clearTimeout(timeout); window[tag].log(cssSelector + " found"); } else { window.requestAnimationFrame(check); } } catch (err) { window[tag].log(err.message); } }; window.requestAnimationFrame(check); timeout = setTimeout(function () { stop = true; window[tag].log(cssSelector + " not found"); }, timeout); }, testStart: function () { try { this.waitForElement("body", function (docBody) { docBody.classList.add(tag); }); initVariation(); window[tag].log("test running"); } catch (err) { window[tag].log(err.message); } }, }; window[tag].testStart(); function initVariation() { window[tag].waitForElement("html body footer", () => { // changing logo changeLogo(); // changeHero changeHero(); }); } const changeLogo = () => { const imgUrl = testData.assets.logo; document.querySelector('html body #navigation-header .grid-container .logo-container>a').innerHTML = `<img src="${imgUrl}">`; } const changeHero = () => { const featuredLogosHtml = generateFeaturedLogosHTML(); const newHeroStructureHTML = ` <div class="cv-2-hero"> <div class="cv-2-hero_contianer"> <div class="cv-2-hero-left"> <h1>${testData.heroCopy.headline}</h1> <p>${testData.heroCopy.subHeadline}</p> <a>${testData.heroCopy.ctaText}</a> </div> <div class="cv-2-hero-right"> <div class="cv-2-hero_slides"> ${generateReviews()} </div> <img src="${testData.assets.heroBigImg}"> </div> </div> </div> <div class="${tag}-featured-logos"> <div class="${tag}-featured-logos_contianer"> <div class="${tag}-logo-card">fully accredited</div> <!-- logos will go here --> ${featuredLogosHtml} </div> </div>`; document.querySelector('html body main[class*="homepage"] .header-slider').innerHTML = newHeroStructureHTML; } const generateFeaturedLogosHTML = () => { const logos = testData.assets.featuredLogos; const fHtml = logos.reduce((t, crr) => { return t += `<div class="${tag}-logo-card"><img src="${crr}"></div>`; }, ""); return fHtml; } const generateReviews = () => { const reviews = testData.reviews; const rHtml = reviews.reduce((t, crr) => { return t += `<div class="${tag}-hero_slide"> <span class="${tag}-hero_slide_top"><img src="${testData.assets.ratingStars}">${crr.date}</span> <p class="${tag}-hero_slide_comment">${crr.comment}</p> <span class="${tag}-hero_slide_author">${crr.author}</span> </div>`; }, ""); return rHtml; } })(window);var style=document.createElement('style');style.type='text/css';style.appendChild(document.createTextNode('/* nav bar */html body #navigation-container { background: white !important; height: auto !important; position: static !important; box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.07);}html body #navigation-header .grid-container { padding: 16px 40px !important; max-width: 1280px !important; margin-left: auto; margin-right: auto;}html body #navigation-header .grid-container .logo-wrapper { margin-top: unset !important;}html body #navigation-header .grid-container .logo-container { position: static !important; height: auto !important; width: auto !important; box-shadow: none !important; border: none !important; padding: 0 !important;}html body #navigation-header { height: auto !important;}html body #navigation-header .grid-container .logo-container { width: 189px !important;}@media(max-width:768px) { html body #navigation-header .grid-container { padding: 12px 16px !important; } html body #navigation-header .grid-container .logo-container { width: 141px !important; }}/* nav bar *//* hiding the shape 01 */html body .featured-content[class*="homepage"]:nth-child(2)>div.content-borders[class*="shape-01"] { display: none !important;}/* hiding the shape 01 *//* main */html body main { margin-top: 0 !important;}/* main *//* full accredicted */html body main[class*="homepage"] .header-slider { background: white !important; padding-top: 0 !important;}html body .cv-2-featured-logos { background: rgba(60, 182, 206, 0.08); padding: 25px 100px;}html body .cv-2-featured-logos_contianer { max-width: 1127px !important; margin-left: auto; margin-right: auto; display: flex; align-items: center; justify-content: space-between;}html body .cv-2-logo-card { color: #313131; font-size: 14px; font-style: normal; font-weight: 700 !important; line-height: 150%; /* 21px */ text-transform: uppercase; width: 118.131px; height: 50px; display: flex; justify-content: center; align-items: center;}html body .cv-2-logo-card:first-child { min-width: max-content;}html body .cv-2-logo-card+.cv-2-logo-card { margin-left: 20px !important;}/* full accredicted *//* hero */html body .cv-2-hero_contianer { max-width: 1180px; width: 100%; margin-left: auto; margin-right: auto; display: flex; justify-content: space-between;}html body .cv-2-hero { padding: 0 39px 0 100px !important;}html body .cv-2-hero-left { width: 346px; display: flex; flex-direction: column; justify-content: center;}html body .cv-2-hero-left h1 { color: #313131; font-size: 52px; font-style: normal; font-weight: 700; /* 62.4px */ text-transform: uppercase; line-height: 62.4px; margin-bottom: 12px !important;}html body .cv-2-hero-left h1::after { content: "journey"; color: #B51556; display: block;}html body .cv-2-hero-left p { color: #313131; font-size: 16px; font-style: normal; line-height: 24px; /* 24px */ margin-bottom: 32px !important;}html body .cv-2-hero-left a { color: #FFF; font-size: 14px; font-style: normal; font-weight: 550; line-height: 21px; text-transform: uppercase; background: #3CB6CE; display: flex; padding: 12px 40px; width: max-content; align-items: center; transition: background-color .25s ease-out, color .25s ease-out;}html body .cv-2-hero-left a:hover { background-color: #2d9eb5; color: #fff;}html body .cv-2-hero_slide { display: flex; padding: 20px; flex-direction: column; align-items: flex-start; grid-gap: 16px; background: #FFF; box-shadow: 0px 20px 62px 1px rgba(0, 0, 0, 0.08); position: absolute;}html body .cv-2-hero_slide_top { display: flex; align-items: center; justify-content: space-between; color: rgba(49, 49, 49, 0.60); text-align: right; font-feature-settings: \'cv09\' on, \'cv04\' on, \'ss01\' on, \'cv03\' on, \'ss03\' on, \'cv06\' on; font-size: 12px; font-style: normal; font-weight: 550; line-height: 12px; width: 100%;}html body .cv-2-hero_slide_comment { margin-bottom: 0 !important; color: #313131; font-feature-settings: \'cv09\' on, \'cv04\' on, \'ss01\' on, \'cv03\' on, \'ss03\' on, \'cv06\' on; font-size: 14px; font-style: normal; font-weight: 550; line-height: 19.6px;}html body .cv-2-hero_slide_author { color: rgba(49, 49, 49, 0.60); font-feature-settings: \'cv09\' on, \'cv04\' on, \'ss01\' on, \'cv03\' on, \'ss03\' on, \'cv06\' on; font-size: 11px; font-style: normal; font-weight: 550; line-height: 11px; text-transform: uppercase;}html body .cv-2-hero-right { flex: 1; margin-left: 106px !important; position: relative; display: flex; justify-content: center; align-items: center; isolation: isolate; padding-top: 76px;}html body .cv-2-hero-right>img { width: 360px !important; z-index: 99;}html body .cv-2-hero_slide:first-child { right: 24px; bottom: 126px; z-index: 100; width: 225px;}html body .cv-2-hero_slide:nth-child(2) { top: 77px; left: 50px; width: 260px;}html body .cv-2-hero_slide:nth-child(3) { bottom: 56px; left: 2px; z-index: 100; width: 232px;}@media(max-width:1100px) and (min-width:769px) { html body .cv-2-hero_slide { width: 163px !important; padding: 10px !important; } html body .cv-2-hero_slide * { font-size: 10px !important; } html body .cv-2-hero-right>img { margin-right: -101px !important; } html body .cv-2-hero-right { margin-left: 10px !important; } html body .cv-2-hero { padding-left: 30px !important; padding-right: 30px !important; } html body .cv-2-hero-right>img { width: 300px !important; } html body .cv-2-hero_slide:first-child { bottom: 77px !important; }}/* 768px */@media(max-width:768px) { html body .cv-2-hero { padding: 0 !important; } html body .cv-2-featured-logos_contianer { flex-wrap: wrap; } html body .cv-2-logo-card:first-child { width: 100%; height: auto !important; margin-bottom: 13px; } html body .cv-2-logo-card+.cv-2-logo-card { margin-left: 0 !important; } html body main[class*="homepage"] .header-slider { padding-left: 16px; padding-right: 16px; } html body .cv-2-hero_contianer { flex-direction: column; } html body .cv-2-hero-left h1 { font-size: 36px; line-height: normal; margin-bottom: 23px !important; margin-top: 44px !important; } html body .cv-2-hero-left p { max-width: 291px !important; margin-bottom: 21px !important; } html body .cv-2-hero-left { width: 100% !important; } html body .cv-2-hero-right { padding-top: 82px !important; margin-left: -16px !important; margin-right: -16px !important; } html body .cv-2-hero_slide { position: static !important; min-width: 216px !important; max-width: 216px !important; } html body .cv-2-hero-right>img { position: absolute !important; z-index: 1 !important; bottom: 0 !important; right: -110px !important; width: 304px !important; } html body .cv-2-hero_slides { position: relative; z-index: 9; display: flex; width: max-content; overflow-x: scroll; grid-gap: 10px !important; padding-bottom: 20px; padding-left: 18px; padding-right: 18px; } html body .cv-2-hero_slides::-webkit-scrollbar { display: none !important; } html body .cv-2-featured-logos { padding: 25px 30px !important; margin-left: -16px !important; margin-right: -16px; } html body .cv-2-hero-left a { padding: 12px 24px !important; }}@media(max-width:1280px) { html body .cv-2-hero_slide:nth-child(2) { left: 0px !important; }}@media(min-width:576px) and (max-width:768px) { html body .cv-2-hero-left h1::after { display: inline !important; } html body .cv-2-hero-left p { max-width: 466px !important; }}@media(max-width:440px) { html body .cv-2-logo-card:nth-child(2), html body .cv-2-logo-card:nth-child(3) { margin-bottom: 30px !important; }}'));document.head.appendChild(style); })();
Editor is loading...