EVOLUTION-NINJA
Edit File: Revision-remuneration-letter.php
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Experience Certificate</title> <style> @import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wdth,wght@0,90.8,346;1,90.8,346&display=swap'); /* ------------------------- Common Styles (Screen & Print) ------------------------- */ body { margin: 0; padding: 0; } p{ font-family: serif; } .a4-page { background: white; width: 210mm; min-height: 297mm; padding: 20mm; margin: 20px auto; box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); position: relative; overflow: hidden; display: flex; justify-content: center; align-items: center; } .content-wrapper { width: 160mm; /* Reduced width for better readability */ text-align: justify; margin-bottom:200px; /* Moves content down by 100px */ } .date-section { text-align: left; margin-bottom: 20px; margin-top:110px; } .center-text { text-align: center; font-size: 22px; font-weight: bold; margin: 20px 0; } .certificate-text { font-size: 22px; line-height: 1.6; } /* Editable spans */ .editable { padding: 0 3px; font-size: 22px; outline: none; } .editable:focus { background-color: #eef; } .signature-section { text-align: left; margin-top: 100px; font-size: 22px; } button#printBtn { display: block; margin: 20px auto; padding: 10px 20px; font-size: 16px; cursor: pointer; } /* ------------------------- Screen-specific Styles ------------------------- */ @media screen { body { background: #f5f5f5; padding: 20px; } .a4-page { max-width: 95%; width: auto; box-shadow: 0 0 15px rgba(0, 0, 0, 0.2); } } /* ------------------------- Print-specific Styles (Full Sheet A4) ------------------------- */ @media print { @page { size: A4; margin: 0; } body { background: none; } .a4-page { margin: 0; padding: 0; width: 210mm; height: 297mm; box-shadow: none; page-break-after: avoid; page-break-before: avoid; page-break-inside: avoid; } .content-wrapper { width: 160mm; margin: auto; padding-bottom: -50px; /* Ensures 100px space in print as well */ } button#printBtn { display: none; } } </style> </head> <body> <div class="a4-page"> <div class="content-wrapper"> <!-- Editable Date on the Left --> <div class="date-section"> <h4>Strictly Confidential</h4> <br> <p class="certificate-text" style="line-height: 1; font-size: 20px; font-weight: 500;">Jay Blues Technologies</p> <p class="certificate-text" style="line-height: 1.6; font-size: 20px; font-weight: 500;">Date:<span class="editable" contenteditable="true">12.02.2001</span></p> <p class="certificate-text" style="line-height: 1; font-size: 20px; font-weight: 600;"> <span class="editable" contenteditable="true" style="font-weight:900 !important;">Mr.<b><?php echo htmlspecialchars($data->first_name . ' ' . $data->last_name); ?></b></span></p> <p class="certificate-text" style="line-height: 1; font-size: 20px; font-weight: 600;">Dear <span class="editable" contenteditable="true" style="font-weight:900 !important;"><b><?php echo htmlspecialchars($data->first_name . ' ' . $data->last_name); ?></b></span></p> </div> <!-- Centered Heading --> <h3 class="center-text" style="font-size: 26px;"><u>Sub: Revision in Remuneration</u></h3> <!-- Certificate Content --> <p class="certificate-text" style="line-height: 1.6; font-size: 20px; font-weight: 500;"> In recognition of your commendable performance till February 2020, the company is pleased to announce an increase in your monthly remuneration to total of Rs.<span class="editable" contenteditable="true"><b>18,000</b> w.e.f. <b>March 01, 2020.</b></span> <br> All other terms and conditions of your employment shall remain the same. <br> Your relentless efforts towards attaining the desired results have significantly contributed towards the growth of the company. We believe that with your admirable dedication and consistent performance, the organization would reach higher levels of success, which will also ensure a progressive career path for you. <br>We wish you the best for your accomplishments and future endeavors. </p> <span class="editable" contenteditable="true" style=" font-weight: 900;display:none"><?php echo $data->employee_id ?></span> <!-- Signature Section --> <div class="signature-section" > <p>Yours sincerely,</p> <br> <p>Ajay Kumar HS</p> <p>CEO</p> <p>Jay Blues Technologies</p> </div> </div> </div> <!-- Print Button --> <button id="printBtn" onclick="window.print()">Print</button> </body> </html>