https://www.codedex.io/_next/static/chunks/pages/og-preview/[slug]-aaf65f6aff415376.js

1(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[1363],{91392:function(e,t,n){(window.__NEXT_P=window.__NEXT_P||[]).push(["/og-preview/[slug]",function(){return n(37825)}])},98753:function(e,t,n){"use strict";n.d(t,{YJ:function(){return i},jZ:function(){return isParallaxBannerSlug}});let r=["python","html","css","javascript","sql"],i={python:{background:"/images/python/pythonbannerbackground.png",foreground:"/images/python/pythonanimated-forground.gif",backgroundOffSet:368,foregroundOffSet:150,backgroundcolor:"#32c4ff"},html:{background:"/images/html/html-banner-background.png",foreground:"/images/html/html-banner-foreground.gif",backgroundOffSet:280,foregroundOffSet:380,backgroundcolor:"#32c4ff"},css:{background:"/images/css/css-course-banner-background.png",foreground:"/images/css/css-course-banner-forground.gif",backgroundOffSet:470,foregroundOffSet:-300,backgroundcolor:"#3284fa"},javascript:{background:"/images/javascript/javascript-course-banner-background.png",foreground:"/images/javascript/javascript-course-banner-foreground.gif",backgroundOffSet:470,foregroundOffSet:0,backgroundcolor:"#6741b0"},sql:{background:"/images/sql/sql-background.gif",foreground:"/images/sql/sql-forground.gif",backgroundOffSet:460,foregroundOffSet:0,backgroundcolor:"#2d76fe"}};function isParallaxBannerSlug(e){return r.includes(e)}},597:function(e,t,n){var r=n(34155);n(91479);var i=n(67294),o=i&&"object"==typeof i&&"default"in i?i:{default:i};function _defineProperties(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}var s=void 0!==r&&r.env&&!0,isString=function(e){return"[object String]"===Object.prototype.toString.call(e)},a=function(){function StyleSheet(e){var t=void 0===e?{}:e,n=t.name,r=void 0===n?"stylesheet":n,i=t.optimizeForSpeed,o=void 0===i?s:i;invariant$1(isString(r),"`name` must be a string"),this._name=r,this._deletedRulePlaceholder="#"+r+"-deleted-rule____{}",invariant$1("boolean"==typeof o,"`optimizeForSpeed` must be a boolean"),this._optimizeForSpeed=o,this._serverSheet=void 0,this._tags=[],this._injected=!1,this._rulesCount=0;var a=document.querySelector('meta[property="csp-nonce"]');this._nonce=a?a.getAttribute("content"):null}var e,t=StyleSheet.prototype;return t.setOptimizeForSpeed=function(e){invariant$1("boolean"==typeof e,"`setOptimizeForSpeed` accepts a boolean"),invariant$1(0===this._rulesCount,"optimizeForSpeed cannot be when rules have already been inserted"),this.flush(),this._optimizeForSpeed=e,this.inject()},t.isOptimizeForSpeed=function(){return this._optimizeForSpeed},t.inject=function(){var e=this;if(invariant$1(!this._injected,"sheet already injected"),this._injected=!0,this._optimizeForSpeed){this._tags[0]=this.makeStyleTag(this._name),this._optimizeForSpeed="insertRule"in this.getSheet(),this._optimizeForSpeed||(s||console.warn("StyleSheet: optimizeForSpeed mode not supported falling back to standard mode."),this.flush(),this._injected=!0);return}this._serverSheet={cssRules:[],insertRule:function(t,n){return"number"==typeof n?e._serverSheet.cssRules[n]={cssText:t}:e._serverSheet.cssRules.push({cssText:t}),n},deleteRule:function(t){e._serverSheet.cssRules[t]=null}}},t.getSheetForTag=function(e){if(e.sheet)return e.sheet;for(var t=0;t<document.styleSheets.length;t++)if(document.styleSheets[t].ownerNode===e)return document.styleSheets[t]},t.getSheet=function(){return this.getSheetForTag(this._tags[this._tags.length-1])},t.insertRule=function(e,t){if(invariant$1(isString(e),"`insertRule` accepts only strings"),this._optimizeForSpeed){var n=this.getSheet();"number"!=typeof t&&(t=n.cssRules.length);try{n.insertRule(e,t)}catch(t){return s||console.warn("StyleSheet: illegal rule: \n\n"+e+"\n\nSee https://stackoverflow.com/q/20007992 for more info"),-1}}else{var r=this._tags[t];this._tags.push(this.makeStyleTag(this._name,e,r))}return this._rulesCount++},t.replaceRule=function(e,t){if(this._optimizeForSpeed){var n=this.getSheet();if(t.trim()||(t=this._deletedRulePlaceholder),!n.cssRules[e])return e;n.deleteRule(e);try{n.insertRule(t,e)}catch(r){s||console.warn("StyleSheet: illegal rule: \n\n"+t+"\n\nSee https://stackoverflow.com/q/20007992 for more info"),n.insertRule(this._deletedRulePlaceholder,e)}

1}else{var r=this._tags[e];invariant$1(r,"old rule at index `"+e+"` not found"),r.textContent=t}return e},t.deleteRule=function(e){if(this._optimizeForSpeed)this.replaceRule(e,"");else{var t=this._tags[e];invariant$1(t,"rule at index `"+e+"` not found"),t.parentNode.removeChild(t),this._tags[e]=null}},t.flush=function(){this._injected=!1,this._rulesCount=0,this._tags.forEach(function(e){return e&&e.parentNode.removeChild(e)}),this._tags=[]},t.cssRules=function(){var e=this;return this._tags.reduce(function(t,n){return n?t=t.concat(Array.prototype.map.call(e.getSheetForTag(n).cssRules,function(t){return t.cssText===e._deletedRulePlaceholder?null:t})):t.push(null),t},[])},t.makeStyleTag=function(e,t,n){t&&invariant$1(isString(t),"makeStyleTag accepts only strings as second parameter");var r=document.createElement("style");this._nonce&&r.setAttribute("nonce",this._nonce),r.type="text/css",r.setAttribute("data-"+e,""),t&&r.appendChild(document.createTextNode(t));var i=document.head||document.getElementsByTagName("head")[0];return n?i.insertBefore(r,n):i.appendChild(r),r},_defineProperties(StyleSheet.prototype,[{key:"length",get:function(){return this._rulesCount}}]),e&&_defineProperties(StyleSheet,e),StyleSheet}();function invariant$1(e,t){if(!e)throw Error("StyleSheet: "+t+".")}var stringHash=function(e){for(var t=5381,n=e.length;n;)t=33*t^e.charCodeAt(--n);return t>>>0},c={};function computeId(e,t){if(!t)return"jsx-"+e;var n=String(t),r=e+n;return c[r]||(c[r]="jsx-"+stringHash(e+"-"+n)),c[r]}function computeSelector(e,t){var n=e+t;return c[n]||(c[n]=t.replace(/__jsx-style-dynamic-selector/g,e)),c[n]}var u=function(){function StyleSheetRegistry(e){var t=void 0===e?{}:e,n=t.styleSheet,r=void 0===n?null:n,i=t.optimizeForSpeed,o=void 0!==i&&i;this._sheet=r||new a({name:"styled-jsx",optimizeForSpeed:o}),this._sheet.inject(),r&&"boolean"==typeof o&&(this._sheet.setOptimizeForSpeed(o),this._optimizeForSpeed=this._sheet.isOptimizeForSpeed()),this._fromServer=void 0,this._indices={},this._instancesCounts={}}var e=StyleSheetRegistry.prototype;return e.add=function(e){var t=this;void 0===this._optimizeForSpeed&&(this._optimizeForSpeed=Array.isArray(e.children),this._sheet.setOptimizeForSpeed(this._optimizeForSpeed),this._optimizeForSpeed=this._sheet.isOptimizeForSpeed()),this._fromServer||(this._fromServer=this.selectFromServer(),this._instancesCounts=Object.keys(this._fromServer).reduce(function(e,t){return e[t]=0,e},{}));var n=this.getIdAndRules(e),r=n.styleId,i=n.rules;if(r in this._instancesCounts){this._instancesCounts[r]+=1;return}var o=i.map(function(e){return t._sheet.insertRule(e)}).filter(function(e){return -1!==e});this._indices[r]=o,this._instancesCounts[r]=1},e.remove=function(e){var t=this,n=this.getIdAndRules(e).styleId;if(function(e,t){if(!e)throw Error("StyleSheetRegistry: "+t+".")}(n in this._instancesCounts,"styleId: `"+n+"` not found"),this._instancesCounts[n]-=1,this._instancesCounts[n]<1){var r=this._fromServer&&this._fromServer[n];r?(r.parentNode.removeChild(r),delete this._fromServer[n]):(this._indices[n].forEach(function(e){return t._sheet.deleteRule(e)}),delete this._indices[n]),delete this._instancesCounts[n]}},e.update=function(e,t){this.add(t),this.remove(e)},e.flush=function(){this._sheet.flush(),this._sheet.inject(),this._fromServer=void 0,this._indices={},this._instancesCounts={}},e.cssRules=function(){var e=this,t=this._fromServer?Object.keys(this._fromServer).map(function(t){return[t,e._fromServer[t]]}):[],n=this._sheet.cssRules();return t.concat(Object.keys(this._indices).map(function(t){return[t,e._indices[t].map(function(e){return n[e].cssText}).join(e._optimizeForSpeed?"":"\n")]}).filter(function(e){return!!e[1]}))},e.styles=function(e){var t,n;return t=this.cssRules(),void 0===(n=e)&&(n={}),t.map(function(e){var t=e[0],r=e[1];return o.default.createElement("style",{id:"__"+t,key:"__"+t,nonce:n.nonce?n.nonce:void 0,dangerouslySetInnerHTML:{__html:r}})})},e.getIdAndRules=function(e){var t=e.children,n=e.dynamic,r=e.id;if(n){var i=computeId(r,n);return{styleId:i,rules:Array.isArray(t)?t.map(function(e){return computeSelector(i,e)}):[computeSelector(i,t)]}}return{styleId:computeId(r),rules:Array.isArray(t)?t:[t]}},e.selectFromServer=function(){return Array.prototype.slice.call(document.querySelectorAll('[id^="__jsx-"]')).reduce(function(e,t){return e[t.id.slice(2)]=t,e},{})},StyleSheetRegistry}(),l=i.createContext(null);l.displayName="StyleSheetContext";var d=o.default.useInsertionEffect||o.default.useLayoutEffect,f=new u;function JSXStyle(e){var t=f||i.useContext(l);return t&&d(function(){return t.add(e),function(){t.remove(e)}},[e.id,String(e.dynamic)]),null}JSXStyle.dynamic=function(e){return e.map(function(e){return computeId(e[0],e[1])}).join(" ")},t.style=JSXStyle},5379:function(e,t,n){"use strict";e.exports=n(597).style},37825:function(e,t,n){"use strict";n.r(t),n.d(t,{__N_SSG:function(){return y},default:function(){return _slug_}});var r=n(85893),i=n(5379),o=n.n(i),s=n(9008),a=n.n(s),c=n(82729),u=n(67294),l=n(19521),d=n(98753);

1function _templateObject(){let e=(0,c._)(["\n  width: ","px;\n  height: ",'px;\n  position: relative;\n  overflow: hidden;\n  image-rendering: pixelated;\n  font-family: "PixelGridM", monospace;\n']);return _templateObject=function(){return e},e}function _templateObject1(){let e=(0,c._)(["\n  position: absolute;\n  inset: 0;\n  background: ",";\n  image-rendering: pixelated;\n"]);return _templateObject1=function(){return e},e}function _templateObject2(){let e=(0,c._)(["\n  position: absolute;\n  inset: 0;\n  background-color: ",";\n  background-image: ",";\n  background-repeat: repeat-x;\n  background-position-y: 100%;\n  background-position-x: ",";\n  background-size: auto 100%;\n  image-rendering: pixelated;\n"]);return _templateObject2=function(){return e},e}function _templateObject3(){let e=(0,c._)(["\n  position: absolute;\n  inset: 0;\n  background-repeat: no-repeat;\n  background-position-y: 100%;\n  background-position-x: 50%;\n  background-size: auto 100%;\n  image-rendering: pixelated;\n"]);return _templateOb

1ject3=function(){return e},e}function _templateObject4(){let e=(0,c._)(["\n  position: absolute;\n  inset: 0;\n  background: ",";\n"]);return _templateObject4=function(){return e},e}function _templateObject5(){let e=(0,c._)(["\n  position: absolute;\n  inset: 0;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  padding: 0 ","px;\n  gap: ","px;\n"]);return _templateObject5=function(){return e},e}function _templateObject6(){let e=(0,c._)(['\n  font-family: "PixelGridM", monospace;\n  font-size: ',"px;\n  color: ",";\n  font-weight: 700;\n  letter-spacing: 7.68px;\n  line-height: normal;\n"]);return _templateObject6=function(){return e},e}function _templateObject7(){let e=(0,c._)(['\n  font-family: "PixelGridM", monospace;\n  font-size: ',"px;\n  color: ",";\n  text-shadow: ",";\n  letter-spacing: 2.4px;\n  line-height: 1.25;\n  margin: 0;\n  font-weight: 700;\n  overflow-wrap: anywhere;\n"]);return _templateObject7=function(){return e},e}let f="linear-gradient(270deg, rgba(2, 7, 32, 0) 0%, rgba(2, 7, 32, 0.6) 65.75%)",h=l.default.div.withConfig({componentId:"sc-6d09234d-0"})(_templateObject(),1200,630),p=l.default.div.withConfig({componentId:"sc-6d09234d-1"})(_templateObject1(),e=>{let{bannerImageLink:t,bannerFit:n}=e;return"".concat(f,", url(").concat(t,") #1f1f1f 50% / ").concat(n," no-repeat")}),m=l.default.div.withConfig({componentId:"sc-6d09234d-2"})(_templateObject2(),e=>{let{layer:t}=e;return t.backgroundcolor},e=>{let{layer:t}=e;return"url(".concat(t.background,")")},e=>{let{layer:t}=e;return"".concat(t.backgroundOffSet,"px")}),g=l.default.div.withConfig({componentId:"sc-6d09234d-3"})(_templateObject3()),_=l.default.div.withConfig({componentId:"sc-6d09234d-4"})(_templateObject4(),f),S=l.default.div.withConfig({componentId:"sc-6d09234d-5"})(_templateObject5(),80,16),v=l.default.span.withConfig({componentId:"sc-6d09234d-6"})(_templateObject6(),32,"#FDE047"),b=l.default.h1.withConfig({componentId:"sc-6d09234d-7"})(_templateObject7(),80,"#FFFFFF","8px 8px 0px rgba(2, 6, 23, 0.8)");var og_preview_OgPreviewCard=function(e){let{slug:t,catalogName:n,bannerImageLink:i,bannerFit:o="cover"}=e,s=(0,d.jZ)(t)?d.YJ[t]:null;return(0,u.useEffect)(()=>{let e=s?[s.background,s.foreground]:[i];Promise.all([document.fonts.ready,Promise.all(e.map(e=>new Promise(t=>{let n=new Image;n.onload=()=>t(),n.onerror=()=>t(),n.src=e}))).then(()=>void 0)]).then(()=>{requestAnimationFrame(()=>{document.documentElement.dataset.ogReady="true"})})},[i,s]),(0,r.jsxs)(h,{"data-slug":t,children:[s?(0,r.jsxs)(r.Fragment,{children:[(0,r.jsx)(m,{layer:s}),(0,r.jsx)(g,{style:{backgroundImage:"url(".concat(s.foreground,")")}}),(0,r.jsx)(_,{})]}):(0,r.jsx)(p,{bannerImageLink:i,bannerFit:o}),(0,r.jsxs)(S,{children:[(0,r.jsx)(v,{children:"LEARN"}),(0,r.jsx)(b,{children:n})]}),(0,r.jsx)("span",{"aria-hidden":"true",style:{position:"absolute",opacity:0,fontFamily:"PixelGridM"},children:"."})]})},y=!0,_slug_=function(e){let{slug:t,catalogName:n,bannerImageLink:i,bannerFit:s}=e;return(0,r.jsxs)(r.Fragment,{children:[(0,r.jsxs)(a(),{children:[(0,r.jsx)("title",{className:o().dynamic([["85e252e9f2f4c18f",[1200,630]]]),children:"OG Preview: ".concat(n)}),(0,r.jsx)("meta",{name:"robots",content:"noindex,nofollow",className:o().dynamic([["85e252e9f2f4c18f",[1200,630]]])}),(0,r.jsx)("meta",{name:"viewport",content:"width=".concat(1200),className:o().dynamic([["85e252e9f2f4c18f",[1200,630]]])})]}),(0,r.jsx)(o(),{id:"85e252e9f2f4c18f",dynamic:[1200,630],children:"html,body{margin:0;padding:0;background:#020617;overflow:hidden}#__next{width:".concat(1200,"px;height:").concat(630,"px}")}),(0,r.jsx)(og_preview_OgPreviewCard,{slug:t,catalogName:n,bannerImageLink:i,bannerFit:s})]})}},91479:function(){}},function(e){e.O(0,[9774,2888,179],function(){return e(e.s=91392)}),_N_E=e.O()}]);