https://twicpics-next-demo.netlify.app/_next/static/chunks/67a895005826f59a.js

1(globalThis.TURBOPACK||(globalThis.TURBOPACK=[])).push(["object"==typeof document?document.currentScript:void 0,6545,e=>{e.v({"twic-abstract":"index-module-scss-module__jFUJqq__twic-abstract"})},64592,e=>{"use strict";var i=e.i(91398);e.i(91788);var s=e.i(6545);e.s(["TwicAbstract",0,({title:e,children:t})=>(0,i.jsxs)("div",{className:s.default["twic-abstract"],children:[(0,i.jsx)("h1",{children:e}),(0,i.jsx)("div",{children:t})]})])},12270,e=>{e.v({"twic-code":"index-module-scss-module__E8tk6G__twic-code"})},51133,e=>{"use strict";var i=e.i(91398),s=e.i(12270);e.s(["Code",0,({children:e})=>(0,i.jsx)(i.Fragment,{children:(0,i.jsx)("span",{className:s.default["twic-code"],children:e})})])},13584,(e,i,s)=>{"use strict";Object.defineProperty(s,"__esModule",{value:!0}),Object.defineProperty(s,"HeadManagerContext",{enumerable:!0,get:function(){return t}});let t=e.r(41705)._(e.r(91788)).default.createContext({})},94470,(e,i,s)=>{"use strict";Object.defineProperty(s,"__esModule",{value:!0}),Object.defineProperty(s,"warnOnce",{enumerable:!0,get:function(){return t}});let t=e=>{}},17884,e=>{e.v({})},2683,e=>{"use strict";var i=e.i(91398);e.i(91788);var s=e.i(51133),t=e.i(64592),c=e.i(31702),a=e.i(40413),r=e.i(17884);e.s(["default",0,()=>(0,i.jsx)("div",{id:r.default["twic-basic-grid-container"],children:(0,i.jsxs)(c.TwicWrapper,{filename:"pages/basic-grid/index.jsx",children:[(0,i.jsxs)(t.TwicAbstract,{title:"A basic example",children:[(0,i.jsx)("p",{children:"TwicPics is a Responsive Image Service Solution (SaaS) that enables on-demand responsive image generation."}),(0,i.jsx)("p",{children:"TwicPics Components make it dead easy to unleash the power of TwicPics."}),"Here the properties used in this example:",(0,i.jsxs)("ul",{children:[(0,i.jsxs)("li",{children:[(0,i.jsx)(s.Code,{children:"ratio"}),":",(0,i.jsx)("span",{children:"  determines the value of the width/height ratio of the image display area."})]}),(0,i.jsxs)("li",{children:[(0,i.jsx)(s.Code,{children:"mode"}),":",(0,i.jsx)("span",{children:"determines if the image fills or sits inside the area."})]}),(0,i.jsxs)("li",{children:[(0,i.jsx)(s.Code,{children:"focus"}),":",(0,i.jsx)("span",{children:"changes the focus point coordinates of the image."})]}),(0,i.jsxs)("li",{children:[(0,i.jsx)(s.Code,{children:"placeholder"}),":",(0,i.jsx)("span",{children:"helps optimize your CLS and implement the LQIP technique."})]})]})]}),(0,i.jsxs)("div",{className:"twic-grid",children:[(0,i.jsxs)("div",{className:"twic-item",children:[(0,i.jsx)(a.TwicImg,{src:"https://assets.twicpics.com/examples/football.jpg"}),(0,i.jsx)("span",{children:" Default values "})]}),(0,i.jsxs)("div",{className:"twic-item",children:[(0,i.jsx)(a.TwicImg,{src:"/football.jpg",ratio:"16/9",mode:"cover",placeholder:"meancolor"}),(0,i.jsxs)("span",{children:[(0,i.jsx)(s.Code,{children:'ratio="16/9"'}),"&",(0,i.jsx)(s.Code,{children:'mode="cover"'}),": the image fills the area"]})]}),(0,i.jsxs)("div",{className:"twic-item",children:[(0,i.jsx)(a.TwicImg,{src:"/football.jpg",step:"100",mode:"contain",ratio:"16/9"}),(0,i.jsxs)("span",{children:[(0,i.jsx)(s.Code,{children:'ratio="16/9"'}),"&",(0,i.jsx)(s.Code,{children:'mode="contain"'}),": the image sits inside the area"]})]}),(0,i.jsxs)("div",{className:"twic-item",children:[(0,i.jsx)(a.TwicImg,{src:"/football.jpg",step:"100",focus:"auto",ratio:"2/3",mode:"contain",placeholder:"maincolor"}),(0,i.jsxs)("span",{children:[(0,i.jsx)(s.Code,{children:'ratio="2/3"'}),",",(0,i.jsx)(s.Code,{children:'mode="contain"'}),"&",(0,i.jsx)(s.Code,{children:'focus="auto"'})]})]})]})]})})])},77238,(e,i,s)=>{let t="/basic-grid";(window.__NEXT_P=window.__NEXT_P||[]).push([t,()=>e.r(2683)]),i.hot&&i.hot.dispose(function(){window.__NEXT_P.push([t])})},48761,e=>{e.v(i=>Promise.all(["static/chunks/fd7c0943d5cd5e09.js"].map(i=>e.l(i))).then(()=>i(93594)))},28805,e=>{e.v(i=>Promise.all(["static/chunks/3dcc93bb4829c1ba.js"].map(i=>e.l(i))).then(()=>i(79466)))}]);