studidcard/idcard-print.php
Raphael Dannecker 48a5360d0d Initial commit
2025-02-25 16:10:55 +01:00

199 lines
5.9 KiB
PHP
Raw Permalink Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Schülerausweis</title>
<style>
body {
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
margin: 0;
background-color: #ffffff;
font-family: Arial, sans-serif;
}
.card {
width: 86mm;
height: 54mm;
/*width: 100vw;
height: 100vh;
width: 600px;
height: 350px;*/
border: 1px solid #cccccc;
border-radius: 10px;
/* padding: 20px;*/
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
background: url(img/fvs-background-print.<?php echo (isset($pdf) ? 'png' : 'svg') ?>) bottom left no-repeat;
color-adjust: exact !important; /* Firefox 48 96 */
print-color-adjust: exact !important;
/*background: url('img/fvs-background.<?php echo (isset($pdf) ? 'png' : 'svg') ?>') bottom left no-repeat;*/
/*background-size: 60%;
background-size: contain;*/
}
.left-section {
/* display: flex;
flex-direction: column;
justify-content: space-between;*/
position: absolute; top: 25mm; left: 2mm; width: 45mm; height: 35mm;
/*border: 1px solid;*/
/* background-image: url('logo-fvs-kuppel.svg');
background-size: 120%;
background-repeat: no-repeat;
background-position: right;
background-color:rgba(255, 255, 255, 5);*/
}
.right-section {
text-align: left;
position: absolute; top: 20mm; left: 54mm; width: 27mm; height: 33mm;
/*border: 1px solid;*/
}
.logo {
position: absolute; top: 7mm; left: 36mm; width: 46mm; height: 12mm;
/*border: 1px solid;*/
text-align: left;
}
.title {
font-size: 14px;
font-weight: bold;
color: #333333;
position: absolute; top: 11mm; left: 2mm;
}
.subtitle {
font-size: 8px;
color: #666666;
position: absolute; top: 15mm; left: 2mm;
}
.info {
margin-bottom: 4mm;
}
.legal {
font-size: 8px;
color: #666666;
position: absolute; top: 27mm; left: 0mm;
}
.info strong {
display: block;
font-size: 10px;
color: #333333;
}
.info span {
font-size: 6px;
color: #666666;
}
.logo img {
width: 46mm;
height: auto;
}
.contact {
font-size: 8px;
color: #333333;
text-align: left;
}
.contact a {
color: #333333;
text-decoration: none;
font-weight: bold;
}
.qr-code {
/* margin-top: 10px;*/
}
.qr-code img {
width: 22mm;
height: auto;
}
.timestamp {
transform: rotate(90deg);
rotate: 90;
font-size: 6px;
color: #666666;
/*margin-top: 10px;*/
}
.curve {
position: absolute;
width: 400px;
height: 200px;
background: #e5f2f8;
border-radius: 200px / 100px;
transform: rotate(20deg);
top: 50px;
left: -100px;
z-index: -1;
}
</style>
</head>
<body>
<div class="card">
<div class="title"><?php if ($data['role']==='teacher') { echo 'Lehrerausweis'; } else { echo 'Schülerausweis'; } ?></div>
<div class="subtitle"><?php if ($data['role']==='teacher') { echo 'Teacher'; } else { echo 'Student'; } ?> Identity Card</div>
<div class="logo">
<img src="img/logo-fvs.<?php echo (isset($pdf) ? 'png' : 'svg') ?>" alt="Logo Steinbeis-Schule Reutlingen" >
</div>
<div class="left-section">
<div class="info">
<strong><?php echo $data['firstname']; ?> <?php echo $data['lastname']; ?></strong><span><br>
Name</span>
</div>
<div class="info">
<strong><?php echo $data['birthdate']; ?></strong><span><br>
Date of Birth</span>
</div>
<div class="info">
<strong><?php echo $data['doe']; ?></strong><span><br>
Date of Expiry</span>
</div>
<div class="legal">Nur gültig mit amtlichen Lichtbildausweis<br>Only valid with official photo Identity Card</div>
</div>
<div class="right-section">
<div class="contact">
Gewerbliche Schule I<br>
Karlstraße 40<br>
D-72764 Reutlingen<br>
<a href="http://www.steinbeis.schule">www.steinbeis.schule</a><br>
info@steinbeis.schule<br>
+49 7121 485 111
</div>
<table style="width:100%">
<tr>
<td style="width:90%">
<div class="qr-code">
<?php if (isset($valid) && $valid) { echo '<img src="checked.svg" alt="gültig">'; } ?>
<?php if (!isset($valid) && isset($pdf)) { echo '<qrcode value="' . $url .'" ec="M" style="width: 22mm; background-color: white; color: black; border: none;"></qrcode>'; } ?>
<?php if (!isset($valid) && !isset($pdf)) { echo '<img src="qrcode.php" alt="QR Code">'; } ?>
</div>
</td>
<td style="width:10%" valign=bottom>
<div style="align-content:end">
<!-- <div>
<?php if (isset($valid) && $valid) { echo 'valid'; } ?>
<?php if (isset($valid) && !$valid) { echo 'expired'; } ?>
<?php if (!isset($valid)) { echo '<A href="' . $url . '">verify</A>'; } ?>
</div>-->
<div class="timestamp">
<?php echo date('d.m.Y') . "&nbsp;-&nbsp;" . date('H:i:s'); ?>
</div>
</div>
</td>
</tr>
</table>
</div>
</div>
</body>
</html>