Personalized Skincare Routine Generator

Personalized Skincare Routine Generator

Create your ideal AM & PM routine in a few simple steps.

What is your skin type?

What are your main skin concerns?

Select all that apply.

Based on your profile: ${skinType} Skin with concerns in ${concerns.length > 0 ? concerns.join(', ') : 'None specified'}.

`; const createRoutineHtml = (items, theme) => items.map((item, index) => `
  • ${index + 1}

    ${item.product}

    ${item.reason}

  • `).join(''); routineResultsDiv.innerHTML = `

    ☀️ AM Routine (Morning)

      ${createRoutineHtml(routine.am, 'blue')}

    🌙 PM Routine (Evening)

      ${createRoutineHtml(routine.pm, 'indigo')}
    `; routinePlaceholder.classList.add('hidden'); pdfContent.classList.remove('hidden'); pdfButtonContainer.classList.remove('hidden'); } // --- PDF Generation --- async function handleDownloadPdf() { const { jsPDF } = window.jspdf; if (!pdfContent) return; // Add class to trigger medical report styling toolContainer.classList.add('pdf-generating'); try { const canvas = await html2canvas(pdfContent, { scale: 2, useCORS: true, backgroundColor: '#ffffff' // Explicitly set background }); const imgData = canvas.toDataURL('image/png'); const pdf = new jsPDF({ orientation: 'portrait', unit: 'px', format: [canvas.width, canvas.height] }); pdf.addImage(imgData, 'PNG', 0, 0, pdf.internal.pageSize.getWidth(), pdf.internal.pageSize.getHeight()); pdf.save('Personal-Skincare-Report.pdf'); } catch (error) { console.error("Error generating PDF:", error); } finally { // IMPORTANT: Remove the class to revert to normal screen styling toolContainer.classList.remove('pdf-generating'); } } // Initialize first tab view updateNavButtons(); pdfContent.classList.add('hidden'); });
    Scroll to Top