<!DOCTYPE html>
<html>
<head>
    <style>
        @page {
            margin: 0;
        }

        body {
            margin: 0;
            padding: 0;
            /* font-family: "Arial Narrow", "DejaVu Sans", sans-serif; */
        }

        .sticker {
            width: 113.39pt;
            height: 113.39pt;
            overflow: hidden;
        }

        .sticker:last-child {
            page-break-after: auto;
        }

        table {
            width: 100%;
            border-collapse: collapse;
        }

        td {
            padding: 0;
            margin: 0;
            vertical-align: top;
        }

        .qr {
            width: 90pt;
            height: 90pt;
            padding-top: 2pt;
            /* padding-left: 12pt; */
        }

        .text {
            position: relative;
            /* padding-left: 5pt; */
        }

        .serial {
            font-size: 7pt;
            font-weight: bold;
            position: relative;
            /* top: 30pt; */
            top: -5pt;
            /* padding-left: 1pt; */
        }

        /* .po {
            font-size: 8pt;
            font-weight: bold;
            text-align: left !important;
            position: absolute;
            right: 5pt;
            top: 8pt;
        } */

        .desc {
            font-family: "Arial Narrow";
            font-size: 6pt;
            font-weight: bold;
            white-space: nowrap;
            /* padding-top: 42pt; */
            left: -38pt;
        }
    </style>
</head>
<body>

@foreach($stickers as $sticker)
    <div class="sticker">
        <table>
            <tr>
                <td align="center">
                    <img class="qr" src="{{ $sticker['qr'] }}">
                </td>
            </tr>
            <tr>
                <td class="text" align="center">
                    <div class="serial">{{ $sticker['serial'] }}</div>
                </td>
            </tr>
            <tr>
                <td class="text" align="center">
                    <div class="desc">{{ $sticker['description'] }}</div>
                </td>
            </tr>
        </table>
    </div>
@endforeach

</body>
</html>
