{"version":3,"file":"static/js/934.e341f7fe.chunk.js","mappings":"oMAKA,IAAIA,EAA2B,EAC/B,MAAMC,EAAgBC,IACpB,MAEMC,EAASA,KAFK,IAGdH,GACFA,IAEEA,GANc,GAOhBE,GACF,EAGF,OACEE,EAAAA,EAAAA,KAACC,EAAAA,GAAI,CAACC,UAAU,QAAQC,UAAU,OAAOC,aAAW,EAACC,SAAU,GAAIC,UACjEC,EAAAA,EAAAA,MAAA,OAAKL,UAAU,OAAMI,SAAA,EACnBC,EAAAA,EAAAA,MAAA,OAAKL,UAAU,wCAAuCI,SAAA,EACpDC,EAAAA,EAAAA,MAAA,OAAKL,UAAU,SAAQI,SAAA,EACrBC,EAAAA,EAAAA,MAAA,OAAKL,UAAU,OAAMI,SAAA,EACnBN,EAAAA,EAAAA,KAAA,MAAIE,UAAU,iCAAgCI,SAAC,kBAC/CN,EAAAA,EAAAA,KAAA,KAAGE,UAAU,gBAAeI,SAAE,qGAEhCC,EAAAA,EAAAA,MAAA,OAAKL,UAAU,iDAAgDI,SAAA,EAC7DN,EAAAA,EAAAA,KAAA,OAAAM,UACEN,EAAAA,EAAAA,KAAA,OAAKE,UAAU,kEAAkEM,IAAI,8BAA8BC,IAAI,aAAaV,OAAQA,OAE9IC,EAAAA,EAAAA,KAAA,OAAAM,UACEN,EAAAA,EAAAA,KAAA,OAAKE,UAAU,oEAAoEM,IAAI,8BAA8BC,IAAI,aAAaV,OAAQA,aAIpJC,EAAAA,EAAAA,KAAA,OAAKE,UAAU,qCAAqCM,IAAI,4CAA4CC,IAAI,kBAAkBV,OAAQA,QAEpIC,EAAAA,EAAAA,KAAA,KAAGE,UAAU,WAAUI,SAAE,kHACzBN,EAAAA,EAAAA,KAAA,KAAGE,UAAU,aAAYI,SAAE,uFAExB,EAiBLI,EAAgBZ,IAElBE,EAAAA,EAAAA,KAACC,EAAAA,GAAI,CAACE,UAAU,OAAOC,aAAW,EAACC,SAAU,GAAIC,UAC/CC,EAAAA,EAAAA,MAAA,OAAKL,UAAU,+DAA8DI,SAAA,EAC3EN,EAAAA,EAAAA,KAAA,OAAKE,UAAU,eAAcI,UAC3BN,EAAAA,EAAAA,KAAA,OAAKE,UAAU,0EAA0EM,IAAI,4CAA4CC,IAAI,mBAAmBV,OAAQD,OAE1KS,EAAAA,EAAAA,MAAA,OAAKL,UAAU,qFAAoFI,SAAA,EACjGN,EAAAA,EAAAA,KAAA,OAAKE,UAAU,8DACfF,EAAAA,EAAAA,KAAA,OAAKE,UAAU,WAAUI,UACvBN,EAAAA,EAAAA,KAAA,KAAGE,UAAU,MAAKI,SAAE,wEAGxBN,EAAAA,EAAAA,KAAA,OAAKE,UAAU,8HAA6HI,SAAC,wBAMrJ,IAAIK,EAA4B,EAChC,MAAMC,EAAiBd,IACrB,MAEMC,EAASA,KAFK,IAGdY,GACFA,IAJgB,IAMdA,GACFb,GACF,EAGF,OACES,EAAAA,EAAAA,MAACN,EAAAA,GAAI,CAACE,UAAU,OAAOC,aAAW,EAACC,SAAU,GAAIC,SAAA,EAE/CC,EAAAA,EAAAA,MAAA,OAAKL,UAAU,kBAAiBI,SAAA,EAC9BC,EAAAA,EAAAA,MAAA,OAAKL,UAAU,aAAYI,SAAA,EACzBN,EAAAA,EAAAA,KAAA,OAAKE,UAAU,gCAAgCM,IAAI,0BAA0BC,IAAI,UAAUV,OAAQA,KACnGC,EAAAA,EAAAA,KAAA,OAAKE,UAAU,oCAAoCM,IAAI,oCAAoCC,IAAI,oBAAoBV,OAAQA,QAE7HQ,EAAAA,EAAAA,MAAA,OAAKL,UAAU,8BAA6BI,SAAA,EAC1CN,EAAAA,EAAAA,KAAA,KAAGE,UAAU,iCAAgCI,SAAE,wGAC/CN,EAAAA,EAAAA,KAAA,OAAKE,UAAU,8BAA8BM,IAAI,0BAA0BC,IAAI,UAAUV,OAAQA,WAIrGQ,EAAAA,EAAAA,MAAA,OAAKL,UAAU,mEAAkEI,SAAA,EAC/EN,EAAAA,EAAAA,KAAA,OAAKE,UAAU,uCAAuCM,IAAI,oCAAoCC,IAAI,oBAAoBV,OAAQA,KAC9HQ,EAAAA,EAAAA,MAAA,OAAKL,UAAU,uCAAsCI,SAAA,EACnDN,EAAAA,EAAAA,KAAA,OAAAM,UACEN,EAAAA,EAAAA,KAAA,OAAKE,UAAU,uDAAuDM,IAAI,0BAA0BC,IAAI,UAAUV,OAAQA,OAE5HC,EAAAA,EAAAA,KAAA,OAAAM,UACEN,EAAAA,EAAAA,KAAA,OAAKE,UAAU,oDAAoDM,IAAI,0BAA0BC,IAAI,UAAUV,OAAQA,UAG3HC,EAAAA,EAAAA,KAAA,KAAGE,UAAU,+CAA8CI,SAAE,4GAE1D,EAqCX,EAjCoBO,KAElB,MACQC,EAAgBC,IAAsBC,EAAAA,EAAAA,UAAiB,GAEzDjB,EAASA,KACbgB,GAAkBE,IAChB,IAAIC,EAAQD,EAAS,EAKrB,OAJIC,EANc,IAOhBA,EAPgB,GAUXA,CAAK,GACZ,EAGJ,OACEX,EAAAA,EAAAA,MAAAY,EAAAA,SAAA,CAAAb,SAAA,CAfoB,IAgBhBQ,IAAoCd,EAAAA,EAAAA,KAACoB,EAAAA,EAAgB,KACvDpB,EAAAA,EAAAA,KAAA,OAAAM,UACEN,EAAAA,EAAAA,KAAA,OAAKE,UAAS,wCAAAmB,OAlBE,IAkBwCP,EAAmC,SAAW,IAAKR,UACzGC,EAAAA,EAAAA,MAAA,OAAKL,UAAU,6EAA4EI,SAAA,CACvFT,EAAaE,IAjGJD,EAkGKC,GAhGxBC,EAAAA,EAAAA,KAACC,EAAAA,GAAI,CAACE,UAAU,OAAOC,aAAW,EAACC,SAAU,GAAIC,UAC/CN,EAAAA,EAAAA,KAAA,OAAKE,UAAU,OAAMI,UACnBC,EAAAA,EAAAA,MAAA,OAAKL,UAAU,gBAAeI,SAAA,EAC5BN,EAAAA,EAAAA,KAAA,OAAKE,UAAU,yCAAyCM,IAAI,oCAAoCC,IAAI,YAAYV,OAAQD,KACxHS,EAAAA,EAAAA,MAAA,KAAGL,UAAU,gBAAeI,SAAA,CAAE,gCAAgCN,EAAAA,EAAAA,KAAA,QAAME,UAAU,YAAWI,SAAC,eAAkB,2CA6FxGI,EAAaX,GACba,EAAcb,aApGLD,KAwGhB,C","sources":["view/ContentTips.tsx"],"sourcesContent":["import React, { useState } from 'react'\nimport { Fade } from 'react-awesome-reveal'\n\nimport { LoadingIndicator } from '../component/LoadingIndicator'\n\nlet firstSectionLoadedImages = 0\nconst firstSection = (onLoaded: () => void): JSX.Element => {\n const imageAmount = 3\n\n const onLoad = () => {\n if (firstSectionLoadedImages !== imageAmount) {\n firstSectionLoadedImages++\n }\n if (firstSectionLoadedImages >= imageAmount) {\n onLoaded()\n }\n }\n\n return (\n <Fade className='py-12' direction='down' triggerOnce fraction={0.5}>\n <div className='mx-5'>\n <div className='flex justify-center items-center py-5'>\n <div className='w-full'>\n <div className='py-5'>\n <h3 className='uppercase text-3xl lg:text-4xl'>Content Tips</h3>\n <p className='mb-5 max-w-96'>{'Ready to share your newest fit with the world? Here\\'s how to leave your audience starstruck!'}</p>\n </div>\n <div className='flex flex-row-reverse justify-center px-9 pb-9'>\n <div>\n <img className='shadow-xl max-w-[12vh] rotate-6 md:max-w-[18vh] lg:max-w-[20vh]' src='ContentTips/instagram2.webp' alt='instagram2' onLoad={onLoad}/>\n </div>\n <div>\n <img className='shadow-xl max-w-[18vh] md:max-w-[23vh] lg:max-w-[25vh] -rotate-12' src='ContentTips/instagram1.webp' alt='instagram1' onLoad={onLoad}/>\n </div>\n </div>\n </div>\n <img className='max-w-[40vh] pl-12 hidden xl:block' src='ContentTips/contenttips_girl1_stroke.webp' alt='contentTipsGirl' onLoad={onLoad} />\n </div>\n <p className='max-w-96'>{'Take advantage of the photo area in Oasis Lobby. It\\'s redecorated for every event to get the perfect selfie!'}</p>\n <p className='my-3 pl-12'>{'Use #hotelhideaway to get your post featured on our official Instagram account'}</p>\n </div>\n </Fade>\n )\n}\n\nconst secondSection = (onLoaded: () => void): JSX.Element => {\n return (\n <Fade direction='down' triggerOnce fraction={0.5}>\n <div className='mx-5'>\n <div className='w-fit ml-auto'>\n <img className='max-w-[90%] lg:max-w-[60vh] rounded-lg' src='ContentTips/photomode_2_16x9.webp' alt='photomode' onLoad={onLoaded}/>\n <p className='max-w-96 py-5'>{'Always use Hotel Hideaway\\'s '}<span className='underline'>photo mode</span>{' to take pictures and videos.'}</p>\n </div>\n </div>\n </Fade>\n )\n}\n\nconst thirdSection = (onLoaded: () => void): JSX.Element => {\n return (\n <Fade direction='down' triggerOnce fraction={0.5}>\n <div className='w-full ml-auto relative text-secondary-content mt-12 lg:mt-0'>\n <div className='gradient-img'>\n <img className='max-w-[30vh] mx-auto md:max-w-[40vh] lg:max-w-[55vh] lg:ml-auto lg:mx-0' src='ContentTips/contenttips_girl2_stroke.webp' alt='contentTipsGirl2' onLoad={onLoaded}/>\n </div>\n <div className='absolute top-[90%] left-[10%] w-72 h-72 lg:w-96 lg:h-96 xl:top-[20%] xl:left-[20%]'>\n <div className='h-1/4 absolute bg-lavender blur-2xl -top-3 left-0 w-full'></div>\n <div className='absolute'>\n <p className='p-3'>{'Find your signature poses! Don\\'t be afraid to get a close up!'}</p>\n </div>\n </div>\n <div className='absolute text-secondary-content/50 -rotate-12 text-3xl md:text-5xl -top-[10%] left-[5%] md:top-0 xl:top-[50%] xl:left-[15%]'>#Hotelhideaway</div>\n </div>\n </Fade>\n )\n}\n\nlet fourthSectionLoadedImages = 0\nconst fourthSection = (onLoaded: () => void): JSX.Element => {\n const imageAmount = 3\n\n const onLoad = () => {\n if (fourthSectionLoadedImages !== imageAmount) {\n fourthSectionLoadedImages++\n }\n if (fourthSectionLoadedImages === imageAmount) {\n onLoaded()\n }\n }\n\n return (\n <Fade direction='down' triggerOnce fraction={0.5}>\n {/* Desktop version */}\n <div className='hidden lg:block'>\n <div className='flex my-24'>\n <img className='max-w-[25vh] h-fit -rotate-12' src='ContentTips/Myroom2.png' alt='myRoom2' onLoad={onLoad} />\n <img className='max-w-[30vh] h-fit rotate-6 ml-24' src='ContentTips/reciptonist-heart.png' alt='reciptonist-heart' onLoad={onLoad} />\n </div>\n <div className='text-secondary-content flex'>\n <p className='p-3 max-w-96 align-self-center'>{'Build your own themed rooms and take some wide shots as well as close ups to show off the details!'}</p>\n <img className='max-w-[30vh] h-fit rotate-6' src='ContentTips/Myroom1.png' alt='myRoom1' onLoad={onLoad}/>\n </div>\n </div>\n {/* Mobile version */}\n <div className='mt-10 mx-5 text-secondary-content text-sm md:text-base lg:hidden'>\n <img className='max-w-[20vh] md:max-w-[25vh] ml-auto' src='ContentTips/reciptonist-heart.png' alt='reciptonist-heart' onLoad={onLoad} />\n <div className='flex flex-row-reverse justify-center'>\n <div>\n <img className='max-w-[15vh] md:max-w-[20vh] shadow-xl rotate-6 my-8' src='ContentTips/Myroom1.png' alt='myRoom1' onLoad={onLoad}/>\n </div>\n <div>\n <img className='max-w-[18vh] md:max-w-[25vh] shadow-xl -rotate-12' src='ContentTips/Myroom2.png' alt='myRoom2' onLoad={onLoad} />\n </div>\n </div>\n <p className='p-3 mt-0 md:mt-10 max-w-96 align-self-center'>{'Build your own themed rooms and take some wide shots as well as close ups to show off the details!'}</p>\n </div>\n </Fade>\n )\n}\n\nconst ContentTips = () => {\n\n const sectionAmount = 4\n const [ loadedSections, setLoadedSections ] = useState<number>(0)\n\n const onLoad = () => {\n setLoadedSections(loaded => {\n let value = loaded + 1\n if (value > sectionAmount) {\n value = sectionAmount\n }\n\n return value\n })\n }\n\n return (\n <>\n { loadedSections !== sectionAmount && <LoadingIndicator /> }\n <div >\n <div className={`w-full font-bold font-header text-lg ${loadedSections !== sectionAmount ? 'hidden' : ''}`}>\n <div className='max-w-fit mx-auto text-center text-sm md:text-left md:text-base lg:text-lg'>\n { firstSection(onLoad) }\n { secondSection(onLoad) }\n { thirdSection(onLoad) }\n { fourthSection(onLoad) }\n </div>\n </div>\n </div>\n </>\n )\n}\n\nexport default ContentTips\n"],"names":["firstSectionLoadedImages","firstSection","onLoaded","onLoad","_jsx","Fade","className","direction","triggerOnce","fraction","children","_jsxs","src","alt","thirdSection","fourthSectionLoadedImages","fourthSection","ContentTips","loadedSections","setLoadedSections","useState","loaded","value","_Fragment","LoadingIndicator","concat"],"sourceRoot":""}