Open Source
Preline Pro
Sign in
Get all access
Home
Examples
Templates
Pricing
Docs
Preline UI (Open Source)
Back to Examples
All examples
Custom Date & Time Modals
Custom Date & Time description goes here.
Custom Recurrence Event
Preview
Get the code
Existing accounts: Sign in to your account to access the source code.
<!DOCTYPE html> <html lang="en" dir="" class="relative h3sa8 du2fm"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <title>Preline UI</title> <link rel="shortcut icon" href="../../favicon.ico"> <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet"> <link rel="stylesheet" href="../../assets/css/obfuscated.min.css"> </head> <body> <div class="v3c69 iieae"> <button type="button" class="rsqxb cc1ly rl1tg a459h items-center klk5r gxh7t i7kxu qm5z2 uzll2 txh0b a3wk8 zd5ha zb2tq fwpr6 oewy0 tkmp4 t4rxa vxls2 dark:bg-white dark:text-neutral-800 dark:hover:bg-neutral-200 dark:focus:bg-neutral-200" aria-haspopup="dialog" aria-expanded="false" aria-controls="hs-pro-clcre" data-hs-overlay="#hs-pro-clcre"> Open </button> </div><!-- Custom Recurrence Modal --> <div id="hs-pro-clcre" class="hs-overlay hidden p8r3t fixed vemhv vvp3o e7f40 mjyak a17xw [--close-when-click-inside:true] xg820" role="dialog" tabindex="-1" aria-labelledby="hs-pro-clcre-label"> <div class="hs-overlay-open:mt-7 hs-overlay-open:opacity-100 hs-overlay-open:duration-500 cu00e opacity-0 atv3v gyfl6 z434w jpgrs a2vl5 w43l1 h-[calc(100%-3.5rem)] min-h-[calc(100%-3.5rem)] flex items-center"> <div class="w-full j9aoa flex ao3ns nz7b4 u33oi apxxd shadow-[0_10px_40px_10px_rgba(0,0,0,0.08)] dark:shadow-[0_10px_40px_10px_rgba(0,0,0,0.2)] dark:bg-neutral-800"> <!-- Header --> <div class="xwz3o x7giz flex fa4f9 items-center bm6ej dark:border-neutral-700"> <h3 id="hs-pro-clcre-label" class="zd5ha t4wtn dark:text-neutral-200"> Custom recurrence </h3> <button type="button" class="j1mw5 rl1tg a459h items-center klk5r icuyk qm5z2 ftfcy o7p0z t4wtn nwqzd iec4s haq8z t4rxa b3tqx dark:bg-neutral-700 dark:hover:bg-neutral-600 dark:text-neutral-400 dark:focus:bg-neutral-600" aria-label="Close" data-hs-overlay="#hs-pro-clcre"> <span class="tuthn">Close</span> <svg class="xqknn d681g" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M18 6 6 18"/><path d="m6 6 12 12"/></svg> </button> </div> <!-- End Header --> <!-- Body --> <div id="hs-modal-custom-recurrence-event" class="a17xw sh48p ygi9h wv8uu wt1jo dark:[&::-webkit-scrollbar-track]:bg-neutral-700 dark:[&::-webkit-scrollbar-thumb]:bg-neutral-500"> <div class="cz83v hti62"> <div class="o4dae tc243"> <!-- Item --> <div> <label for="hs-pro-ccremre" class="l1oxk block j7yil w8otv dark:text-neutral-500"> Repeat every: </label> <div class="flex items-center klk5r"> <input id="hs-pro-ccremre" type="text" class="p65gp vo9dv block a0xhh o7p0z ftfcy m6q9e j7yil xkisd awvey nwqzd b50zm iec4s haq8z b3tqx owwub mwsh2 dark:text-neutral-400 dark:bg-neutral-700 dark:text-neutral-300 dark:placeholder:text-neutral-500 dark:hover:bg-neutral-600 dark:focus:bg-neutral-600" value="1"> <!-- Select --> <div class="relative w-full"> <select data-hs-select='{ "placeholder": "Start time", "toggleTag": "<button type=\"button\" aria-expanded=\"false\"></button>", "toggleClasses": "hs-select-disabled:pointer-events-none hs-select-disabled:opacity-50 relative p65gp ndt14 rf13h w-full flex klk5r j5skf xkisd cursor-pointer o7p0z qm5z2 ftfcy m6q9e gxh7t j7yil nwqzd hover:focus:border-transparent t4rxa b3tqx dark:bg-neutral-700 dark:text-neutral-400 dark:focus:outline-none dark:hover:bg-neutral-600 dark:focus:bg-neutral-600", "dropdownClasses": "vvl4w w4j19 w-full ux2rd aqh96 shme7 wcomx a17xw nz7b4 u33oi shadow-[0_10px_40px_10px_rgba(0,0,0,0.08)] sh48p ygi9h wv8uu wt1jo dark:[&::-webkit-scrollbar-track]:bg-neutral-700 dark:[&::-webkit-scrollbar-thumb]:bg-neutral-500 dark:bg-neutral-900", "optionClasses": "hs-selected:bg-gray-100 dark:hs-selected:bg-neutral-800 eek80 cc1ly w-full j7yil t4wtn cursor-pointer x8k6f m6q9e t4rxa c2pts dark:text-neutral-300 dark:hover:bg-neutral-800 dark:focus:bg-neutral-800", "optionTemplate": "<div class=\"flex fa4f9 items-center w-full \"><span data-title></span><span class=\"hidden hs-selected:block \"><svg class=\"xqknn ccfki t4wtn dark:text-neutral-200 \" xmlns=\"http:.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><polyline points=\"20 6 9 17 4 12\"/></svg></span></div>", "viewport": "#hs-modal-custom-recurrence-event" }' class="hidden"> <option value="">Choose</option> <option>Daily</option> <option selected>Weekly</option> <option>Monthly</option> <option>Yearly</option> </select> <div class="absolute c30g1 msngy -translate-y-1/2"> <svg class="xqknn ccfki w8otv dark:text-neutral-500" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m6 9 6 6 6-6"/></svg> </div> </div> <!-- End Select --> </div> </div> <!-- End Item --> <!-- Item --> <div> <label class="l1oxk block j7yil w8otv dark:text-neutral-500"> Repeats on: </label> <div class="flex qeb80 items-center o9jhx"> <!-- Checkbox --> <label for="hs-pro-clcreromo" class="group spfwn flex a459h items-center m6q9e cursor-pointer j7yil t4wtn o7p0z nwqzd b3tqx has-[:checked]:bg-blue-600 has-[:checked]:text-white dark:text-neutral-300 dark:bg-neutral-700 dark:hover:bg-neutral-600 dark:focus:bg-neutral-600 dark:has-[:checked]:bg-blue-500 dark:has-[:checked]:text-white"> <input type="radio" class="hidden" id="hs-pro-clcreromo" name="hs-pro-cremd" checked> Mo </label> <!-- End Checkbox --> <!-- Checkbox --> <label for="hs-pro-clcrerotu" class="group spfwn flex a459h items-center m6q9e cursor-pointer j7yil t4wtn o7p0z nwqzd b3tqx has-[:checked]:bg-blue-600 has-[:checked]:text-white dark:text-neutral-300 dark:bg-neutral-700 dark:hover:bg-neutral-600 dark:focus:bg-neutral-600 dark:has-[:checked]:bg-blue-500 dark:has-[:checked]:text-white"> <input type="radio" class="hidden" id="hs-pro-clcrerotu" name="hs-pro-cremd"> Tu </label> <!-- End Checkbox --> <!-- Checkbox --> <label for="hs-pro-clcrerowe" class="group spfwn flex a459h items-center m6q9e cursor-pointer j7yil t4wtn o7p0z nwqzd b3tqx has-[:checked]:bg-blue-600 has-[:checked]:text-white dark:text-neutral-300 dark:bg-neutral-700 dark:hover:bg-neutral-600 dark:focus:bg-neutral-600 dark:has-[:checked]:bg-blue-500 dark:has-[:checked]:text-white"> <input type="radio" class="hidden" id="hs-pro-clcrerowe" name="hs-pro-cremd"> We </label> <!-- End Checkbox --> <!-- Checkbox --> <label for="hs-pro-clcreroth" class="group spfwn flex a459h items-center m6q9e cursor-pointer j7yil t4wtn o7p0z nwqzd b3tqx has-[:checked]:bg-blue-600 has-[:checked]:text-white dark:text-neutral-300 dark:bg-neutral-700 dark:hover:bg-neutral-600 dark:focus:bg-neutral-600 dark:has-[:checked]:bg-blue-500 dark:has-[:checked]:text-white"> <input type="radio" class="hidden" id="hs-pro-clcreroth" name="hs-pro-cremd"> Th </label> <!-- End Checkbox --> <!-- Checkbox --> <label for="hs-pro-clcrerofr" class="group spfwn flex a459h items-center m6q9e cursor-pointer j7yil t4wtn o7p0z nwqzd b3tqx has-[:checked]:bg-blue-600 has-[:checked]:text-white dark:text-neutral-300 dark:bg-neutral-700 dark:hover:bg-neutral-600 dark:focus:bg-neutral-600 dark:has-[:checked]:bg-blue-500 dark:has-[:checked]:text-white"> <input type="radio" class="hidden" id="hs-pro-clcrerofr" name="hs-pro-cremd"> Fr </label> <!-- End Checkbox --> <!-- Checkbox --> <label for="hs-pro-clcrerosa" class="group spfwn flex a459h items-center m6q9e cursor-pointer j7yil t4wtn o7p0z nwqzd b3tqx has-[:checked]:bg-blue-600 has-[:checked]:text-white dark:text-neutral-300 dark:bg-neutral-700 dark:hover:bg-neutral-600 dark:focus:bg-neutral-600 dark:has-[:checked]:bg-blue-500 dark:has-[:checked]:text-white"> <input type="radio" class="hidden" id="hs-pro-clcrerosa" name="hs-pro-cremd"> Sa </label> <!-- End Checkbox --> <!-- Checkbox --> <label for="hs-pro-clcrerosu" class="group spfwn flex a459h items-center m6q9e cursor-pointer j7yil t4wtn o7p0z nwqzd b3tqx has-[:checked]:bg-blue-600 has-[:checked]:text-white dark:text-neutral-300 dark:bg-neutral-700 dark:hover:bg-neutral-600 dark:focus:bg-neutral-600 dark:has-[:checked]:bg-blue-500 dark:has-[:checked]:text-white"> <input type="radio" class="hidden" id="hs-pro-clcrerosu" name="hs-pro-cremd"> Su </label> <!-- End Checkbox --> </div> </div> <!-- End Item --> <!-- Item --> <div> <label class="l1oxk block j7yil w8otv dark:text-neutral-500"> Ends: </label> <!-- Radio --> <div class="flex"> <input type="radio" name="hs-pro-clcree" class="xqknn khwhk icuyk tiwe1 y7tt1 vmau0 iec4s haq8z dark:bg-neutral-800 dark:border-neutral-700 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-neutral-800" id="hs-pro-clcreen" checked> <label for="hs-pro-clcreen" class="egssd kugle lpi99 dark:text-neutral-400">Never</label> </div> <!-- End Radio --> <div class="lf406 flex items-center klk5r"> <!-- Radio --> <div class="od2ao flex"> <input type="radio" name="hs-pro-clcree" class="xqknn khwhk icuyk tiwe1 y7tt1 vmau0 iec4s haq8z dark:bg-neutral-800 dark:border-neutral-700 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-neutral-800" id="hs-pro-clcreeo"> <label for="hs-pro-clcreeo" class="egssd kugle lpi99 dark:text-neutral-400">On</label> </div> <!-- End Radio --> <div class="w-full"> <!-- Input --> <input type="text" class="eek80 vo9dv block w-full o7p0z ftfcy m6q9e j7yil xkisd awvey nwqzd b50zm iec4s haq8z b3tqx owwub mwsh2 dark:text-neutral-400 dark:bg-neutral-700 dark:text-neutral-300 dark:placeholder:text-neutral-500 dark:hover:bg-neutral-600 dark:focus:bg-neutral-600" value="Jan 7, 2024"> <!-- End Input --> </div> </div> <div class="zw3r6 flex items-center klk5r"> <!-- Radio --> <div class="od2ao flex"> <input type="radio" name="hs-pro-clcree" class="xqknn khwhk icuyk tiwe1 y7tt1 vmau0 iec4s haq8z dark:bg-neutral-800 dark:border-neutral-700 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-neutral-800" id="hs-pro-clcreea"> <label for="hs-pro-clcreea" class="egssd kugle lpi99 dark:text-neutral-400">After</label> </div> <!-- End Radio --> <div class="w-full flex items-center klk5r"> <!-- Input --> <input type="text" class="eek80 vo9dv block a0xhh o7p0z ftfcy m6q9e j7yil xkisd awvey nwqzd b50zm iec4s haq8z b3tqx owwub mwsh2 dark:text-neutral-400 dark:bg-neutral-700 dark:text-neutral-300 dark:placeholder:text-neutral-500 dark:hover:bg-neutral-600 dark:focus:bg-neutral-600" value="7"> <!-- End Input --> <span class="egssd w8otv dark:text-neutral-500">Times</span> </div> </div> </div> <!-- End Item --> </div> </div> </div> <!-- End Body --> <!-- Footer --> <div class="rsqxb x7giz jn9n3 khwhk dark:border-neutral-700"> <div class="z9yef flex f5dbk items-center sapo1"> <button type="button" class="rsqxb cc1ly j5skf rl1tg a459h items-center gxh7t nz7b4 qm5z2 khwhk t4wtn egssd zd5ha zb2tq fwpr6 oewy0 w8bqc iec4s haq8z dark:bg-neutral-800 dark:border-neutral-700 dark:text-neutral-300 dark:hover:bg-neutral-700 dark:focus:bg-neutral-700" data-hs-overlay="#hs-pro-clcre"> Cancel </button> <button type="button" class="rsqxb cc1ly j5skf rl1tg a459h items-center klk5r gxh7t ob5sd qm5z2 zranc txh0b egssd zd5ha zb2tq fwpr6 oewy0 hs3rw iec4s haq8z t4rxa mqwez zvcaz dark:focus:ring-blue-500" data-hs-overlay="#hs-pro-clcre"> Save </button> </div> </div> <!-- End Footer --> </div> </div> </div> <!-- End Custom Recurrence Modal --> <script src="../../assets/vendor/preline/dist/index.js?v=1.0.0"></script> </body> </html> <script src="../../scripts/js/open-modals-on-init.js"></script>
<!-- Custom Recurrence Modal --> <div id="hs-pro-clcre" class="hs-overlay hidden p8r3t fixed vemhv vvp3o e7f40 mjyak a17xw [--close-when-click-inside:true] xg820" role="dialog" tabindex="-1" aria-labelledby="hs-pro-clcre-label"> <div class="hs-overlay-open:mt-7 hs-overlay-open:opacity-100 hs-overlay-open:duration-500 cu00e opacity-0 atv3v gyfl6 z434w jpgrs a2vl5 w43l1 h-[calc(100%-3.5rem)] min-h-[calc(100%-3.5rem)] flex items-center"> <div class="w-full j9aoa flex ao3ns nz7b4 u33oi apxxd shadow-[0_10px_40px_10px_rgba(0,0,0,0.08)] dark:shadow-[0_10px_40px_10px_rgba(0,0,0,0.2)] dark:bg-neutral-800"> <!-- Header --> <div class="xwz3o x7giz flex fa4f9 items-center bm6ej dark:border-neutral-700"> <h3 id="hs-pro-clcre-label" class="zd5ha t4wtn dark:text-neutral-200"> Custom recurrence </h3> <button type="button" class="j1mw5 rl1tg a459h items-center klk5r icuyk qm5z2 ftfcy o7p0z t4wtn nwqzd iec4s haq8z t4rxa b3tqx dark:bg-neutral-700 dark:hover:bg-neutral-600 dark:text-neutral-400 dark:focus:bg-neutral-600" aria-label="Close" data-hs-overlay="#hs-pro-clcre"> <span class="tuthn">Close</span> <svg class="xqknn d681g" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M18 6 6 18"/><path d="m6 6 12 12"/></svg> </button> </div> <!-- End Header --> <!-- Body --> <div id="hs-modal-custom-recurrence-event" class="a17xw sh48p ygi9h wv8uu wt1jo dark:[&::-webkit-scrollbar-track]:bg-neutral-700 dark:[&::-webkit-scrollbar-thumb]:bg-neutral-500"> <div class="cz83v hti62"> <div class="o4dae tc243"> <!-- Item --> <div> <label for="hs-pro-ccremre" class="l1oxk block j7yil w8otv dark:text-neutral-500"> Repeat every: </label> <div class="flex items-center klk5r"> <input id="hs-pro-ccremre" type="text" class="p65gp vo9dv block a0xhh o7p0z ftfcy m6q9e j7yil xkisd awvey nwqzd b50zm iec4s haq8z b3tqx owwub mwsh2 dark:text-neutral-400 dark:bg-neutral-700 dark:text-neutral-300 dark:placeholder:text-neutral-500 dark:hover:bg-neutral-600 dark:focus:bg-neutral-600" value="1"> <!-- Select --> <div class="relative w-full"> <select data-hs-select='{ "placeholder": "Start time", "toggleTag": "<button type=\"button\" aria-expanded=\"false\"></button>", "toggleClasses": "hs-select-disabled:pointer-events-none hs-select-disabled:opacity-50 relative p65gp ndt14 rf13h w-full flex klk5r j5skf xkisd cursor-pointer o7p0z qm5z2 ftfcy m6q9e gxh7t j7yil nwqzd hover:focus:border-transparent t4rxa b3tqx dark:bg-neutral-700 dark:text-neutral-400 dark:focus:outline-none dark:hover:bg-neutral-600 dark:focus:bg-neutral-600", "dropdownClasses": "vvl4w w4j19 w-full ux2rd aqh96 shme7 wcomx a17xw nz7b4 u33oi shadow-[0_10px_40px_10px_rgba(0,0,0,0.08)] sh48p ygi9h wv8uu wt1jo dark:[&::-webkit-scrollbar-track]:bg-neutral-700 dark:[&::-webkit-scrollbar-thumb]:bg-neutral-500 dark:bg-neutral-900", "optionClasses": "hs-selected:bg-gray-100 dark:hs-selected:bg-neutral-800 eek80 cc1ly w-full j7yil t4wtn cursor-pointer x8k6f m6q9e t4rxa c2pts dark:text-neutral-300 dark:hover:bg-neutral-800 dark:focus:bg-neutral-800", "optionTemplate": "<div class=\"flex fa4f9 items-center w-full \"><span data-title></span><span class=\"hidden hs-selected:block \"><svg class=\"xqknn ccfki t4wtn dark:text-neutral-200 \" xmlns=\"http:.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><polyline points=\"20 6 9 17 4 12\"/></svg></span></div>", "viewport": "#hs-modal-custom-recurrence-event" }' class="hidden"> <option value="">Choose</option> <option>Daily</option> <option selected>Weekly</option> <option>Monthly</option> <option>Yearly</option> </select> <div class="absolute c30g1 msngy -translate-y-1/2"> <svg class="xqknn ccfki w8otv dark:text-neutral-500" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m6 9 6 6 6-6"/></svg> </div> </div> <!-- End Select --> </div> </div> <!-- End Item --> <!-- Item --> <div> <label class="l1oxk block j7yil w8otv dark:text-neutral-500"> Repeats on: </label> <div class="flex qeb80 items-center o9jhx"> <!-- Checkbox --> <label for="hs-pro-clcreromo" class="group spfwn flex a459h items-center m6q9e cursor-pointer j7yil t4wtn o7p0z nwqzd b3tqx has-[:checked]:bg-blue-600 has-[:checked]:text-white dark:text-neutral-300 dark:bg-neutral-700 dark:hover:bg-neutral-600 dark:focus:bg-neutral-600 dark:has-[:checked]:bg-blue-500 dark:has-[:checked]:text-white"> <input type="radio" class="hidden" id="hs-pro-clcreromo" name="hs-pro-cremd" checked> Mo </label> <!-- End Checkbox --> <!-- Checkbox --> <label for="hs-pro-clcrerotu" class="group spfwn flex a459h items-center m6q9e cursor-pointer j7yil t4wtn o7p0z nwqzd b3tqx has-[:checked]:bg-blue-600 has-[:checked]:text-white dark:text-neutral-300 dark:bg-neutral-700 dark:hover:bg-neutral-600 dark:focus:bg-neutral-600 dark:has-[:checked]:bg-blue-500 dark:has-[:checked]:text-white"> <input type="radio" class="hidden" id="hs-pro-clcrerotu" name="hs-pro-cremd"> Tu </label> <!-- End Checkbox --> <!-- Checkbox --> <label for="hs-pro-clcrerowe" class="group spfwn flex a459h items-center m6q9e cursor-pointer j7yil t4wtn o7p0z nwqzd b3tqx has-[:checked]:bg-blue-600 has-[:checked]:text-white dark:text-neutral-300 dark:bg-neutral-700 dark:hover:bg-neutral-600 dark:focus:bg-neutral-600 dark:has-[:checked]:bg-blue-500 dark:has-[:checked]:text-white"> <input type="radio" class="hidden" id="hs-pro-clcrerowe" name="hs-pro-cremd"> We </label> <!-- End Checkbox --> <!-- Checkbox --> <label for="hs-pro-clcreroth" class="group spfwn flex a459h items-center m6q9e cursor-pointer j7yil t4wtn o7p0z nwqzd b3tqx has-[:checked]:bg-blue-600 has-[:checked]:text-white dark:text-neutral-300 dark:bg-neutral-700 dark:hover:bg-neutral-600 dark:focus:bg-neutral-600 dark:has-[:checked]:bg-blue-500 dark:has-[:checked]:text-white"> <input type="radio" class="hidden" id="hs-pro-clcreroth" name="hs-pro-cremd"> Th </label> <!-- End Checkbox --> <!-- Checkbox --> <label for="hs-pro-clcrerofr" class="group spfwn flex a459h items-center m6q9e cursor-pointer j7yil t4wtn o7p0z nwqzd b3tqx has-[:checked]:bg-blue-600 has-[:checked]:text-white dark:text-neutral-300 dark:bg-neutral-700 dark:hover:bg-neutral-600 dark:focus:bg-neutral-600 dark:has-[:checked]:bg-blue-500 dark:has-[:checked]:text-white"> <input type="radio" class="hidden" id="hs-pro-clcrerofr" name="hs-pro-cremd"> Fr </label> <!-- End Checkbox --> <!-- Checkbox --> <label for="hs-pro-clcrerosa" class="group spfwn flex a459h items-center m6q9e cursor-pointer j7yil t4wtn o7p0z nwqzd b3tqx has-[:checked]:bg-blue-600 has-[:checked]:text-white dark:text-neutral-300 dark:bg-neutral-700 dark:hover:bg-neutral-600 dark:focus:bg-neutral-600 dark:has-[:checked]:bg-blue-500 dark:has-[:checked]:text-white"> <input type="radio" class="hidden" id="hs-pro-clcrerosa" name="hs-pro-cremd"> Sa </label> <!-- End Checkbox --> <!-- Checkbox --> <label for="hs-pro-clcrerosu" class="group spfwn flex a459h items-center m6q9e cursor-pointer j7yil t4wtn o7p0z nwqzd b3tqx has-[:checked]:bg-blue-600 has-[:checked]:text-white dark:text-neutral-300 dark:bg-neutral-700 dark:hover:bg-neutral-600 dark:focus:bg-neutral-600 dark:has-[:checked]:bg-blue-500 dark:has-[:checked]:text-white"> <input type="radio" class="hidden" id="hs-pro-clcrerosu" name="hs-pro-cremd"> Su </label> <!-- End Checkbox --> </div> </div> <!-- End Item --> <!-- Item --> <div> <label class="l1oxk block j7yil w8otv dark:text-neutral-500"> Ends: </label> <!-- Radio --> <div class="flex"> <input type="radio" name="hs-pro-clcree" class="xqknn khwhk icuyk tiwe1 y7tt1 vmau0 iec4s haq8z dark:bg-neutral-800 dark:border-neutral-700 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-neutral-800" id="hs-pro-clcreen" checked> <label for="hs-pro-clcreen" class="egssd kugle lpi99 dark:text-neutral-400">Never</label> </div> <!-- End Radio --> <div class="lf406 flex items-center klk5r"> <!-- Radio --> <div class="od2ao flex"> <input type="radio" name="hs-pro-clcree" class="xqknn khwhk icuyk tiwe1 y7tt1 vmau0 iec4s haq8z dark:bg-neutral-800 dark:border-neutral-700 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-neutral-800" id="hs-pro-clcreeo"> <label for="hs-pro-clcreeo" class="egssd kugle lpi99 dark:text-neutral-400">On</label> </div> <!-- End Radio --> <div class="w-full"> <!-- Input --> <input type="text" class="eek80 vo9dv block w-full o7p0z ftfcy m6q9e j7yil xkisd awvey nwqzd b50zm iec4s haq8z b3tqx owwub mwsh2 dark:text-neutral-400 dark:bg-neutral-700 dark:text-neutral-300 dark:placeholder:text-neutral-500 dark:hover:bg-neutral-600 dark:focus:bg-neutral-600" value="Jan 7, 2024"> <!-- End Input --> </div> </div> <div class="zw3r6 flex items-center klk5r"> <!-- Radio --> <div class="od2ao flex"> <input type="radio" name="hs-pro-clcree" class="xqknn khwhk icuyk tiwe1 y7tt1 vmau0 iec4s haq8z dark:bg-neutral-800 dark:border-neutral-700 dark:checked:bg-blue-500 dark:checked:border-blue-500 dark:focus:ring-offset-neutral-800" id="hs-pro-clcreea"> <label for="hs-pro-clcreea" class="egssd kugle lpi99 dark:text-neutral-400">After</label> </div> <!-- End Radio --> <div class="w-full flex items-center klk5r"> <!-- Input --> <input type="text" class="eek80 vo9dv block a0xhh o7p0z ftfcy m6q9e j7yil xkisd awvey nwqzd b50zm iec4s haq8z b3tqx owwub mwsh2 dark:text-neutral-400 dark:bg-neutral-700 dark:text-neutral-300 dark:placeholder:text-neutral-500 dark:hover:bg-neutral-600 dark:focus:bg-neutral-600" value="7"> <!-- End Input --> <span class="egssd w8otv dark:text-neutral-500">Times</span> </div> </div> </div> <!-- End Item --> </div> </div> </div> <!-- End Body --> <!-- Footer --> <div class="rsqxb x7giz jn9n3 khwhk dark:border-neutral-700"> <div class="z9yef flex f5dbk items-center sapo1"> <button type="button" class="rsqxb cc1ly j5skf rl1tg a459h items-center gxh7t nz7b4 qm5z2 khwhk t4wtn egssd zd5ha zb2tq fwpr6 oewy0 w8bqc iec4s haq8z dark:bg-neutral-800 dark:border-neutral-700 dark:text-neutral-300 dark:hover:bg-neutral-700 dark:focus:bg-neutral-700" data-hs-overlay="#hs-pro-clcre"> Cancel </button> <button type="button" class="rsqxb cc1ly j5skf rl1tg a459h items-center klk5r gxh7t ob5sd qm5z2 zranc txh0b egssd zd5ha zb2tq fwpr6 oewy0 hs3rw iec4s haq8z t4rxa mqwez zvcaz dark:focus:ring-blue-500" data-hs-overlay="#hs-pro-clcre"> Save </button> </div> </div> <!-- End Footer --> </div> </div> </div> <!-- End Custom Recurrence Modal -->
Schedule Transfer
new
Preview
Get the code
Existing accounts: Sign in to your account to access the source code.
<!DOCTYPE html> <html lang="en" dir="" class="relative h3sa8 du2fm"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <title>Preline UI</title> <link rel="shortcut icon" href="../../favicon.ico"> <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet"> <link rel="stylesheet" href="../../assets/css/obfuscated.min.css"> </head> <body> <div class="v3c69 iieae"> <button type="button" class="rsqxb cc1ly rl1tg a459h items-center klk5r gxh7t i7kxu qm5z2 uzll2 txh0b a3wk8 zd5ha zb2tq fwpr6 oewy0 tkmp4 t4rxa vxls2 dark:bg-white dark:text-neutral-800 dark:hover:bg-neutral-200 dark:focus:bg-neutral-200" aria-haspopup="dialog" aria-expanded="false" aria-controls="hs-pro-pysasha" data-hs-overlay="#hs-pro-pysasha"> Open </button> </div><!-- Show PIN Modal --> <div id="hs-pro-pysasha" class="hs-overlay hidden p8r3t fixed vemhv vvp3o wkjxl mjyak a17xw [--close-when-click-inside:true] xg820" role="dialog" tabindex="-1" aria-labelledby="hs-pro-pysasha-label"> <div class="hs-overlay-open:mt-7 hs-overlay-open:opacity-100 hs-overlay-open:duration-500 cu00e opacity-0 atv3v gyfl6 agvao jpgrs a2vl5 w43l1 h-[calc(100%-3.5rem)] min-h-[calc(100%-3.5rem)] flex items-center"> <div class="relative w-full j9aoa wcomx flex ao3ns nz7b4 u33oi apxxd dark:bg-neutral-800"> <!-- Header --> <div class="dmqa5 k6ur8 flex a459h items-center bm6ej dark:border-neutral-700"> <h3 id="hs-pro-pysasha-label" class="zd5ha t4wtn dark:text-neutral-200"> Create a scheduled or recurring transfer </h3> <div class="absolute rbiqi ubdnp"> <button type="button" class="j1mw5 rl1tg a459h items-center klk5r icuyk qm5z2 ftfcy o7p0z t4wtn nwqzd iec4s haq8z t4rxa b3tqx dark:bg-neutral-700 dark:hover:bg-neutral-600 dark:text-neutral-400 dark:focus:bg-neutral-600" aria-label="Close" data-hs-overlay="#hs-pro-pysasha"> <span class="tuthn">Close</span> <svg class="xqknn d681g" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M18 6 6 18"/><path d="m6 6 12 12"/></svg> </button> </div> </div> <!-- End Header --> <!-- Body --> <div id="hs-pro-pysasha-body" class="a6a2o u6v7p qn16e a17xw sh48p ygi9h wv8uu wt1jo dark:[&::-webkit-scrollbar-track]:bg-neutral-700 dark:[&::-webkit-scrollbar-thumb]:bg-neutral-500"> <p class="a3wk8 kugle dark:text-neutral-500"> Schedule this transfer for a later date and set it to repeat if needed. </p> <!-- Form --> <div class="lf406 flex ao3ns nprlz x3x2f"> <!-- Input --> <div> <label class="block trjok a3wk8 t4wtn dark:text-neutral-200"> Date </label> <!-- Calendar Dropdown --> <div class="hs-dropdown [--auto-close:inside] w-full rl1tg"> <button id="hs-pro-pyspmsad" type="button" class="xwz3o cc1ly w-full rl1tg items-center u33oi a3wk8 qm5z2 khwhk nz7b4 kugle wmthy h5let qn82b r560q iec4s haq8z t4rxa wclr3 s45it dark:bg-transparent dark:border-neutral-700 dark:text-neutral-500 dark:hover:ring-neutral-600 dark:focus:ring-neutral-600" aria-haspopup="menu" aria-expanded="false" aria-label="Dropdown"> <svg class="xqknn ymp3r ccfki" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect width="18" height="18" x="3" y="4" rx="2" ry="2"/><line x1="16" x2="16" y1="2" y2="6"/><line x1="8" x2="8" y1="2" y2="6"/><line x1="3" x2="21" y1="10" y2="10"/><path d="M8 14h.01"/><path d="M12 14h.01"/><path d="M16 14h.01"/><path d="M8 18h.01"/><path d="M12 18h.01"/><path d="M16 18h.01"/></svg> Select a date <svg class="xqknn honp5 d681g" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m6 9 6 6 6-6"/></svg> </button> <div class="hs-dropdown-menu hs-dropdown-open:opacity-100 av2mg transition-[opacity,margin] duration opacity-0 hidden w4j19 nz7b4 u33oi shadow-[0_10px_40px_10px_rgba(0,0,0,0.08)] dark:shadow-[0_10px_40px_10px_rgba(0,0,0,0.2)] dark:bg-neutral-900" role="menu" aria-orientation="vertical" aria-labelledby="hs-pro-pyspmsad"> <!-- Calendar --> <div class="ogll8 shme7"> <!-- Months --> <div class="o4dae ay7t5 items-center hwu3o e8r64 avnhm"> <!-- Prev Button --> <div class="bbqht"> <button type="button" class="j1mw5 flex a459h items-center t4wtn x8k6f icuyk iec4s haq8z t4rxa c2pts dark:text-neutral-400 dark:hover:bg-neutral-800 dark:focus:bg-neutral-800" aria-label="Previous"> <svg class="xqknn d681g" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m15 18-6-6 6-6"/></svg> </button> </div> <!-- End Prev Button --> <!-- Month / Year --> <div class="a5q9z flex a459h items-center o9jhx"> <div class="relative"> <select data-hs-select='{ "placeholder": "Select month", "toggleTag": "<button type=\"button\" aria-expanded=\"false\"></button>", "toggleClasses": "hs-select-disabled:pointer-events-none hs-select-disabled:opacity-50 relative flex j5skf w-full cursor-pointer gxh7t zd5ha t4wtn coccz t4rxa xcxcg v6hfb dbpp0 o0htc dark:text-neutral-200 dark:hover:text-purple-500 dark:focus:text-purple-500", "dropdownClasses": "vvl4w w4j19 l9eni tfx8w aqh96 shme7 nz7b4 qm5z2 khwhk zb2tq v1x81 wcomx a17xw sh48p ygi9h wv8uu wt1jo dark:[&::-webkit-scrollbar-track]:bg-neutral-700 dark:[&::-webkit-scrollbar-thumb]:bg-neutral-500 dark:bg-neutral-900 dark:border-neutral-700", "optionClasses": "jxbdw w-full a3wk8 t4wtn cursor-pointer x8k6f zb2tq t4rxa c2pts dark:bg-neutral-900 dark:hover:bg-neutral-800 dark:text-neutral-200 dark:focus:bg-neutral-800", "optionTemplate": "<div class=\"flex fa4f9 items-center w-full \"><span data-title></span><span class=\"hidden hs-selected:block \"><svg class=\"xqknn ccfki t4wtn dark:text-neutral-200 \" xmlns=\"http:.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><polyline points=\"20 6 9 17 4 12\"/></svg></span></div>" }' class="hidden"> <option value="0">January</option> <option value="1">February</option> <option value="2">March</option> <option value="3">April</option> <option value="4">May</option> <option value="5">June</option> <option value="6" selected>July</option> <option value="7">August</option> <option value="8">September</option> <option value="9">October</option> <option value="10">November</option> <option value="11">December</option> </select> </div> <span class="t4wtn dark:text-neutral-200">/</span> <div class="relative"> <select data-hs-select='{ "placeholder": "Select year", "toggleTag": "<button type=\"button\" aria-expanded=\"false\"></button>", "toggleClasses": "hs-select-disabled:pointer-events-none hs-select-disabled:opacity-50 relative flex j5skf w-full cursor-pointer gxh7t zd5ha t4wtn coccz t4rxa xcxcg v6hfb dbpp0 o0htc dark:text-neutral-200 dark:hover:text-purple-500 dark:focus:text-purple-500", "dropdownClasses": "vvl4w w4j19 od2ao tfx8w aqh96 shme7 nz7b4 qm5z2 khwhk zb2tq v1x81 wcomx a17xw sh48p ygi9h wv8uu wt1jo dark:[&::-webkit-scrollbar-track]:bg-neutral-700 dark:[&::-webkit-scrollbar-thumb]:bg-neutral-500 dark:bg-neutral-900 dark:border-neutral-700", "optionClasses": "jxbdw w-full a3wk8 t4wtn cursor-pointer x8k6f zb2tq t4rxa c2pts dark:bg-neutral-900 dark:hover:bg-neutral-800 dark:text-neutral-200 dark:focus:bg-neutral-800", "optionTemplate": "<div class=\"flex fa4f9 items-center w-full \"><span data-title></span><span class=\"hidden hs-selected:block \"><svg class=\"xqknn ccfki t4wtn dark:text-neutral-200 \" xmlns=\"http:.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><polyline points=\"20 6 9 17 4 12\"/></svg></span></div>" }' class="hidden"> <option selected>2023</option> <option>2024</option> <option>2025</option> <option>2026</option> <option>2027</option> </select> </div> </div> <!-- End Month / Year --> <!-- Next Button --> <div class="bbqht flex f5dbk"> <button type="button" class=" j1mw5 flex a459h items-center t4wtn x8k6f icuyk iec4s haq8z t4rxa c2pts dark:text-neutral-400 dark:hover:bg-neutral-800 dark:focus:bg-neutral-800" aria-label="Next"> <svg class="xqknn d681g" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m9 18 6-6-6-6"/></svg> </button> </div> <!-- End Next Button --> </div> <!-- Months --> <!-- Weeks --> <div class="flex cqbvv"> <span class="whmww bwtk8 block iieae a3wk8 kugle dark:text-neutral-500"> Mo </span> <span class="whmww bwtk8 block iieae a3wk8 kugle dark:text-neutral-500"> Tu </span> <span class="whmww bwtk8 block iieae a3wk8 kugle dark:text-neutral-500"> We </span> <span class="whmww bwtk8 block iieae a3wk8 kugle dark:text-neutral-500"> Th </span> <span class="whmww bwtk8 block iieae a3wk8 kugle dark:text-neutral-500"> Fr </span> <span class="whmww bwtk8 block iieae a3wk8 kugle dark:text-neutral-500"> Sa </span> <span class="whmww bwtk8 block iieae a3wk8 kugle dark:text-neutral-500"> Su </span> </div> <!-- Weeks --> <!-- Days --> <div class="flex"> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200" disabled> 26 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200" disabled> 27 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200" disabled> 28 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200" disabled> 29 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200" disabled> 30 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200"> 1 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200"> 2 </button> </div> </div> <!-- Days --> <!-- Days --> <div class="flex"> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200"> 3 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200"> 4 </button> </div> <div > <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200"> 5 </button> </div> <div > <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200"> 6 </button> </div> <div > <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200"> 7 </button> </div> <div > <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200"> 8 </button> </div> <div > <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200"> 9 </button> </div> </div> <!-- Days --> <!-- Days --> <div class="flex"> <div > <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200"> 10 </button> </div> <div > <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200"> 11 </button> </div> <div > <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200"> 12 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200"> 13 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200"> 14 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200"> 15 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200"> 16 </button> </div> </div> <!-- Days --> <!-- Days --> <div class="flex"> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200"> 17 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200"> 18 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200"> 19 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center lx5ec qm5z2 ftfcy a3wk8 zd5ha txh0b relw2 icuyk dark:bg-purple-500 iec4s haq8z t4rxa c2pts dark:hover:border-neutral-700"> 20 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200"> 21 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200"> 22 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200"> 23 </button> </div> </div> <!-- Days --> <!-- Days --> <div class="flex"> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200"> 24 </button> </div> <div > <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200"> 25 </button> </div> <div > <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200"> 26 </button> </div> <div > <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200"> 27 </button> </div> <div > <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200"> 28 </button> </div> <div > <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200"> 29 </button> </div> <div > <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200"> 30 </button> </div> </div> <!-- Days --> <!-- Days --> <div class="flex"> <div > <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200"> 31 </button> </div> <div > <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn relw2 coccz icuyk iec4s haq8z t4rxa c2pts dark:text-neutral-200 dark:hover:border-neutral-500 dark:focus:bg-neutral-700" disabled> 1 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn relw2 coccz icuyk iec4s haq8z t4rxa c2pts dark:text-neutral-200 dark:hover:border-neutral-500 dark:focus:bg-neutral-700" disabled> 2 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn relw2 coccz icuyk iec4s haq8z t4rxa c2pts dark:text-neutral-200 dark:hover:border-neutral-500 dark:focus:bg-neutral-700" disabled> 3 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn relw2 coccz icuyk iec4s haq8z t4rxa c2pts dark:text-neutral-200 dark:hover:border-neutral-500 dark:focus:bg-neutral-700" disabled> 4 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn relw2 coccz icuyk iec4s haq8z t4rxa c2pts dark:text-neutral-200 dark:hover:border-neutral-500 dark:focus:bg-neutral-700" disabled> 5 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn relw2 coccz icuyk iec4s haq8z t4rxa c2pts dark:text-neutral-200 dark:hover:border-neutral-500 dark:focus:bg-neutral-700" disabled> 6 </button> </div> </div> <!-- Days --> </div> </div> </div> <!-- End Calendar Dropdown --> </div> <!-- End Input --> <!-- Input --> <div> <label class="block trjok a3wk8 t4wtn dark:text-neutral-200"> Repeats </label> <!-- Select --> <div class="relative w-full xd86q"> <select data-hs-select='{ "placeholder": "Select currency", "toggleTag": "<button type=\"button\" aria-expanded=\"false\"></button>", "toggleClasses": "hs-select-disabled:pointer-events-none hs-select-disabled:opacity-50 relative xwz3o bpd4l i9ytw flex klk5r j5skf w-full cursor-pointer nz7b4 qm5z2 khwhk kugle u33oi gxh7t a3wk8 wmthy h5let qn82b r560q t4rxa s45it wclr3 dark:bg-neutral-800 dark:border-neutral-700 dark:text-neutral-400 dark:focus:outline-none dark:hover:ring-neutral-600 dark:focus:ring-neutral-600", "dropdownClasses": "w-full tfx8w aqh96 shme7 w4j19 wcomx a17xw nz7b4 u33oi shadow-[0_10px_40px_10px_rgba(0,0,0,0.08)] sh48p ygi9h wv8uu wt1jo dark:[&::-webkit-scrollbar-track]:bg-neutral-700 dark:[&::-webkit-scrollbar-thumb]:bg-neutral-500 dark:bg-neutral-900", "optionClasses": "hs-selected:bg-gray-100 dark:hs-selected:bg-neutral-800 rsqxb x7giz w-full a3wk8 t4wtn cursor-pointer x8k6f zb2tq t4rxa c2pts dark:bg-neutral-900 dark:hover:bg-neutral-800 dark:text-neutral-200 dark:focus:bg-neutral-800", "optionTemplate": "<div class=\"flex fa4f9 items-center w-full \"><span data-title></span><span class=\"hidden hs-selected:block \"><svg class=\"xqknn ccfki t4wtn dark:text-neutral-200 \" xmlns=\"http:.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><polyline points=\"20 6 9 17 4 12\"/></svg></span></div>", "viewport": "#hs-pro-pysasha-body" }' class="hidden"> <option value="">Choose</option> <option value="Do not repeat" selected>Do not repeat</option> <option value="Every day">Every day</option> <option value="Every week">Every week</option> <option value="Every year">Every year</option> </select> <div class="absolute c30g1 ubdnp -translate-y-1/2"> <svg class="xqknn d681g kugle dark:text-neutral-500" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m6 9 6 6 6-6"/></svg> </div> </div> <!-- End Select --> </div> <!-- End Input --> </div> <!-- End Form --> </div> <!-- End Body --> <!-- Footer --> <div class="a6a2o hf6gg jn9n3 khwhk dark:border-neutral-700"> <button type="button" class="xwz3o cc1ly w-full rl1tg a459h items-center gbe75 a3wk8 zd5ha u33oi qm5z2 ftfcy flthz txh0b hoz2q iec4s haq8z t4rxa h669z" data-hs-overlay="#hs-pro-pysasha"> Set schedule </button> </div> <!-- End Footer --> </div> </div> </div> <!-- End Show PIN Modal --> <script src="../../assets/vendor/preline/dist/index.js?v=1.0.0"></script> </body> </html> <script src="../../scripts/js/open-modals-on-init.js"></script>
<!-- Show PIN Modal --> <div id="hs-pro-pysasha" class="hs-overlay hidden p8r3t fixed vemhv vvp3o wkjxl mjyak a17xw [--close-when-click-inside:true] xg820" role="dialog" tabindex="-1" aria-labelledby="hs-pro-pysasha-label"> <div class="hs-overlay-open:mt-7 hs-overlay-open:opacity-100 hs-overlay-open:duration-500 cu00e opacity-0 atv3v gyfl6 agvao jpgrs a2vl5 w43l1 h-[calc(100%-3.5rem)] min-h-[calc(100%-3.5rem)] flex items-center"> <div class="relative w-full j9aoa wcomx flex ao3ns nz7b4 u33oi apxxd dark:bg-neutral-800"> <!-- Header --> <div class="dmqa5 k6ur8 flex a459h items-center bm6ej dark:border-neutral-700"> <h3 id="hs-pro-pysasha-label" class="zd5ha t4wtn dark:text-neutral-200"> Create a scheduled or recurring transfer </h3> <div class="absolute rbiqi ubdnp"> <button type="button" class="j1mw5 rl1tg a459h items-center klk5r icuyk qm5z2 ftfcy o7p0z t4wtn nwqzd iec4s haq8z t4rxa b3tqx dark:bg-neutral-700 dark:hover:bg-neutral-600 dark:text-neutral-400 dark:focus:bg-neutral-600" aria-label="Close" data-hs-overlay="#hs-pro-pysasha"> <span class="tuthn">Close</span> <svg class="xqknn d681g" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M18 6 6 18"/><path d="m6 6 12 12"/></svg> </button> </div> </div> <!-- End Header --> <!-- Body --> <div id="hs-pro-pysasha-body" class="a6a2o u6v7p qn16e a17xw sh48p ygi9h wv8uu wt1jo dark:[&::-webkit-scrollbar-track]:bg-neutral-700 dark:[&::-webkit-scrollbar-thumb]:bg-neutral-500"> <p class="a3wk8 kugle dark:text-neutral-500"> Schedule this transfer for a later date and set it to repeat if needed. </p> <!-- Form --> <div class="lf406 flex ao3ns nprlz x3x2f"> <!-- Input --> <div> <label class="block trjok a3wk8 t4wtn dark:text-neutral-200"> Date </label> <!-- Calendar Dropdown --> <div class="hs-dropdown [--auto-close:inside] w-full rl1tg"> <button id="hs-pro-pyspmsad" type="button" class="xwz3o cc1ly w-full rl1tg items-center u33oi a3wk8 qm5z2 khwhk nz7b4 kugle wmthy h5let qn82b r560q iec4s haq8z t4rxa wclr3 s45it dark:bg-transparent dark:border-neutral-700 dark:text-neutral-500 dark:hover:ring-neutral-600 dark:focus:ring-neutral-600" aria-haspopup="menu" aria-expanded="false" aria-label="Dropdown"> <svg class="xqknn ymp3r ccfki" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect width="18" height="18" x="3" y="4" rx="2" ry="2"/><line x1="16" x2="16" y1="2" y2="6"/><line x1="8" x2="8" y1="2" y2="6"/><line x1="3" x2="21" y1="10" y2="10"/><path d="M8 14h.01"/><path d="M12 14h.01"/><path d="M16 14h.01"/><path d="M8 18h.01"/><path d="M12 18h.01"/><path d="M16 18h.01"/></svg> Select a date <svg class="xqknn honp5 d681g" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m6 9 6 6 6-6"/></svg> </button> <div class="hs-dropdown-menu hs-dropdown-open:opacity-100 av2mg transition-[opacity,margin] duration opacity-0 hidden w4j19 nz7b4 u33oi shadow-[0_10px_40px_10px_rgba(0,0,0,0.08)] dark:shadow-[0_10px_40px_10px_rgba(0,0,0,0.2)] dark:bg-neutral-900" role="menu" aria-orientation="vertical" aria-labelledby="hs-pro-pyspmsad"> <!-- Calendar --> <div class="ogll8 shme7"> <!-- Months --> <div class="o4dae ay7t5 items-center hwu3o e8r64 avnhm"> <!-- Prev Button --> <div class="bbqht"> <button type="button" class="j1mw5 flex a459h items-center t4wtn x8k6f icuyk iec4s haq8z t4rxa c2pts dark:text-neutral-400 dark:hover:bg-neutral-800 dark:focus:bg-neutral-800" aria-label="Previous"> <svg class="xqknn d681g" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m15 18-6-6 6-6"/></svg> </button> </div> <!-- End Prev Button --> <!-- Month / Year --> <div class="a5q9z flex a459h items-center o9jhx"> <div class="relative"> <select data-hs-select='{ "placeholder": "Select month", "toggleTag": "<button type=\"button\" aria-expanded=\"false\"></button>", "toggleClasses": "hs-select-disabled:pointer-events-none hs-select-disabled:opacity-50 relative flex j5skf w-full cursor-pointer gxh7t zd5ha t4wtn coccz t4rxa xcxcg v6hfb dbpp0 o0htc dark:text-neutral-200 dark:hover:text-purple-500 dark:focus:text-purple-500", "dropdownClasses": "vvl4w w4j19 l9eni tfx8w aqh96 shme7 nz7b4 qm5z2 khwhk zb2tq v1x81 wcomx a17xw sh48p ygi9h wv8uu wt1jo dark:[&::-webkit-scrollbar-track]:bg-neutral-700 dark:[&::-webkit-scrollbar-thumb]:bg-neutral-500 dark:bg-neutral-900 dark:border-neutral-700", "optionClasses": "jxbdw w-full a3wk8 t4wtn cursor-pointer x8k6f zb2tq t4rxa c2pts dark:bg-neutral-900 dark:hover:bg-neutral-800 dark:text-neutral-200 dark:focus:bg-neutral-800", "optionTemplate": "<div class=\"flex fa4f9 items-center w-full \"><span data-title></span><span class=\"hidden hs-selected:block \"><svg class=\"xqknn ccfki t4wtn dark:text-neutral-200 \" xmlns=\"http:.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><polyline points=\"20 6 9 17 4 12\"/></svg></span></div>" }' class="hidden"> <option value="0">January</option> <option value="1">February</option> <option value="2">March</option> <option value="3">April</option> <option value="4">May</option> <option value="5">June</option> <option value="6" selected>July</option> <option value="7">August</option> <option value="8">September</option> <option value="9">October</option> <option value="10">November</option> <option value="11">December</option> </select> </div> <span class="t4wtn dark:text-neutral-200">/</span> <div class="relative"> <select data-hs-select='{ "placeholder": "Select year", "toggleTag": "<button type=\"button\" aria-expanded=\"false\"></button>", "toggleClasses": "hs-select-disabled:pointer-events-none hs-select-disabled:opacity-50 relative flex j5skf w-full cursor-pointer gxh7t zd5ha t4wtn coccz t4rxa xcxcg v6hfb dbpp0 o0htc dark:text-neutral-200 dark:hover:text-purple-500 dark:focus:text-purple-500", "dropdownClasses": "vvl4w w4j19 od2ao tfx8w aqh96 shme7 nz7b4 qm5z2 khwhk zb2tq v1x81 wcomx a17xw sh48p ygi9h wv8uu wt1jo dark:[&::-webkit-scrollbar-track]:bg-neutral-700 dark:[&::-webkit-scrollbar-thumb]:bg-neutral-500 dark:bg-neutral-900 dark:border-neutral-700", "optionClasses": "jxbdw w-full a3wk8 t4wtn cursor-pointer x8k6f zb2tq t4rxa c2pts dark:bg-neutral-900 dark:hover:bg-neutral-800 dark:text-neutral-200 dark:focus:bg-neutral-800", "optionTemplate": "<div class=\"flex fa4f9 items-center w-full \"><span data-title></span><span class=\"hidden hs-selected:block \"><svg class=\"xqknn ccfki t4wtn dark:text-neutral-200 \" xmlns=\"http:.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><polyline points=\"20 6 9 17 4 12\"/></svg></span></div>" }' class="hidden"> <option selected>2023</option> <option>2024</option> <option>2025</option> <option>2026</option> <option>2027</option> </select> </div> </div> <!-- End Month / Year --> <!-- Next Button --> <div class="bbqht flex f5dbk"> <button type="button" class=" j1mw5 flex a459h items-center t4wtn x8k6f icuyk iec4s haq8z t4rxa c2pts dark:text-neutral-400 dark:hover:bg-neutral-800 dark:focus:bg-neutral-800" aria-label="Next"> <svg class="xqknn d681g" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m9 18 6-6-6-6"/></svg> </button> </div> <!-- End Next Button --> </div> <!-- Months --> <!-- Weeks --> <div class="flex cqbvv"> <span class="whmww bwtk8 block iieae a3wk8 kugle dark:text-neutral-500"> Mo </span> <span class="whmww bwtk8 block iieae a3wk8 kugle dark:text-neutral-500"> Tu </span> <span class="whmww bwtk8 block iieae a3wk8 kugle dark:text-neutral-500"> We </span> <span class="whmww bwtk8 block iieae a3wk8 kugle dark:text-neutral-500"> Th </span> <span class="whmww bwtk8 block iieae a3wk8 kugle dark:text-neutral-500"> Fr </span> <span class="whmww bwtk8 block iieae a3wk8 kugle dark:text-neutral-500"> Sa </span> <span class="whmww bwtk8 block iieae a3wk8 kugle dark:text-neutral-500"> Su </span> </div> <!-- Weeks --> <!-- Days --> <div class="flex"> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200" disabled> 26 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200" disabled> 27 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200" disabled> 28 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200" disabled> 29 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200" disabled> 30 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200"> 1 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200"> 2 </button> </div> </div> <!-- Days --> <!-- Days --> <div class="flex"> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200"> 3 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200"> 4 </button> </div> <div > <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200"> 5 </button> </div> <div > <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200"> 6 </button> </div> <div > <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200"> 7 </button> </div> <div > <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200"> 8 </button> </div> <div > <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200"> 9 </button> </div> </div> <!-- Days --> <!-- Days --> <div class="flex"> <div > <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200"> 10 </button> </div> <div > <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200"> 11 </button> </div> <div > <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200"> 12 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200"> 13 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200"> 14 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200"> 15 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200"> 16 </button> </div> </div> <!-- Days --> <!-- Days --> <div class="flex"> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200"> 17 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200"> 18 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200"> 19 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center lx5ec qm5z2 ftfcy a3wk8 zd5ha txh0b relw2 icuyk dark:bg-purple-500 iec4s haq8z t4rxa c2pts dark:hover:border-neutral-700"> 20 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200"> 21 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200"> 22 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200"> 23 </button> </div> </div> <!-- Days --> <!-- Days --> <div class="flex"> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200"> 24 </button> </div> <div > <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200"> 25 </button> </div> <div > <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200"> 26 </button> </div> <div > <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200"> 27 </button> </div> <div > <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200"> 28 </button> </div> <div > <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200"> 29 </button> </div> <div > <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200"> 30 </button> </div> </div> <!-- Days --> <!-- Days --> <div class="flex"> <div > <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk relw2 coccz iec4s haq8z t4rxa qji3v xcxcg dark:text-neutral-200"> 31 </button> </div> <div > <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn relw2 coccz icuyk iec4s haq8z t4rxa c2pts dark:text-neutral-200 dark:hover:border-neutral-500 dark:focus:bg-neutral-700" disabled> 1 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn relw2 coccz icuyk iec4s haq8z t4rxa c2pts dark:text-neutral-200 dark:hover:border-neutral-500 dark:focus:bg-neutral-700" disabled> 2 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn relw2 coccz icuyk iec4s haq8z t4rxa c2pts dark:text-neutral-200 dark:hover:border-neutral-500 dark:focus:bg-neutral-700" disabled> 3 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn relw2 coccz icuyk iec4s haq8z t4rxa c2pts dark:text-neutral-200 dark:hover:border-neutral-500 dark:focus:bg-neutral-700" disabled> 4 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn relw2 coccz icuyk iec4s haq8z t4rxa c2pts dark:text-neutral-200 dark:hover:border-neutral-500 dark:focus:bg-neutral-700" disabled> 5 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn relw2 coccz icuyk iec4s haq8z t4rxa c2pts dark:text-neutral-200 dark:hover:border-neutral-500 dark:focus:bg-neutral-700" disabled> 6 </button> </div> </div> <!-- Days --> </div> </div> </div> <!-- End Calendar Dropdown --> </div> <!-- End Input --> <!-- Input --> <div> <label class="block trjok a3wk8 t4wtn dark:text-neutral-200"> Repeats </label> <!-- Select --> <div class="relative w-full xd86q"> <select data-hs-select='{ "placeholder": "Select currency", "toggleTag": "<button type=\"button\" aria-expanded=\"false\"></button>", "toggleClasses": "hs-select-disabled:pointer-events-none hs-select-disabled:opacity-50 relative xwz3o bpd4l i9ytw flex klk5r j5skf w-full cursor-pointer nz7b4 qm5z2 khwhk kugle u33oi gxh7t a3wk8 wmthy h5let qn82b r560q t4rxa s45it wclr3 dark:bg-neutral-800 dark:border-neutral-700 dark:text-neutral-400 dark:focus:outline-none dark:hover:ring-neutral-600 dark:focus:ring-neutral-600", "dropdownClasses": "w-full tfx8w aqh96 shme7 w4j19 wcomx a17xw nz7b4 u33oi shadow-[0_10px_40px_10px_rgba(0,0,0,0.08)] sh48p ygi9h wv8uu wt1jo dark:[&::-webkit-scrollbar-track]:bg-neutral-700 dark:[&::-webkit-scrollbar-thumb]:bg-neutral-500 dark:bg-neutral-900", "optionClasses": "hs-selected:bg-gray-100 dark:hs-selected:bg-neutral-800 rsqxb x7giz w-full a3wk8 t4wtn cursor-pointer x8k6f zb2tq t4rxa c2pts dark:bg-neutral-900 dark:hover:bg-neutral-800 dark:text-neutral-200 dark:focus:bg-neutral-800", "optionTemplate": "<div class=\"flex fa4f9 items-center w-full \"><span data-title></span><span class=\"hidden hs-selected:block \"><svg class=\"xqknn ccfki t4wtn dark:text-neutral-200 \" xmlns=\"http:.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><polyline points=\"20 6 9 17 4 12\"/></svg></span></div>", "viewport": "#hs-pro-pysasha-body" }' class="hidden"> <option value="">Choose</option> <option value="Do not repeat" selected>Do not repeat</option> <option value="Every day">Every day</option> <option value="Every week">Every week</option> <option value="Every year">Every year</option> </select> <div class="absolute c30g1 ubdnp -translate-y-1/2"> <svg class="xqknn d681g kugle dark:text-neutral-500" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m6 9 6 6 6-6"/></svg> </div> </div> <!-- End Select --> </div> <!-- End Input --> </div> <!-- End Form --> </div> <!-- End Body --> <!-- Footer --> <div class="a6a2o hf6gg jn9n3 khwhk dark:border-neutral-700"> <button type="button" class="xwz3o cc1ly w-full rl1tg a459h items-center gbe75 a3wk8 zd5ha u33oi qm5z2 ftfcy flthz txh0b hoz2q iec4s haq8z t4rxa h669z" data-hs-overlay="#hs-pro-pysasha"> Set schedule </button> </div> <!-- End Footer --> </div> </div> </div> <!-- End Show PIN Modal -->
Snooze
Preview
Get the code
Existing accounts: Sign in to your account to access the source code.
<!DOCTYPE html> <html lang="en" dir="" class="relative h3sa8 du2fm"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <title>Preline UI</title> <link rel="shortcut icon" href="../../favicon.ico"> <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet"> <link rel="stylesheet" href="../../assets/css/obfuscated.min.css"> </head> <body><!-- Archive Message Modal --> <div id="hs-pro-chhsn" class="hs-overlay hidden p8r3t fixed vemhv vvp3o wkjxl mjyak a17xw [--close-when-click-inside:true] xg820" role="dialog" tabindex="-1" aria-labelledby="hs-pro-chhsn-label"> <div class="hs-overlay-open:mt-7 hs-overlay-open:opacity-100 hs-overlay-open:duration-500 cu00e opacity-0 atv3v gyfl6 s2xvr jpgrs a2vl5 w43l1 h-[calc(100%-3.5rem)] min-h-[calc(100%-3.5rem)] flex items-center"> <div class="w-full j9aoa wcomx flex ao3ns nz7b4 u33oi apxxd shadow-[0_10px_40px_10px_rgba(0,0,0,0.08)] dark:shadow-[0_10px_40px_10px_rgba(0,0,0,0.2)] dark:bg-neutral-800"> <!-- Header --> <div class="xwz3o x7giz flex fa4f9 items-center bm6ej dark:border-neutral-700"> <h3 id="hs-pro-chhsn-label" class="zd5ha t4wtn dark:text-neutral-200"> Snooze </h3> <button type="button" class="j1mw5 rl1tg a459h items-center klk5r icuyk qm5z2 ftfcy o7p0z t4wtn nwqzd iec4s haq8z t4rxa b3tqx dark:bg-neutral-700 dark:hover:bg-neutral-600 dark:text-neutral-400 dark:focus:bg-neutral-600" aria-label="Close" data-hs-overlay="#hs-pro-chhsn"> <span class="tuthn">Close</span> <svg class="xqknn d681g" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M18 6 6 18"/><path d="m6 6 12 12"/></svg> </button> </div> <!-- End Header --> <!-- Body --> <div class="aqh96 a17xw sh48p ygi9h wv8uu wt1jo dark:[&::-webkit-scrollbar-track]:bg-neutral-700 dark:[&::-webkit-scrollbar-thumb]:bg-neutral-500"> <fieldset class="o4dae l0sxn"> <legend class="tuthn"> Snooze </legend> <!-- Checkbox --> <label for="hs-pro-chhsnrt1" class="rsqxb cc1ly flex items-center zb2tq cursor-pointer m6q9e x8k6f has-[:checked]:bg-gray-100 qo2pb cbtmz dark:hover:bg-neutral-700 dark:has-[:checked]:bg-neutral-700 "> <input type="radio" id="hs-pro-chhsnrt1" class="hidden" value="Today" name="hs-pro-chhsnrt" checked> <span class="qisry"> <span class="block a3wk8 t4wtn dark:text-neutral-200"> Today </span> </span> <span class="fgfvg egssd kugle dark:text-neutral-500"> 5:05 PM </span> </label> <!-- End Checkbox --> <!-- Checkbox --> <label for="hs-pro-chhsnrt2" class="rsqxb cc1ly flex items-center zb2tq cursor-pointer m6q9e x8k6f has-[:checked]:bg-gray-100 qo2pb cbtmz dark:hover:bg-neutral-700 dark:has-[:checked]:bg-neutral-700 "> <input type="radio" id="hs-pro-chhsnrt2" class="hidden" value="Tomorrow" name="hs-pro-chhsnrt" > <span class="qisry"> <span class="block a3wk8 t4wtn dark:text-neutral-200"> Tomorrow </span> </span> <span class="fgfvg egssd kugle dark:text-neutral-500"> Wed 9:00 AM </span> </label> <!-- End Checkbox --> <!-- Checkbox --> <label for="hs-pro-chhsnrt3" class="rsqxb cc1ly flex items-center zb2tq cursor-pointer m6q9e x8k6f has-[:checked]:bg-gray-100 qo2pb cbtmz dark:hover:bg-neutral-700 dark:has-[:checked]:bg-neutral-700 "> <input type="radio" id="hs-pro-chhsnrt3" class="hidden" value="This week" name="hs-pro-chhsnrt" > <span class="qisry"> <span class="block a3wk8 t4wtn dark:text-neutral-200"> This week </span> </span> <span class="fgfvg egssd kugle dark:text-neutral-500"> Thu, May 8, 9:00 AM </span> </label> <!-- End Checkbox --> <!-- Checkbox --> <label for="hs-pro-chhsnrt4" class="rsqxb cc1ly flex items-center zb2tq cursor-pointer m6q9e x8k6f has-[:checked]:bg-gray-100 qo2pb cbtmz dark:hover:bg-neutral-700 dark:has-[:checked]:bg-neutral-700 "> <input type="radio" id="hs-pro-chhsnrt4" class="hidden" value="Next week" name="hs-pro-chhsnrt" > <span class="qisry"> <span class="block a3wk8 t4wtn dark:text-neutral-200"> Next week </span> </span> <span class="fgfvg egssd kugle dark:text-neutral-500"> Mon, May 13, 9:00 AM </span> </label> <!-- End Checkbox --> </fieldset> <div class="di2ve"> <!-- Button --> <button type="button" class="w-full flex fa4f9 items-center hwu3o rsqxb cc1ly gxh7t zd5ha a3wk8 t4wtn x8k6f m6q9e iec4s haq8z t4rxa c2pts dark:text-neutral-200 dark:hover:bg-neutral-700 dark:focus:bg-neutral-700 dark:hover:text-neutral-200 dark:focus:text-neutral-200" data-hs-overlay="#hs-pro-chhsncs"> Custom <svg class="xqknn d681g" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m9 18 6-6-6-6"/></svg> </button> <!-- End Button --> </div> </div> <!-- End Body --> </div> </div> </div> <!-- End Archive Message Modal --> <script src="../../assets/vendor/preline/dist/index.js?v=1.0.0"></script> </body> </html> <script src="../../scripts/js/open-modals-on-init.js"></script>
<!-- Archive Message Modal --> <div id="hs-pro-chhsn" class="hs-overlay hidden p8r3t fixed vemhv vvp3o wkjxl mjyak a17xw [--close-when-click-inside:true] xg820" role="dialog" tabindex="-1" aria-labelledby="hs-pro-chhsn-label"> <div class="hs-overlay-open:mt-7 hs-overlay-open:opacity-100 hs-overlay-open:duration-500 cu00e opacity-0 atv3v gyfl6 s2xvr jpgrs a2vl5 w43l1 h-[calc(100%-3.5rem)] min-h-[calc(100%-3.5rem)] flex items-center"> <div class="w-full j9aoa wcomx flex ao3ns nz7b4 u33oi apxxd shadow-[0_10px_40px_10px_rgba(0,0,0,0.08)] dark:shadow-[0_10px_40px_10px_rgba(0,0,0,0.2)] dark:bg-neutral-800"> <!-- Header --> <div class="xwz3o x7giz flex fa4f9 items-center bm6ej dark:border-neutral-700"> <h3 id="hs-pro-chhsn-label" class="zd5ha t4wtn dark:text-neutral-200"> Snooze </h3> <button type="button" class="j1mw5 rl1tg a459h items-center klk5r icuyk qm5z2 ftfcy o7p0z t4wtn nwqzd iec4s haq8z t4rxa b3tqx dark:bg-neutral-700 dark:hover:bg-neutral-600 dark:text-neutral-400 dark:focus:bg-neutral-600" aria-label="Close" data-hs-overlay="#hs-pro-chhsn"> <span class="tuthn">Close</span> <svg class="xqknn d681g" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M18 6 6 18"/><path d="m6 6 12 12"/></svg> </button> </div> <!-- End Header --> <!-- Body --> <div class="aqh96 a17xw sh48p ygi9h wv8uu wt1jo dark:[&::-webkit-scrollbar-track]:bg-neutral-700 dark:[&::-webkit-scrollbar-thumb]:bg-neutral-500"> <fieldset class="o4dae l0sxn"> <legend class="tuthn"> Snooze </legend> <!-- Checkbox --> <label for="hs-pro-chhsnrt1" class="rsqxb cc1ly flex items-center zb2tq cursor-pointer m6q9e x8k6f has-[:checked]:bg-gray-100 qo2pb cbtmz dark:hover:bg-neutral-700 dark:has-[:checked]:bg-neutral-700 "> <input type="radio" id="hs-pro-chhsnrt1" class="hidden" value="Today" name="hs-pro-chhsnrt" checked> <span class="qisry"> <span class="block a3wk8 t4wtn dark:text-neutral-200"> Today </span> </span> <span class="fgfvg egssd kugle dark:text-neutral-500"> 5:05 PM </span> </label> <!-- End Checkbox --> <!-- Checkbox --> <label for="hs-pro-chhsnrt2" class="rsqxb cc1ly flex items-center zb2tq cursor-pointer m6q9e x8k6f has-[:checked]:bg-gray-100 qo2pb cbtmz dark:hover:bg-neutral-700 dark:has-[:checked]:bg-neutral-700 "> <input type="radio" id="hs-pro-chhsnrt2" class="hidden" value="Tomorrow" name="hs-pro-chhsnrt" > <span class="qisry"> <span class="block a3wk8 t4wtn dark:text-neutral-200"> Tomorrow </span> </span> <span class="fgfvg egssd kugle dark:text-neutral-500"> Wed 9:00 AM </span> </label> <!-- End Checkbox --> <!-- Checkbox --> <label for="hs-pro-chhsnrt3" class="rsqxb cc1ly flex items-center zb2tq cursor-pointer m6q9e x8k6f has-[:checked]:bg-gray-100 qo2pb cbtmz dark:hover:bg-neutral-700 dark:has-[:checked]:bg-neutral-700 "> <input type="radio" id="hs-pro-chhsnrt3" class="hidden" value="This week" name="hs-pro-chhsnrt" > <span class="qisry"> <span class="block a3wk8 t4wtn dark:text-neutral-200"> This week </span> </span> <span class="fgfvg egssd kugle dark:text-neutral-500"> Thu, May 8, 9:00 AM </span> </label> <!-- End Checkbox --> <!-- Checkbox --> <label for="hs-pro-chhsnrt4" class="rsqxb cc1ly flex items-center zb2tq cursor-pointer m6q9e x8k6f has-[:checked]:bg-gray-100 qo2pb cbtmz dark:hover:bg-neutral-700 dark:has-[:checked]:bg-neutral-700 "> <input type="radio" id="hs-pro-chhsnrt4" class="hidden" value="Next week" name="hs-pro-chhsnrt" > <span class="qisry"> <span class="block a3wk8 t4wtn dark:text-neutral-200"> Next week </span> </span> <span class="fgfvg egssd kugle dark:text-neutral-500"> Mon, May 13, 9:00 AM </span> </label> <!-- End Checkbox --> </fieldset> <div class="di2ve"> <!-- Button --> <button type="button" class="w-full flex fa4f9 items-center hwu3o rsqxb cc1ly gxh7t zd5ha a3wk8 t4wtn x8k6f m6q9e iec4s haq8z t4rxa c2pts dark:text-neutral-200 dark:hover:bg-neutral-700 dark:focus:bg-neutral-700 dark:hover:text-neutral-200 dark:focus:text-neutral-200" data-hs-overlay="#hs-pro-chhsncs"> Custom <svg class="xqknn d681g" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m9 18 6-6-6-6"/></svg> </button> <!-- End Button --> </div> </div> <!-- End Body --> </div> </div> </div> <!-- End Archive Message Modal -->
Custom Snooze Date & Time
Preview
Get the code
Existing accounts: Sign in to your account to access the source code.
<!DOCTYPE html> <html lang="en" dir="" class="relative h3sa8 du2fm"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <title>Preline UI</title> <link rel="shortcut icon" href="../../favicon.ico"> <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet"> <link rel="stylesheet" href="../../assets/css/obfuscated.min.css"> </head> <body><!-- Archive Message Modal --> <div id="hs-pro-chhsncs" class="hs-overlay hidden p8r3t fixed vemhv vvp3o wkjxl mjyak a17xw [--close-when-click-inside:true] xg820" role="dialog" tabindex="-1" aria-labelledby="hs-pro-chhsncs-label"> <div class="hs-overlay-open:mt-7 hs-overlay-open:opacity-100 hs-overlay-open:duration-500 cu00e opacity-0 atv3v gyfl6 s2xvr jpgrs a2vl5 w43l1 h-[calc(100%-3.5rem)] min-h-[calc(100%-3.5rem)] flex items-center"> <div class="w-full j9aoa wcomx flex ao3ns nz7b4 u33oi apxxd shadow-[0_10px_40px_10px_rgba(0,0,0,0.08)] dark:shadow-[0_10px_40px_10px_rgba(0,0,0,0.2)] dark:bg-neutral-800"> <!-- Header --> <div class="tjm3z x7giz flex fa4f9 items-center bm6ej khwhk dark:border-neutral-700"> <button type="button" class="j1mw5 rl1tg a459h items-center klk5r icuyk qm5z2 ftfcy nz7b4 t4wtn x8k6f t4rxa c2pts iec4s haq8z dark:bg-neutral-800 dark:hover:bg-neutral-700 dark:text-neutral-400 dark:focus:bg-neutral-700" data-hs-overlay="#hs-pro-chhsn"> <span class="tuthn">Back</span> <svg class="xqknn d681g" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m15 18-6-6 6-6"/></svg> </button> <h3 id="hs-pro-chhsncs-label" class="lno3i t4wtn dark:text-neutral-200"> Custom date & time </h3> <button type="button" class="j1mw5 rl1tg a459h items-center klk5r icuyk qm5z2 ftfcy o7p0z t4wtn nwqzd t4rxa b3tqx iec4s haq8z dark:bg-neutral-700 dark:hover:bg-neutral-600 dark:text-neutral-400 dark:focus:bg-neutral-600" aria-label="Close" data-hs-overlay="#hs-pro-chhsncs"> <svg class="xqknn d681g" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M18 6 6 18"/><path d="m6 6 12 12"/></svg> <span class="tuthn">Close</span> </button> </div> <!-- End Header --> <!-- Body --> <div class="aqh96 g7f0s a17xw sh48p ygi9h wv8uu wt1jo dark:[&::-webkit-scrollbar-track]:bg-neutral-700 dark:[&::-webkit-scrollbar-thumb]:bg-neutral-500"> <div class="flex fa4f9 o9jhx"> <fieldset class="w-full o4dae l0sxn"> <legend class="tuthn"> Custom date & time </legend> <!-- Checkbox --> <label for="hs-pro-chhsncsramt1" class="rsqxb cc1ly flex a459h items-center nz7b4 zb2tq cursor-pointer m6q9e nwqzd has-[:checked]:bg-gray-200 qo2pb cbtmz dark:bg-neutral-800 dark:hover:bg-neutral-700 dark:has-[:checked]:bg-neutral-700"> <input type="radio" id="hs-pro-chhsncsramt1" class="hidden" value="01:00 AM" name="hs-pro-chhsncsramt" checked> <span class="block j7yil t4wtn dark:text-neutral-200"> 01:00 AM </span> </label> <!-- End Checkbox --> <!-- Checkbox --> <label for="hs-pro-chhsncsramt2" class="rsqxb cc1ly flex a459h items-center nz7b4 zb2tq cursor-pointer m6q9e nwqzd has-[:checked]:bg-gray-200 qo2pb cbtmz dark:bg-neutral-800 dark:hover:bg-neutral-700 dark:has-[:checked]:bg-neutral-700"> <input type="radio" id="hs-pro-chhsncsramt2" class="hidden" value="02:00 AM" name="hs-pro-chhsncsramt" > <span class="block j7yil t4wtn dark:text-neutral-200"> 02:00 AM </span> </label> <!-- End Checkbox --> <!-- Checkbox --> <label for="hs-pro-chhsncsramt3" class="rsqxb cc1ly flex a459h items-center nz7b4 zb2tq cursor-pointer m6q9e nwqzd has-[:checked]:bg-gray-200 qo2pb cbtmz dark:bg-neutral-800 dark:hover:bg-neutral-700 dark:has-[:checked]:bg-neutral-700"> <input type="radio" id="hs-pro-chhsncsramt3" class="hidden" value="03:00 AM" name="hs-pro-chhsncsramt" > <span class="block j7yil t4wtn dark:text-neutral-200"> 03:00 AM </span> </label> <!-- End Checkbox --> <!-- Checkbox --> <label for="hs-pro-chhsncsramt4" class="rsqxb cc1ly flex a459h items-center nz7b4 zb2tq cursor-pointer m6q9e nwqzd has-[:checked]:bg-gray-200 qo2pb cbtmz dark:bg-neutral-800 dark:hover:bg-neutral-700 dark:has-[:checked]:bg-neutral-700"> <input type="radio" id="hs-pro-chhsncsramt4" class="hidden" value="04:00 AM" name="hs-pro-chhsncsramt" > <span class="block j7yil t4wtn dark:text-neutral-200"> 04:00 AM </span> </label> <!-- End Checkbox --> <!-- Checkbox --> <label for="hs-pro-chhsncsramt5" class="rsqxb cc1ly flex a459h items-center nz7b4 zb2tq cursor-pointer m6q9e nwqzd has-[:checked]:bg-gray-200 qo2pb cbtmz dark:bg-neutral-800 dark:hover:bg-neutral-700 dark:has-[:checked]:bg-neutral-700"> <input type="radio" id="hs-pro-chhsncsramt5" class="hidden" value="05:00 AM" name="hs-pro-chhsncsramt" > <span class="block j7yil t4wtn dark:text-neutral-200"> 05:00 AM </span> </label> <!-- End Checkbox --> <!-- Checkbox --> <label for="hs-pro-chhsncsramt6" class="rsqxb cc1ly flex a459h items-center nz7b4 zb2tq cursor-pointer m6q9e nwqzd has-[:checked]:bg-gray-200 qo2pb cbtmz dark:bg-neutral-800 dark:hover:bg-neutral-700 dark:has-[:checked]:bg-neutral-700"> <input type="radio" id="hs-pro-chhsncsramt6" class="hidden" value="06:00 AM" name="hs-pro-chhsncsramt" > <span class="block j7yil t4wtn dark:text-neutral-200"> 06:00 AM </span> </label> <!-- End Checkbox --> <!-- Checkbox --> <label for="hs-pro-chhsncsramt7" class="rsqxb cc1ly flex a459h items-center nz7b4 zb2tq cursor-pointer m6q9e nwqzd has-[:checked]:bg-gray-200 qo2pb cbtmz dark:bg-neutral-800 dark:hover:bg-neutral-700 dark:has-[:checked]:bg-neutral-700"> <input type="radio" id="hs-pro-chhsncsramt7" class="hidden" value="07:00 AM" name="hs-pro-chhsncsramt" > <span class="block j7yil t4wtn dark:text-neutral-200"> 07:00 AM </span> </label> <!-- End Checkbox --> <!-- Checkbox --> <label for="hs-pro-chhsncsramt8" class="rsqxb cc1ly flex a459h items-center nz7b4 zb2tq cursor-pointer m6q9e nwqzd has-[:checked]:bg-gray-200 qo2pb cbtmz dark:bg-neutral-800 dark:hover:bg-neutral-700 dark:has-[:checked]:bg-neutral-700"> <input type="radio" id="hs-pro-chhsncsramt8" class="hidden" value="08:00 AM" name="hs-pro-chhsncsramt" > <span class="block j7yil t4wtn dark:text-neutral-200"> 08:00 AM </span> </label> <!-- End Checkbox --> <!-- Checkbox --> <label for="hs-pro-chhsncsramt9" class="rsqxb cc1ly flex a459h items-center nz7b4 zb2tq cursor-pointer m6q9e nwqzd has-[:checked]:bg-gray-200 qo2pb cbtmz dark:bg-neutral-800 dark:hover:bg-neutral-700 dark:has-[:checked]:bg-neutral-700"> <input type="radio" id="hs-pro-chhsncsramt9" class="hidden" value="09:00 AM" name="hs-pro-chhsncsramt" > <span class="block j7yil t4wtn dark:text-neutral-200"> 09:00 AM </span> </label> <!-- End Checkbox --> <!-- Checkbox --> <label for="hs-pro-chhsncsramt10" class="rsqxb cc1ly flex a459h items-center nz7b4 zb2tq cursor-pointer m6q9e nwqzd has-[:checked]:bg-gray-200 qo2pb cbtmz dark:bg-neutral-800 dark:hover:bg-neutral-700 dark:has-[:checked]:bg-neutral-700"> <input type="radio" id="hs-pro-chhsncsramt10" class="hidden" value="010:00 AM" name="hs-pro-chhsncsramt" > <span class="block j7yil t4wtn dark:text-neutral-200"> 010:00 AM </span> </label> <!-- End Checkbox --> <!-- Checkbox --> <label for="hs-pro-chhsncsramt11" class="rsqxb cc1ly flex a459h items-center nz7b4 zb2tq cursor-pointer m6q9e nwqzd has-[:checked]:bg-gray-200 qo2pb cbtmz dark:bg-neutral-800 dark:hover:bg-neutral-700 dark:has-[:checked]:bg-neutral-700"> <input type="radio" id="hs-pro-chhsncsramt11" class="hidden" value="011:00 AM" name="hs-pro-chhsncsramt" > <span class="block j7yil t4wtn dark:text-neutral-200"> 011:00 AM </span> </label> <!-- End Checkbox --> <!-- Checkbox --> <label for="hs-pro-chhsncsramt12" class="rsqxb cc1ly flex a459h items-center nz7b4 zb2tq cursor-pointer m6q9e nwqzd has-[:checked]:bg-gray-200 qo2pb cbtmz dark:bg-neutral-800 dark:hover:bg-neutral-700 dark:has-[:checked]:bg-neutral-700"> <input type="radio" id="hs-pro-chhsncsramt12" class="hidden" value="012:00 AM" name="hs-pro-chhsncsramt" > <span class="block j7yil t4wtn dark:text-neutral-200"> 012:00 AM </span> </label> <!-- End Checkbox --> </fieldset> <fieldset class="w-full o4dae l0sxn"> <legend class="tuthn"> Custom date & time </legend> <!-- Checkbox --> <label for="hs-pro-chhsncsramt13" class="rsqxb cc1ly flex a459h items-center nz7b4 zb2tq cursor-pointer m6q9e nwqzd has-[:checked]:bg-gray-200 qo2pb cbtmz dark:bg-neutral-800 dark:hover:bg-neutral-700 dark:has-[:checked]:bg-neutral-700"> <input type="radio" id="hs-pro-chhsncsramt13" class="hidden" value="01:00 PM" name="hs-pro-chhsncsramt" > <span class="block j7yil t4wtn dark:text-neutral-200"> 01:00 PM </span> </label> <!-- End Checkbox --> <!-- Checkbox --> <label for="hs-pro-chhsncsramt14" class="rsqxb cc1ly flex a459h items-center nz7b4 zb2tq cursor-pointer m6q9e nwqzd has-[:checked]:bg-gray-200 qo2pb cbtmz dark:bg-neutral-800 dark:hover:bg-neutral-700 dark:has-[:checked]:bg-neutral-700"> <input type="radio" id="hs-pro-chhsncsramt14" class="hidden" value="02:00 PM" name="hs-pro-chhsncsramt" > <span class="block j7yil t4wtn dark:text-neutral-200"> 02:00 PM </span> </label> <!-- End Checkbox --> <!-- Checkbox --> <label for="hs-pro-chhsncsramt15" class="rsqxb cc1ly flex a459h items-center nz7b4 zb2tq cursor-pointer m6q9e nwqzd has-[:checked]:bg-gray-200 qo2pb cbtmz dark:bg-neutral-800 dark:hover:bg-neutral-700 dark:has-[:checked]:bg-neutral-700"> <input type="radio" id="hs-pro-chhsncsramt15" class="hidden" value="03:00 PM" name="hs-pro-chhsncsramt" > <span class="block j7yil t4wtn dark:text-neutral-200"> 03:00 PM </span> </label> <!-- End Checkbox --> <!-- Checkbox --> <label for="hs-pro-chhsncsramt16" class="rsqxb cc1ly flex a459h items-center nz7b4 zb2tq cursor-pointer m6q9e nwqzd has-[:checked]:bg-gray-200 qo2pb cbtmz dark:bg-neutral-800 dark:hover:bg-neutral-700 dark:has-[:checked]:bg-neutral-700"> <input type="radio" id="hs-pro-chhsncsramt16" class="hidden" value="04:00 PM" name="hs-pro-chhsncsramt" > <span class="block j7yil t4wtn dark:text-neutral-200"> 04:00 PM </span> </label> <!-- End Checkbox --> <!-- Checkbox --> <label for="hs-pro-chhsncsramt17" class="rsqxb cc1ly flex a459h items-center nz7b4 zb2tq cursor-pointer m6q9e nwqzd has-[:checked]:bg-gray-200 qo2pb cbtmz dark:bg-neutral-800 dark:hover:bg-neutral-700 dark:has-[:checked]:bg-neutral-700"> <input type="radio" id="hs-pro-chhsncsramt17" class="hidden" value="05:00 PM" name="hs-pro-chhsncsramt" > <span class="block j7yil t4wtn dark:text-neutral-200"> 05:00 PM </span> </label> <!-- End Checkbox --> <!-- Checkbox --> <label for="hs-pro-chhsncsramt18" class="rsqxb cc1ly flex a459h items-center nz7b4 zb2tq cursor-pointer m6q9e nwqzd has-[:checked]:bg-gray-200 qo2pb cbtmz dark:bg-neutral-800 dark:hover:bg-neutral-700 dark:has-[:checked]:bg-neutral-700"> <input type="radio" id="hs-pro-chhsncsramt18" class="hidden" value="06:00 PM" name="hs-pro-chhsncsramt" > <span class="block j7yil t4wtn dark:text-neutral-200"> 06:00 PM </span> </label> <!-- End Checkbox --> <!-- Checkbox --> <label for="hs-pro-chhsncsramt19" class="rsqxb cc1ly flex a459h items-center nz7b4 zb2tq cursor-pointer m6q9e nwqzd has-[:checked]:bg-gray-200 qo2pb cbtmz dark:bg-neutral-800 dark:hover:bg-neutral-700 dark:has-[:checked]:bg-neutral-700"> <input type="radio" id="hs-pro-chhsncsramt19" class="hidden" value="07:00 PM" name="hs-pro-chhsncsramt" > <span class="block j7yil t4wtn dark:text-neutral-200"> 07:00 PM </span> </label> <!-- End Checkbox --> <!-- Checkbox --> <label for="hs-pro-chhsncsramt20" class="rsqxb cc1ly flex a459h items-center nz7b4 zb2tq cursor-pointer m6q9e nwqzd has-[:checked]:bg-gray-200 qo2pb cbtmz dark:bg-neutral-800 dark:hover:bg-neutral-700 dark:has-[:checked]:bg-neutral-700"> <input type="radio" id="hs-pro-chhsncsramt20" class="hidden" value="08:00 PM" name="hs-pro-chhsncsramt" > <span class="block j7yil t4wtn dark:text-neutral-200"> 08:00 PM </span> </label> <!-- End Checkbox --> <!-- Checkbox --> <label for="hs-pro-chhsncsramt21" class="rsqxb cc1ly flex a459h items-center nz7b4 zb2tq cursor-pointer m6q9e nwqzd has-[:checked]:bg-gray-200 qo2pb cbtmz dark:bg-neutral-800 dark:hover:bg-neutral-700 dark:has-[:checked]:bg-neutral-700"> <input type="radio" id="hs-pro-chhsncsramt21" class="hidden" value="09:00 PM" name="hs-pro-chhsncsramt" > <span class="block j7yil t4wtn dark:text-neutral-200"> 09:00 PM </span> </label> <!-- End Checkbox --> <!-- Checkbox --> <label for="hs-pro-chhsncsramt22" class="rsqxb cc1ly flex a459h items-center nz7b4 zb2tq cursor-pointer m6q9e nwqzd has-[:checked]:bg-gray-200 qo2pb cbtmz dark:bg-neutral-800 dark:hover:bg-neutral-700 dark:has-[:checked]:bg-neutral-700"> <input type="radio" id="hs-pro-chhsncsramt22" class="hidden" value="010:00 PM" name="hs-pro-chhsncsramt" > <span class="block j7yil t4wtn dark:text-neutral-200"> 010:00 PM </span> </label> <!-- End Checkbox --> <!-- Checkbox --> <label for="hs-pro-chhsncsramt23" class="rsqxb cc1ly flex a459h items-center nz7b4 zb2tq cursor-pointer m6q9e nwqzd has-[:checked]:bg-gray-200 qo2pb cbtmz dark:bg-neutral-800 dark:hover:bg-neutral-700 dark:has-[:checked]:bg-neutral-700"> <input type="radio" id="hs-pro-chhsncsramt23" class="hidden" value="011:00 PM" name="hs-pro-chhsncsramt" > <span class="block j7yil t4wtn dark:text-neutral-200"> 011:00 PM </span> </label> <!-- End Checkbox --> <!-- Checkbox --> <label for="hs-pro-chhsncsramt24" class="rsqxb cc1ly flex a459h items-center nz7b4 zb2tq cursor-pointer m6q9e nwqzd has-[:checked]:bg-gray-200 qo2pb cbtmz dark:bg-neutral-800 dark:hover:bg-neutral-700 dark:has-[:checked]:bg-neutral-700"> <input type="radio" id="hs-pro-chhsncsramt24" class="hidden" value="012:00 PM" name="hs-pro-chhsncsramt" > <span class="block j7yil t4wtn dark:text-neutral-200"> 012:00 PM </span> </label> <!-- End Checkbox --> </fieldset> </div> </div> <!-- End Body --> <!-- Footer --> <div class="avnhm"> <div class="tjm3z x7giz trjok flex fa4f9 items-center klk5r c0n9n khwhk dark:border-neutral-700"> <div class="w-full"> <span class="lpi99 l1oxk block egssd f5wd6 dark:text-neutral-400"> Date </span> <!-- Calendar Dropdown --> <div class="hs-dropdown [--auto-close:inside] rl1tg w-full"> <button id="hs-pro-dnic" type="button" class="jxbdw w-full rl1tg items-center egssd zd5ha zb2tq qm5z2 ftfcy o7p0z t4wtn nwqzd iec4s haq8z t4rxa b3tqx dark:bg-neutral-700 dark:border-transparent dark:text-neutral-300 dark:hover:bg-neutral-600 dark:focus:bg-neutral-600" aria-haspopup="menu" aria-expanded="false" aria-label="Dropdown"> <svg class="xqknn ymp3r ccfki" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect width="18" height="18" x="3" y="4" rx="2" ry="2"/><line x1="16" x2="16" y1="2" y2="6"/><line x1="8" x2="8" y1="2" y2="6"/><line x1="3" x2="21" y1="10" y2="10"/><path d="M8 14h.01"/><path d="M12 14h.01"/><path d="M16 14h.01"/><path d="M8 18h.01"/><path d="M12 18h.01"/><path d="M16 18h.01"/></svg> 07/05/2024 </button> <div class="hs-dropdown-menu hs-dropdown-open:opacity-100 av2mg transition-[opacity,margin] duration opacity-0 hidden w4j19 nz7b4 u33oi shadow-[0_10px_40px_10px_rgba(0,0,0,0.08)] dark:shadow-[0_10px_40px_10px_rgba(0,0,0,0.2)] dark:bg-neutral-900" role="menu" aria-orientation="vertical" aria-labelledby="hs-pro-dnic"> <!-- Calendar --> <div class="ogll8 shme7"> <!-- Months --> <div class="o4dae ay7t5 items-center hwu3o e8r64 avnhm"> <!-- Prev Button --> <div class="bbqht"> <button type="button" class="j1mw5 flex a459h items-center t4wtn x8k6f icuyk iec4s haq8z t4rxa c2pts dark:text-neutral-400 dark:hover:bg-neutral-800 dark:focus:bg-neutral-800" aria-label="Previous"> <svg class="xqknn d681g" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m15 18-6-6 6-6"/></svg> </button> </div> <!-- End Prev Button --> <!-- Month / Year --> <div class="a5q9z flex a459h items-center o9jhx"> <div class="relative"> <select data-hs-select='{ "placeholder": "Select month", "toggleTag": "<button type=\"button\" aria-expanded=\"false\"></button>", "toggleClasses": "hs-select-disabled:pointer-events-none hs-select-disabled:opacity-50 relative flex j5skf w-full cursor-pointer gxh7t zd5ha t4wtn vfm71 t4rxa u6giu v6hfb dbpp0 o0htc dark:text-neutral-200 dark:hover:text-blue-500 dark:focus:text-blue-500", "dropdownClasses": "vvl4w w4j19 l9eni tfx8w aqh96 shme7 nz7b4 qm5z2 khwhk zb2tq v1x81 wcomx a17xw sh48p ygi9h wv8uu wt1jo dark:[&::-webkit-scrollbar-track]:bg-neutral-700 dark:[&::-webkit-scrollbar-thumb]:bg-neutral-500 dark:bg-neutral-900 dark:border-neutral-700", "optionClasses": "jxbdw w-full a3wk8 t4wtn cursor-pointer x8k6f zb2tq t4rxa c2pts dark:bg-neutral-900 dark:hover:bg-neutral-800 dark:text-neutral-200 dark:focus:bg-neutral-800", "optionTemplate": "<div class=\"flex fa4f9 items-center w-full \"><span data-title></span><span class=\"hidden hs-selected:block \"><svg class=\"xqknn ccfki t4wtn dark:text-neutral-200 \" xmlns=\"http:.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><polyline points=\"20 6 9 17 4 12\"/></svg></span></div>" }' class="hidden"> <option value="0">January</option> <option value="1">February</option> <option value="2">March</option> <option value="3">April</option> <option value="4">May</option> <option value="5">June</option> <option value="6" selected>July</option> <option value="7">August</option> <option value="8">September</option> <option value="9">October</option> <option value="10">November</option> <option value="11">December</option> </select> </div> <span class="t4wtn dark:text-neutral-200">/</span> <div class="relative"> <select data-hs-select='{ "placeholder": "Select year", "toggleTag": "<button type=\"button\" aria-expanded=\"false\"></button>", "toggleClasses": "hs-select-disabled:pointer-events-none hs-select-disabled:opacity-50 relative flex j5skf w-full cursor-pointer gxh7t zd5ha t4wtn vfm71 t4rxa u6giu v6hfb dbpp0 o0htc dark:text-neutral-200 dark:hover:text-blue-500 dark:focus:text-blue-500", "dropdownClasses": "vvl4w w4j19 od2ao tfx8w aqh96 shme7 nz7b4 qm5z2 khwhk zb2tq v1x81 wcomx a17xw sh48p ygi9h wv8uu wt1jo dark:[&::-webkit-scrollbar-track]:bg-neutral-700 dark:[&::-webkit-scrollbar-thumb]:bg-neutral-500 dark:bg-neutral-900 dark:border-neutral-700", "optionClasses": "jxbdw w-full a3wk8 t4wtn cursor-pointer x8k6f zb2tq t4rxa c2pts dark:bg-neutral-900 dark:hover:bg-neutral-800 dark:text-neutral-200 dark:focus:bg-neutral-800", "optionTemplate": "<div class=\"flex fa4f9 items-center w-full \"><span data-title></span><span class=\"hidden hs-selected:block \"><svg class=\"xqknn ccfki t4wtn dark:text-neutral-200 \" xmlns=\"http:.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><polyline points=\"20 6 9 17 4 12\"/></svg></span></div>" }' class="hidden"> <option selected>2023</option> <option>2024</option> <option>2025</option> <option>2026</option> <option>2027</option> </select> </div> </div> <!-- End Month / Year --> <!-- Next Button --> <div class="bbqht flex f5dbk"> <button type="button" class=" j1mw5 flex a459h items-center t4wtn x8k6f icuyk iec4s haq8z t4rxa c2pts dark:text-neutral-400 dark:hover:bg-neutral-800 dark:focus:bg-neutral-800" aria-label="Next"> <svg class="xqknn d681g" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m9 18 6-6-6-6"/></svg> </button> </div> <!-- End Next Button --> </div> <!-- Months --> <!-- Weeks --> <div class="flex cqbvv"> <span class="whmww bwtk8 block iieae a3wk8 kugle dark:text-neutral-500"> Mo </span> <span class="whmww bwtk8 block iieae a3wk8 kugle dark:text-neutral-500"> Tu </span> <span class="whmww bwtk8 block iieae a3wk8 kugle dark:text-neutral-500"> We </span> <span class="whmww bwtk8 block iieae a3wk8 kugle dark:text-neutral-500"> Th </span> <span class="whmww bwtk8 block iieae a3wk8 kugle dark:text-neutral-500"> Fr </span> <span class="whmww bwtk8 block iieae a3wk8 kugle dark:text-neutral-500"> Sa </span> <span class="whmww bwtk8 block iieae a3wk8 kugle dark:text-neutral-500"> Su </span> </div> <!-- Weeks --> <!-- Days --> <div class="flex"> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200" disabled> 26 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200" disabled> 27 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200" disabled> 28 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200" disabled> 29 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200" disabled> 30 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200"> 1 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200"> 2 </button> </div> </div> <!-- Days --> <!-- Days --> <div class="flex"> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200"> 3 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200"> 4 </button> </div> <div > <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200"> 5 </button> </div> <div > <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200"> 6 </button> </div> <div > <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200"> 7 </button> </div> <div > <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200"> 8 </button> </div> <div > <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200"> 9 </button> </div> </div> <!-- Days --> <!-- Days --> <div class="flex"> <div > <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200"> 10 </button> </div> <div > <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200"> 11 </button> </div> <div > <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200"> 12 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200"> 13 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200"> 14 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200"> 15 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200"> 16 </button> </div> </div> <!-- Days --> <!-- Days --> <div class="flex"> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200"> 17 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200"> 18 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200"> 19 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center ob5sd qm5z2 ftfcy a3wk8 zd5ha txh0b wo9uq icuyk dark:bg-blue-500 iec4s haq8z t4rxa c2pts dark:hover:border-neutral-700"> 20 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200"> 21 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200"> 22 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200"> 23 </button> </div> </div> <!-- Days --> <!-- Days --> <div class="flex"> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200"> 24 </button> </div> <div > <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200"> 25 </button> </div> <div > <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200"> 26 </button> </div> <div > <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200"> 27 </button> </div> <div > <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200"> 28 </button> </div> <div > <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200"> 29 </button> </div> <div > <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200"> 30 </button> </div> </div> <!-- Days --> <!-- Days --> <div class="flex"> <div > <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200"> 31 </button> </div> <div > <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn wo9uq vfm71 icuyk iec4s haq8z t4rxa c2pts dark:text-neutral-200 dark:hover:border-neutral-500 dark:focus:bg-neutral-700" disabled> 1 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn wo9uq vfm71 icuyk iec4s haq8z t4rxa c2pts dark:text-neutral-200 dark:hover:border-neutral-500 dark:focus:bg-neutral-700" disabled> 2 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn wo9uq vfm71 icuyk iec4s haq8z t4rxa c2pts dark:text-neutral-200 dark:hover:border-neutral-500 dark:focus:bg-neutral-700" disabled> 3 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn wo9uq vfm71 icuyk iec4s haq8z t4rxa c2pts dark:text-neutral-200 dark:hover:border-neutral-500 dark:focus:bg-neutral-700" disabled> 4 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn wo9uq vfm71 icuyk iec4s haq8z t4rxa c2pts dark:text-neutral-200 dark:hover:border-neutral-500 dark:focus:bg-neutral-700" disabled> 5 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn wo9uq vfm71 icuyk iec4s haq8z t4rxa c2pts dark:text-neutral-200 dark:hover:border-neutral-500 dark:focus:bg-neutral-700" disabled> 6 </button> </div> </div> <!-- Days --> </div> </div> </div> </div> <!-- End Calendar Dropdown --> <!-- Input --> <div class="w-full"> <label for="hs-pro-chhsncstm" class="lpi99 l1oxk block egssd f5wd6 dark:text-neutral-400"> Time </label> <input type="text" class="p65gp vo9dv block w-full o7p0z ftfcy m6q9e egssd xkisd awvey nwqzd b50zm iec4s haq8z b3tqx owwub mwsh2 dark:text-neutral-400 dark:bg-neutral-700 dark:text-neutral-300 dark:placeholder:text-neutral-500 dark:hover:bg-neutral-600 dark:focus:bg-neutral-600" id="hs-pro-chhsncstm" value="9:00 AM"> </div> <!-- End Input --> </div> <div class="d3qt8 x7giz"> <div class="z9yef flex f5dbk items-center sapo1"> <button type="button" class="rsqxb cc1ly j5skf rl1tg a459h items-center gxh7t nz7b4 qm5z2 khwhk t4wtn egssd zd5ha zb2tq fwpr6 oewy0 w8bqc iec4s haq8z dark:bg-neutral-800 dark:border-neutral-700 dark:text-neutral-300 dark:hover:bg-neutral-700 dark:focus:bg-neutral-700" data-hs-overlay="#hs-pro-chhsncs"> Cancel </button> <button type="button" class="rsqxb cc1ly j5skf rl1tg a459h items-center klk5r gxh7t ob5sd qm5z2 zranc txh0b egssd zd5ha zb2tq fwpr6 oewy0 hs3rw iec4s haq8z t4rxa mqwez zvcaz dark:focus:ring-blue-500" data-hs-overlay="#hs-pro-chhsncs"> Snooze </button> </div> </div> </div> <!-- End Footer --> </div> </div> </div> <!-- End Archive Message Modal --> <script src="../../assets/vendor/preline/dist/index.js?v=1.0.0"></script> </body> </html> <script src="../../scripts/js/open-modals-on-init.js"></script>
<!-- Archive Message Modal --> <div id="hs-pro-chhsncs" class="hs-overlay hidden p8r3t fixed vemhv vvp3o wkjxl mjyak a17xw [--close-when-click-inside:true] xg820" role="dialog" tabindex="-1" aria-labelledby="hs-pro-chhsncs-label"> <div class="hs-overlay-open:mt-7 hs-overlay-open:opacity-100 hs-overlay-open:duration-500 cu00e opacity-0 atv3v gyfl6 s2xvr jpgrs a2vl5 w43l1 h-[calc(100%-3.5rem)] min-h-[calc(100%-3.5rem)] flex items-center"> <div class="w-full j9aoa wcomx flex ao3ns nz7b4 u33oi apxxd shadow-[0_10px_40px_10px_rgba(0,0,0,0.08)] dark:shadow-[0_10px_40px_10px_rgba(0,0,0,0.2)] dark:bg-neutral-800"> <!-- Header --> <div class="tjm3z x7giz flex fa4f9 items-center bm6ej khwhk dark:border-neutral-700"> <button type="button" class="j1mw5 rl1tg a459h items-center klk5r icuyk qm5z2 ftfcy nz7b4 t4wtn x8k6f t4rxa c2pts iec4s haq8z dark:bg-neutral-800 dark:hover:bg-neutral-700 dark:text-neutral-400 dark:focus:bg-neutral-700" data-hs-overlay="#hs-pro-chhsn"> <span class="tuthn">Back</span> <svg class="xqknn d681g" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m15 18-6-6 6-6"/></svg> </button> <h3 id="hs-pro-chhsncs-label" class="lno3i t4wtn dark:text-neutral-200"> Custom date & time </h3> <button type="button" class="j1mw5 rl1tg a459h items-center klk5r icuyk qm5z2 ftfcy o7p0z t4wtn nwqzd t4rxa b3tqx iec4s haq8z dark:bg-neutral-700 dark:hover:bg-neutral-600 dark:text-neutral-400 dark:focus:bg-neutral-600" aria-label="Close" data-hs-overlay="#hs-pro-chhsncs"> <svg class="xqknn d681g" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M18 6 6 18"/><path d="m6 6 12 12"/></svg> <span class="tuthn">Close</span> </button> </div> <!-- End Header --> <!-- Body --> <div class="aqh96 g7f0s a17xw sh48p ygi9h wv8uu wt1jo dark:[&::-webkit-scrollbar-track]:bg-neutral-700 dark:[&::-webkit-scrollbar-thumb]:bg-neutral-500"> <div class="flex fa4f9 o9jhx"> <fieldset class="w-full o4dae l0sxn"> <legend class="tuthn"> Custom date & time </legend> <!-- Checkbox --> <label for="hs-pro-chhsncsramt1" class="rsqxb cc1ly flex a459h items-center nz7b4 zb2tq cursor-pointer m6q9e nwqzd has-[:checked]:bg-gray-200 qo2pb cbtmz dark:bg-neutral-800 dark:hover:bg-neutral-700 dark:has-[:checked]:bg-neutral-700"> <input type="radio" id="hs-pro-chhsncsramt1" class="hidden" value="01:00 AM" name="hs-pro-chhsncsramt" checked> <span class="block j7yil t4wtn dark:text-neutral-200"> 01:00 AM </span> </label> <!-- End Checkbox --> <!-- Checkbox --> <label for="hs-pro-chhsncsramt2" class="rsqxb cc1ly flex a459h items-center nz7b4 zb2tq cursor-pointer m6q9e nwqzd has-[:checked]:bg-gray-200 qo2pb cbtmz dark:bg-neutral-800 dark:hover:bg-neutral-700 dark:has-[:checked]:bg-neutral-700"> <input type="radio" id="hs-pro-chhsncsramt2" class="hidden" value="02:00 AM" name="hs-pro-chhsncsramt" > <span class="block j7yil t4wtn dark:text-neutral-200"> 02:00 AM </span> </label> <!-- End Checkbox --> <!-- Checkbox --> <label for="hs-pro-chhsncsramt3" class="rsqxb cc1ly flex a459h items-center nz7b4 zb2tq cursor-pointer m6q9e nwqzd has-[:checked]:bg-gray-200 qo2pb cbtmz dark:bg-neutral-800 dark:hover:bg-neutral-700 dark:has-[:checked]:bg-neutral-700"> <input type="radio" id="hs-pro-chhsncsramt3" class="hidden" value="03:00 AM" name="hs-pro-chhsncsramt" > <span class="block j7yil t4wtn dark:text-neutral-200"> 03:00 AM </span> </label> <!-- End Checkbox --> <!-- Checkbox --> <label for="hs-pro-chhsncsramt4" class="rsqxb cc1ly flex a459h items-center nz7b4 zb2tq cursor-pointer m6q9e nwqzd has-[:checked]:bg-gray-200 qo2pb cbtmz dark:bg-neutral-800 dark:hover:bg-neutral-700 dark:has-[:checked]:bg-neutral-700"> <input type="radio" id="hs-pro-chhsncsramt4" class="hidden" value="04:00 AM" name="hs-pro-chhsncsramt" > <span class="block j7yil t4wtn dark:text-neutral-200"> 04:00 AM </span> </label> <!-- End Checkbox --> <!-- Checkbox --> <label for="hs-pro-chhsncsramt5" class="rsqxb cc1ly flex a459h items-center nz7b4 zb2tq cursor-pointer m6q9e nwqzd has-[:checked]:bg-gray-200 qo2pb cbtmz dark:bg-neutral-800 dark:hover:bg-neutral-700 dark:has-[:checked]:bg-neutral-700"> <input type="radio" id="hs-pro-chhsncsramt5" class="hidden" value="05:00 AM" name="hs-pro-chhsncsramt" > <span class="block j7yil t4wtn dark:text-neutral-200"> 05:00 AM </span> </label> <!-- End Checkbox --> <!-- Checkbox --> <label for="hs-pro-chhsncsramt6" class="rsqxb cc1ly flex a459h items-center nz7b4 zb2tq cursor-pointer m6q9e nwqzd has-[:checked]:bg-gray-200 qo2pb cbtmz dark:bg-neutral-800 dark:hover:bg-neutral-700 dark:has-[:checked]:bg-neutral-700"> <input type="radio" id="hs-pro-chhsncsramt6" class="hidden" value="06:00 AM" name="hs-pro-chhsncsramt" > <span class="block j7yil t4wtn dark:text-neutral-200"> 06:00 AM </span> </label> <!-- End Checkbox --> <!-- Checkbox --> <label for="hs-pro-chhsncsramt7" class="rsqxb cc1ly flex a459h items-center nz7b4 zb2tq cursor-pointer m6q9e nwqzd has-[:checked]:bg-gray-200 qo2pb cbtmz dark:bg-neutral-800 dark:hover:bg-neutral-700 dark:has-[:checked]:bg-neutral-700"> <input type="radio" id="hs-pro-chhsncsramt7" class="hidden" value="07:00 AM" name="hs-pro-chhsncsramt" > <span class="block j7yil t4wtn dark:text-neutral-200"> 07:00 AM </span> </label> <!-- End Checkbox --> <!-- Checkbox --> <label for="hs-pro-chhsncsramt8" class="rsqxb cc1ly flex a459h items-center nz7b4 zb2tq cursor-pointer m6q9e nwqzd has-[:checked]:bg-gray-200 qo2pb cbtmz dark:bg-neutral-800 dark:hover:bg-neutral-700 dark:has-[:checked]:bg-neutral-700"> <input type="radio" id="hs-pro-chhsncsramt8" class="hidden" value="08:00 AM" name="hs-pro-chhsncsramt" > <span class="block j7yil t4wtn dark:text-neutral-200"> 08:00 AM </span> </label> <!-- End Checkbox --> <!-- Checkbox --> <label for="hs-pro-chhsncsramt9" class="rsqxb cc1ly flex a459h items-center nz7b4 zb2tq cursor-pointer m6q9e nwqzd has-[:checked]:bg-gray-200 qo2pb cbtmz dark:bg-neutral-800 dark:hover:bg-neutral-700 dark:has-[:checked]:bg-neutral-700"> <input type="radio" id="hs-pro-chhsncsramt9" class="hidden" value="09:00 AM" name="hs-pro-chhsncsramt" > <span class="block j7yil t4wtn dark:text-neutral-200"> 09:00 AM </span> </label> <!-- End Checkbox --> <!-- Checkbox --> <label for="hs-pro-chhsncsramt10" class="rsqxb cc1ly flex a459h items-center nz7b4 zb2tq cursor-pointer m6q9e nwqzd has-[:checked]:bg-gray-200 qo2pb cbtmz dark:bg-neutral-800 dark:hover:bg-neutral-700 dark:has-[:checked]:bg-neutral-700"> <input type="radio" id="hs-pro-chhsncsramt10" class="hidden" value="010:00 AM" name="hs-pro-chhsncsramt" > <span class="block j7yil t4wtn dark:text-neutral-200"> 010:00 AM </span> </label> <!-- End Checkbox --> <!-- Checkbox --> <label for="hs-pro-chhsncsramt11" class="rsqxb cc1ly flex a459h items-center nz7b4 zb2tq cursor-pointer m6q9e nwqzd has-[:checked]:bg-gray-200 qo2pb cbtmz dark:bg-neutral-800 dark:hover:bg-neutral-700 dark:has-[:checked]:bg-neutral-700"> <input type="radio" id="hs-pro-chhsncsramt11" class="hidden" value="011:00 AM" name="hs-pro-chhsncsramt" > <span class="block j7yil t4wtn dark:text-neutral-200"> 011:00 AM </span> </label> <!-- End Checkbox --> <!-- Checkbox --> <label for="hs-pro-chhsncsramt12" class="rsqxb cc1ly flex a459h items-center nz7b4 zb2tq cursor-pointer m6q9e nwqzd has-[:checked]:bg-gray-200 qo2pb cbtmz dark:bg-neutral-800 dark:hover:bg-neutral-700 dark:has-[:checked]:bg-neutral-700"> <input type="radio" id="hs-pro-chhsncsramt12" class="hidden" value="012:00 AM" name="hs-pro-chhsncsramt" > <span class="block j7yil t4wtn dark:text-neutral-200"> 012:00 AM </span> </label> <!-- End Checkbox --> </fieldset> <fieldset class="w-full o4dae l0sxn"> <legend class="tuthn"> Custom date & time </legend> <!-- Checkbox --> <label for="hs-pro-chhsncsramt13" class="rsqxb cc1ly flex a459h items-center nz7b4 zb2tq cursor-pointer m6q9e nwqzd has-[:checked]:bg-gray-200 qo2pb cbtmz dark:bg-neutral-800 dark:hover:bg-neutral-700 dark:has-[:checked]:bg-neutral-700"> <input type="radio" id="hs-pro-chhsncsramt13" class="hidden" value="01:00 PM" name="hs-pro-chhsncsramt" > <span class="block j7yil t4wtn dark:text-neutral-200"> 01:00 PM </span> </label> <!-- End Checkbox --> <!-- Checkbox --> <label for="hs-pro-chhsncsramt14" class="rsqxb cc1ly flex a459h items-center nz7b4 zb2tq cursor-pointer m6q9e nwqzd has-[:checked]:bg-gray-200 qo2pb cbtmz dark:bg-neutral-800 dark:hover:bg-neutral-700 dark:has-[:checked]:bg-neutral-700"> <input type="radio" id="hs-pro-chhsncsramt14" class="hidden" value="02:00 PM" name="hs-pro-chhsncsramt" > <span class="block j7yil t4wtn dark:text-neutral-200"> 02:00 PM </span> </label> <!-- End Checkbox --> <!-- Checkbox --> <label for="hs-pro-chhsncsramt15" class="rsqxb cc1ly flex a459h items-center nz7b4 zb2tq cursor-pointer m6q9e nwqzd has-[:checked]:bg-gray-200 qo2pb cbtmz dark:bg-neutral-800 dark:hover:bg-neutral-700 dark:has-[:checked]:bg-neutral-700"> <input type="radio" id="hs-pro-chhsncsramt15" class="hidden" value="03:00 PM" name="hs-pro-chhsncsramt" > <span class="block j7yil t4wtn dark:text-neutral-200"> 03:00 PM </span> </label> <!-- End Checkbox --> <!-- Checkbox --> <label for="hs-pro-chhsncsramt16" class="rsqxb cc1ly flex a459h items-center nz7b4 zb2tq cursor-pointer m6q9e nwqzd has-[:checked]:bg-gray-200 qo2pb cbtmz dark:bg-neutral-800 dark:hover:bg-neutral-700 dark:has-[:checked]:bg-neutral-700"> <input type="radio" id="hs-pro-chhsncsramt16" class="hidden" value="04:00 PM" name="hs-pro-chhsncsramt" > <span class="block j7yil t4wtn dark:text-neutral-200"> 04:00 PM </span> </label> <!-- End Checkbox --> <!-- Checkbox --> <label for="hs-pro-chhsncsramt17" class="rsqxb cc1ly flex a459h items-center nz7b4 zb2tq cursor-pointer m6q9e nwqzd has-[:checked]:bg-gray-200 qo2pb cbtmz dark:bg-neutral-800 dark:hover:bg-neutral-700 dark:has-[:checked]:bg-neutral-700"> <input type="radio" id="hs-pro-chhsncsramt17" class="hidden" value="05:00 PM" name="hs-pro-chhsncsramt" > <span class="block j7yil t4wtn dark:text-neutral-200"> 05:00 PM </span> </label> <!-- End Checkbox --> <!-- Checkbox --> <label for="hs-pro-chhsncsramt18" class="rsqxb cc1ly flex a459h items-center nz7b4 zb2tq cursor-pointer m6q9e nwqzd has-[:checked]:bg-gray-200 qo2pb cbtmz dark:bg-neutral-800 dark:hover:bg-neutral-700 dark:has-[:checked]:bg-neutral-700"> <input type="radio" id="hs-pro-chhsncsramt18" class="hidden" value="06:00 PM" name="hs-pro-chhsncsramt" > <span class="block j7yil t4wtn dark:text-neutral-200"> 06:00 PM </span> </label> <!-- End Checkbox --> <!-- Checkbox --> <label for="hs-pro-chhsncsramt19" class="rsqxb cc1ly flex a459h items-center nz7b4 zb2tq cursor-pointer m6q9e nwqzd has-[:checked]:bg-gray-200 qo2pb cbtmz dark:bg-neutral-800 dark:hover:bg-neutral-700 dark:has-[:checked]:bg-neutral-700"> <input type="radio" id="hs-pro-chhsncsramt19" class="hidden" value="07:00 PM" name="hs-pro-chhsncsramt" > <span class="block j7yil t4wtn dark:text-neutral-200"> 07:00 PM </span> </label> <!-- End Checkbox --> <!-- Checkbox --> <label for="hs-pro-chhsncsramt20" class="rsqxb cc1ly flex a459h items-center nz7b4 zb2tq cursor-pointer m6q9e nwqzd has-[:checked]:bg-gray-200 qo2pb cbtmz dark:bg-neutral-800 dark:hover:bg-neutral-700 dark:has-[:checked]:bg-neutral-700"> <input type="radio" id="hs-pro-chhsncsramt20" class="hidden" value="08:00 PM" name="hs-pro-chhsncsramt" > <span class="block j7yil t4wtn dark:text-neutral-200"> 08:00 PM </span> </label> <!-- End Checkbox --> <!-- Checkbox --> <label for="hs-pro-chhsncsramt21" class="rsqxb cc1ly flex a459h items-center nz7b4 zb2tq cursor-pointer m6q9e nwqzd has-[:checked]:bg-gray-200 qo2pb cbtmz dark:bg-neutral-800 dark:hover:bg-neutral-700 dark:has-[:checked]:bg-neutral-700"> <input type="radio" id="hs-pro-chhsncsramt21" class="hidden" value="09:00 PM" name="hs-pro-chhsncsramt" > <span class="block j7yil t4wtn dark:text-neutral-200"> 09:00 PM </span> </label> <!-- End Checkbox --> <!-- Checkbox --> <label for="hs-pro-chhsncsramt22" class="rsqxb cc1ly flex a459h items-center nz7b4 zb2tq cursor-pointer m6q9e nwqzd has-[:checked]:bg-gray-200 qo2pb cbtmz dark:bg-neutral-800 dark:hover:bg-neutral-700 dark:has-[:checked]:bg-neutral-700"> <input type="radio" id="hs-pro-chhsncsramt22" class="hidden" value="010:00 PM" name="hs-pro-chhsncsramt" > <span class="block j7yil t4wtn dark:text-neutral-200"> 010:00 PM </span> </label> <!-- End Checkbox --> <!-- Checkbox --> <label for="hs-pro-chhsncsramt23" class="rsqxb cc1ly flex a459h items-center nz7b4 zb2tq cursor-pointer m6q9e nwqzd has-[:checked]:bg-gray-200 qo2pb cbtmz dark:bg-neutral-800 dark:hover:bg-neutral-700 dark:has-[:checked]:bg-neutral-700"> <input type="radio" id="hs-pro-chhsncsramt23" class="hidden" value="011:00 PM" name="hs-pro-chhsncsramt" > <span class="block j7yil t4wtn dark:text-neutral-200"> 011:00 PM </span> </label> <!-- End Checkbox --> <!-- Checkbox --> <label for="hs-pro-chhsncsramt24" class="rsqxb cc1ly flex a459h items-center nz7b4 zb2tq cursor-pointer m6q9e nwqzd has-[:checked]:bg-gray-200 qo2pb cbtmz dark:bg-neutral-800 dark:hover:bg-neutral-700 dark:has-[:checked]:bg-neutral-700"> <input type="radio" id="hs-pro-chhsncsramt24" class="hidden" value="012:00 PM" name="hs-pro-chhsncsramt" > <span class="block j7yil t4wtn dark:text-neutral-200"> 012:00 PM </span> </label> <!-- End Checkbox --> </fieldset> </div> </div> <!-- End Body --> <!-- Footer --> <div class="avnhm"> <div class="tjm3z x7giz trjok flex fa4f9 items-center klk5r c0n9n khwhk dark:border-neutral-700"> <div class="w-full"> <span class="lpi99 l1oxk block egssd f5wd6 dark:text-neutral-400"> Date </span> <!-- Calendar Dropdown --> <div class="hs-dropdown [--auto-close:inside] rl1tg w-full"> <button id="hs-pro-dnic" type="button" class="jxbdw w-full rl1tg items-center egssd zd5ha zb2tq qm5z2 ftfcy o7p0z t4wtn nwqzd iec4s haq8z t4rxa b3tqx dark:bg-neutral-700 dark:border-transparent dark:text-neutral-300 dark:hover:bg-neutral-600 dark:focus:bg-neutral-600" aria-haspopup="menu" aria-expanded="false" aria-label="Dropdown"> <svg class="xqknn ymp3r ccfki" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect width="18" height="18" x="3" y="4" rx="2" ry="2"/><line x1="16" x2="16" y1="2" y2="6"/><line x1="8" x2="8" y1="2" y2="6"/><line x1="3" x2="21" y1="10" y2="10"/><path d="M8 14h.01"/><path d="M12 14h.01"/><path d="M16 14h.01"/><path d="M8 18h.01"/><path d="M12 18h.01"/><path d="M16 18h.01"/></svg> 07/05/2024 </button> <div class="hs-dropdown-menu hs-dropdown-open:opacity-100 av2mg transition-[opacity,margin] duration opacity-0 hidden w4j19 nz7b4 u33oi shadow-[0_10px_40px_10px_rgba(0,0,0,0.08)] dark:shadow-[0_10px_40px_10px_rgba(0,0,0,0.2)] dark:bg-neutral-900" role="menu" aria-orientation="vertical" aria-labelledby="hs-pro-dnic"> <!-- Calendar --> <div class="ogll8 shme7"> <!-- Months --> <div class="o4dae ay7t5 items-center hwu3o e8r64 avnhm"> <!-- Prev Button --> <div class="bbqht"> <button type="button" class="j1mw5 flex a459h items-center t4wtn x8k6f icuyk iec4s haq8z t4rxa c2pts dark:text-neutral-400 dark:hover:bg-neutral-800 dark:focus:bg-neutral-800" aria-label="Previous"> <svg class="xqknn d681g" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m15 18-6-6 6-6"/></svg> </button> </div> <!-- End Prev Button --> <!-- Month / Year --> <div class="a5q9z flex a459h items-center o9jhx"> <div class="relative"> <select data-hs-select='{ "placeholder": "Select month", "toggleTag": "<button type=\"button\" aria-expanded=\"false\"></button>", "toggleClasses": "hs-select-disabled:pointer-events-none hs-select-disabled:opacity-50 relative flex j5skf w-full cursor-pointer gxh7t zd5ha t4wtn vfm71 t4rxa u6giu v6hfb dbpp0 o0htc dark:text-neutral-200 dark:hover:text-blue-500 dark:focus:text-blue-500", "dropdownClasses": "vvl4w w4j19 l9eni tfx8w aqh96 shme7 nz7b4 qm5z2 khwhk zb2tq v1x81 wcomx a17xw sh48p ygi9h wv8uu wt1jo dark:[&::-webkit-scrollbar-track]:bg-neutral-700 dark:[&::-webkit-scrollbar-thumb]:bg-neutral-500 dark:bg-neutral-900 dark:border-neutral-700", "optionClasses": "jxbdw w-full a3wk8 t4wtn cursor-pointer x8k6f zb2tq t4rxa c2pts dark:bg-neutral-900 dark:hover:bg-neutral-800 dark:text-neutral-200 dark:focus:bg-neutral-800", "optionTemplate": "<div class=\"flex fa4f9 items-center w-full \"><span data-title></span><span class=\"hidden hs-selected:block \"><svg class=\"xqknn ccfki t4wtn dark:text-neutral-200 \" xmlns=\"http:.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><polyline points=\"20 6 9 17 4 12\"/></svg></span></div>" }' class="hidden"> <option value="0">January</option> <option value="1">February</option> <option value="2">March</option> <option value="3">April</option> <option value="4">May</option> <option value="5">June</option> <option value="6" selected>July</option> <option value="7">August</option> <option value="8">September</option> <option value="9">October</option> <option value="10">November</option> <option value="11">December</option> </select> </div> <span class="t4wtn dark:text-neutral-200">/</span> <div class="relative"> <select data-hs-select='{ "placeholder": "Select year", "toggleTag": "<button type=\"button\" aria-expanded=\"false\"></button>", "toggleClasses": "hs-select-disabled:pointer-events-none hs-select-disabled:opacity-50 relative flex j5skf w-full cursor-pointer gxh7t zd5ha t4wtn vfm71 t4rxa u6giu v6hfb dbpp0 o0htc dark:text-neutral-200 dark:hover:text-blue-500 dark:focus:text-blue-500", "dropdownClasses": "vvl4w w4j19 od2ao tfx8w aqh96 shme7 nz7b4 qm5z2 khwhk zb2tq v1x81 wcomx a17xw sh48p ygi9h wv8uu wt1jo dark:[&::-webkit-scrollbar-track]:bg-neutral-700 dark:[&::-webkit-scrollbar-thumb]:bg-neutral-500 dark:bg-neutral-900 dark:border-neutral-700", "optionClasses": "jxbdw w-full a3wk8 t4wtn cursor-pointer x8k6f zb2tq t4rxa c2pts dark:bg-neutral-900 dark:hover:bg-neutral-800 dark:text-neutral-200 dark:focus:bg-neutral-800", "optionTemplate": "<div class=\"flex fa4f9 items-center w-full \"><span data-title></span><span class=\"hidden hs-selected:block \"><svg class=\"xqknn ccfki t4wtn dark:text-neutral-200 \" xmlns=\"http:.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><polyline points=\"20 6 9 17 4 12\"/></svg></span></div>" }' class="hidden"> <option selected>2023</option> <option>2024</option> <option>2025</option> <option>2026</option> <option>2027</option> </select> </div> </div> <!-- End Month / Year --> <!-- Next Button --> <div class="bbqht flex f5dbk"> <button type="button" class=" j1mw5 flex a459h items-center t4wtn x8k6f icuyk iec4s haq8z t4rxa c2pts dark:text-neutral-400 dark:hover:bg-neutral-800 dark:focus:bg-neutral-800" aria-label="Next"> <svg class="xqknn d681g" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m9 18 6-6-6-6"/></svg> </button> </div> <!-- End Next Button --> </div> <!-- Months --> <!-- Weeks --> <div class="flex cqbvv"> <span class="whmww bwtk8 block iieae a3wk8 kugle dark:text-neutral-500"> Mo </span> <span class="whmww bwtk8 block iieae a3wk8 kugle dark:text-neutral-500"> Tu </span> <span class="whmww bwtk8 block iieae a3wk8 kugle dark:text-neutral-500"> We </span> <span class="whmww bwtk8 block iieae a3wk8 kugle dark:text-neutral-500"> Th </span> <span class="whmww bwtk8 block iieae a3wk8 kugle dark:text-neutral-500"> Fr </span> <span class="whmww bwtk8 block iieae a3wk8 kugle dark:text-neutral-500"> Sa </span> <span class="whmww bwtk8 block iieae a3wk8 kugle dark:text-neutral-500"> Su </span> </div> <!-- Weeks --> <!-- Days --> <div class="flex"> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200" disabled> 26 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200" disabled> 27 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200" disabled> 28 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200" disabled> 29 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200" disabled> 30 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200"> 1 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200"> 2 </button> </div> </div> <!-- Days --> <!-- Days --> <div class="flex"> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200"> 3 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200"> 4 </button> </div> <div > <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200"> 5 </button> </div> <div > <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200"> 6 </button> </div> <div > <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200"> 7 </button> </div> <div > <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200"> 8 </button> </div> <div > <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200"> 9 </button> </div> </div> <!-- Days --> <!-- Days --> <div class="flex"> <div > <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200"> 10 </button> </div> <div > <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200"> 11 </button> </div> <div > <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200"> 12 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200"> 13 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200"> 14 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200"> 15 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200"> 16 </button> </div> </div> <!-- Days --> <!-- Days --> <div class="flex"> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200"> 17 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200"> 18 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200"> 19 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center ob5sd qm5z2 ftfcy a3wk8 zd5ha txh0b wo9uq icuyk dark:bg-blue-500 iec4s haq8z t4rxa c2pts dark:hover:border-neutral-700"> 20 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200"> 21 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200"> 22 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200"> 23 </button> </div> </div> <!-- Days --> <!-- Days --> <div class="flex"> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200"> 24 </button> </div> <div > <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200"> 25 </button> </div> <div > <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200"> 26 </button> </div> <div > <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200"> 27 </button> </div> <div > <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200"> 28 </button> </div> <div > <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200"> 29 </button> </div> <div > <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200"> 30 </button> </div> </div> <!-- Days --> <!-- Days --> <div class="flex"> <div > <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn icuyk wo9uq vfm71 iec4s haq8z t4rxa mbp40 u6giu dark:text-neutral-200"> 31 </button> </div> <div > <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn wo9uq vfm71 icuyk iec4s haq8z t4rxa c2pts dark:text-neutral-200 dark:hover:border-neutral-500 dark:focus:bg-neutral-700" disabled> 1 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn wo9uq vfm71 icuyk iec4s haq8z t4rxa c2pts dark:text-neutral-200 dark:hover:border-neutral-500 dark:focus:bg-neutral-700" disabled> 2 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn wo9uq vfm71 icuyk iec4s haq8z t4rxa c2pts dark:text-neutral-200 dark:hover:border-neutral-500 dark:focus:bg-neutral-700" disabled> 3 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn wo9uq vfm71 icuyk iec4s haq8z t4rxa c2pts dark:text-neutral-200 dark:hover:border-neutral-500 dark:focus:bg-neutral-700" disabled> 4 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn wo9uq vfm71 icuyk iec4s haq8z t4rxa c2pts dark:text-neutral-200 dark:hover:border-neutral-500 dark:focus:bg-neutral-700" disabled> 5 </button> </div> <div> <button type="button" class="whmww rzqz2 flex a459h items-center qm5z2 ftfcy a3wk8 t4wtn wo9uq vfm71 icuyk iec4s haq8z t4rxa c2pts dark:text-neutral-200 dark:hover:border-neutral-500 dark:focus:bg-neutral-700" disabled> 6 </button> </div> </div> <!-- Days --> </div> </div> </div> </div> <!-- End Calendar Dropdown --> <!-- Input --> <div class="w-full"> <label for="hs-pro-chhsncstm" class="lpi99 l1oxk block egssd f5wd6 dark:text-neutral-400"> Time </label> <input type="text" class="p65gp vo9dv block w-full o7p0z ftfcy m6q9e egssd xkisd awvey nwqzd b50zm iec4s haq8z b3tqx owwub mwsh2 dark:text-neutral-400 dark:bg-neutral-700 dark:text-neutral-300 dark:placeholder:text-neutral-500 dark:hover:bg-neutral-600 dark:focus:bg-neutral-600" id="hs-pro-chhsncstm" value="9:00 AM"> </div> <!-- End Input --> </div> <div class="d3qt8 x7giz"> <div class="z9yef flex f5dbk items-center sapo1"> <button type="button" class="rsqxb cc1ly j5skf rl1tg a459h items-center gxh7t nz7b4 qm5z2 khwhk t4wtn egssd zd5ha zb2tq fwpr6 oewy0 w8bqc iec4s haq8z dark:bg-neutral-800 dark:border-neutral-700 dark:text-neutral-300 dark:hover:bg-neutral-700 dark:focus:bg-neutral-700" data-hs-overlay="#hs-pro-chhsncs"> Cancel </button> <button type="button" class="rsqxb cc1ly j5skf rl1tg a459h items-center klk5r gxh7t ob5sd qm5z2 zranc txh0b egssd zd5ha zb2tq fwpr6 oewy0 hs3rw iec4s haq8z t4rxa mqwez zvcaz dark:focus:ring-blue-500" data-hs-overlay="#hs-pro-chhsncs"> Snooze </button> </div> </div> </div> <!-- End Footer --> </div> </div> </div> <!-- End Archive Message Modal -->
Subscribe
Get all the latest Preline updates and news.
All examples
Close
Close