<!DOCTYPE html>
<html v-bind:lang="$i18n.locale">
    <head>
        <meta name="viewport" content="width=device-width" />
        <meta name="format-detection" content="telephone=no" />
    </head>
    <body>
        <table class="grid">
            <tbody>
                <tr>
                    <td>
                        <div class="grid-row">
                            <div class="grid-block empty"></div>
                        </div>
                        <div class="grid-row">
                            <div class="grid-block">
                                <email-header v-bind="$props"></email-header>
                            </div>
                        </div>
                        <div class="grid-row">
                            <div class="grid-block vn-pa-md">
                                <h1>{{ $t('title') }}</h1>
                                <p>{{ $t('description') }}</p>
                                <p>
                                    {{ $t('device') }}: <strong>{{ device }}</strong>
                                </p>
                                <p>
                                    {{$t('ip')}}: <strong>{{ ip }}</strong>
                                </p>
                            </div>
                        </div>
                        <div class="grid-row">
                            <div class="grid-block vn-pa-sm">
                                <p>{{ $t('Enter the following code to continue to your account. It expires in 5 minutes.') }}</p>
                                <div class="code vn-pa-sm vn-m-md">
                                    {{ code }}
                                </div>
                            </div>
                        </div>
                    </td>
                </tr>
            </tbody>
        </table>
    </body>
</html>