1#@!#!123s

: / home / vitalityhealth / www / aa / invite /
Filename : tests.php
back
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Wedding Invitation</title>

    <style>
        body {
           font-family: 'Montserrat', sans-serif;
            background-color: #f8f8f8;
            margin: 0;
            padding: 0;
            display: flex;
            justify-content: center;
            align-items: center;
            flex-direction: column;
            height: 100vh;
        }
        .invitation {
           background-color: white;
            width: 600px;
            padding: 50px;
            box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
            text-align: center;
            margin-bottom: 50px;
              margin-top: 50px;
            background: url('sukhmani-sahib-path/temp1/img/bg1.jpg') no-repeat center center;
            background-size: cover;
        }
        .invitation h1 {
            font-size: 50px;
            color: #a65b1a;
        }
        .invitation h2 {
            font-size: 20px;
            color: #a65b1a;
        }
        .invitation p {
            font-size: 18px;
            color: #333;
            margin: 10px 0;
        }
        .invitation .event-details {
            font-size: 22px;
            color: #d01818;
            margin: 20px 0;
        }
        .invitation .date-time {
            font-size: 30px;
            color: #d01818;
            margin: 10px 0;
        }
        .invitation .footer {
            font-size: 18px;
            color: #8cba1a;
            margin-top: 20px;
        }
        button {
            margin: 5px;
            padding: 10px 20px;
            font-size: 16px;
        }
    </style>

    <style>
     @font-face {
       font-family: 'Adobe Devanagari';
       src: url('sukhmani-sahib-path/temp1/font/AdobeDevanagari-Bold.woff2') format('woff2'),
         url('sukhmani-sahib-path/temp1/font/AdobeDevanagari-Bold.woff') format('woff');
       font-weight: bold;
       font-style: normal;
       font-display: swap;
     }

     @font-face {
       font-family: 'Adobe Gurmukhi';
       src: url('sukhmani-sahib-path/temp1/font/AdobeGurmukhi-Regular.woff2') format('woff2'),
         url('sukhmani-sahib-path/temp1/font/AdobeGurmukhi-Regular.woff') format('woff');
       font-weight: normal;
       font-style: normal;
       font-display: swap;
     }

     @font-face {
       font-family: 'Graphit';
       src: url('sukhmani-sahib-path/temp1/font/Graphit-Bold.woff2') format('woff2'),
         url('sukhmani-sahib-path/temp1/font/Graphit-Bold.woff') format('woff');
       font-weight: bold;
       font-style: normal;
       font-display: swap;
     }

     @font-face {
       font-family: 'Edwardian Scr Alt ITC TT';
       src: url('sukhmani-sahib-path/temp1/font/EdwardianScrAltITCTTBold.woff2') format('woff2'),
         url('sukhmani-sahib-path/temp1/font/EdwardianScrAltITCTTBold.woff') format('woff');
       font-weight: bold;
       font-style: normal;
       font-display: swap;
     }

     @font-face {
       font-family: 'Carot Display';
       src: url('sukhmani-sahib-path/temp1/font/CarotDisplay-Bold.woff2') format('woff2'),
         url('sukhmani-sahib-path/temp1/font/CarotDisplay-Bold.woff') format('woff');
       font-weight: bold;
       font-style: normal;
       font-display: swap;
     }

     @font-face {
       font-family: 'Futura';
       src: url('sukhmani-sahib-path/temp1/font/Futura-Dem.woff2') format('woff2'),
         url('sukhmani-sahib-path/temp1/font/Futura-Dem.woff') format('woff');
       font-weight: normal;
       font-style: normal;
       font-display: swap;
     }

     @font-face {
       font-family: 'Graphit';
       src: url('sukhmani-sahib-path/temp1/font/Graphit-Regular.woff2') format('woff2'),
         url('sukhmani-sahib-path/temp1/font/Graphit-Regular.woff') format('woff');
       font-weight: normal;
       font-style: normal;
       font-display: swap;
     }
   </style>
  
</head>
<body>
    <div class="invitation" id="invitation">
        <h1>ੴ</h1>
        <h2>॥ ਵਾਹਿਗੁਰੂ ਜੀ ਕਾ ਖਾਲਸਾ॥</h2>
        <p>THE GILL FAMILY REQUESTS YOU TO JOIN THEM FOR THE AUSPICIOUS</p>
        <h1>Sri Sukhmani Sahib Ji Path</h1>
        <p>IN HONOUR OF</p>
        <h1>Mohan's Wedding</h1>
        <p class="event-details">
            AT GURDWARA SRI GURU SINGH SABHA<br>
            47-49 CROSS RD SHAWINIGAN, G9N 7N7
        </p>
        <p class="date-time">SUNDAY 29 AT SUNDAY<br> NOVEMBER 2024</p>
        <p class="footer">
            FOLLOWED BY KIRTAN AND GURU KA LANGAR<br>
            RSVP EKAM 07352874192
        </p>
    </div>
    <button onclick="downloadPNG()">Download PNG</button>
    <button onclick="downloadJPG()">Download JPG</button>
    <button onclick="downloadPDF()">Download PDF</button>

    <script src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/1.4.1/html2canvas.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/2.5.1/jspdf.umd.min.js"></script>
    <script>
        function downloadPNG() {
            html2canvas(document.getElementById("invitation")).then(canvas => {
                const link = document.createElement('a');
                link.download = 'invitation.png';
                link.href = canvas.toDataURL("image/png");
                link.click();
            });
        }

        function downloadJPG() {
            html2canvas(document.getElementById("invitation")).then(canvas => {
                const link = document.createElement('a');
                link.download = 'invitation.jpg';
                link.href = canvas.toDataURL("image/jpeg", 1.0);
                link.click();
            });
        }

        function downloadPDF() {
            html2canvas(document.getElementById("invitation")).then(canvas => {
                const { jsPDF } = window.jspdf;
                const pdf = new jsPDF();
                const imgData = canvas.toDataURL('image/png');
                pdf.addImage(imgData, 'PNG', 10, 10);
                pdf.save("invitation.pdf");
            });
        }
    </script>
</body>
</html>