mirror of
https://github.com/moparisthebest/mail
synced 2024-08-13 16:43:47 -04:00
118 lines
5.6 KiB
HTML
118 lines
5.6 KiB
HTML
<section class="page">
|
|
<div class="page__canvas">
|
|
<header class="page__header">
|
|
<img src="img/whiteout_logo.svg" alt="whiteout.io">
|
|
</header>
|
|
<main class="page__main">
|
|
<h2 class="typo-title">Login</h2>
|
|
<p class="typo-paragraph" ng-hide="useOAuth">
|
|
Please enter your password. The password is used to authenticate with your mail provider over an encrypted connection. We cannot read your password. <a href="https://github.com/whiteout-io/mail-html5/wiki/FAQ#is-my-password-secure" target="_blank">Learn more</a>
|
|
</p>
|
|
<p class="typo-paragraph" ng-show="useOAuth">
|
|
Please confirm the Google account your device is currently logged into. If you have multiple Google accounts and need help, please <a href="https://github.com/whiteout-io/mail-html5/wiki/FAQ#how-does-sign-in-with-google-work" target="_blank">click here</a>.
|
|
</p>
|
|
|
|
<form class="form" name="form">
|
|
<fieldset class="form-fieldset form-fieldset--standalone form-fieldset--error" ng-show="connectionError">
|
|
<legend>Connection Error</legend>
|
|
<p class="typo-paragraph">{{connectionError.message}}</p>
|
|
<p class="typo-paragraph" ng-show="connectionError.underlyingError">
|
|
Underlying Cause: <em>{{connectionError.underlyingError.message}}</em>
|
|
</p>
|
|
<p class="typo-paragraph">
|
|
<a href="https://github.com/whiteout-io/mail-html5/wiki/FAQ#troubleshooting" target="_blank">
|
|
Find out more in the FAQ.
|
|
</a>
|
|
</p>
|
|
</fieldset>
|
|
|
|
<div class="form__row">
|
|
<input class="input-text" type="email" required ng-model="emailAddress"
|
|
placeholder="Email address" tabindex="1" spellcheck="false">
|
|
</div>
|
|
<div class="form__row">
|
|
<input class="input-text" type="text" ng-model="realname"
|
|
placeholder="Full name (optional)" wo-focus-me="true" tabindex="2">
|
|
</div>
|
|
<div class="form__row" ng-hide="useOAuth">
|
|
<input ng-required="!useOAuth" class="input-text" type="password"
|
|
ng-model="password" placeholder="Password" tabindex="3">
|
|
</div>
|
|
|
|
<p class="typo-paragraph">
|
|
<br>
|
|
<a href="#" wo-touch="$event.preventDefault(); showDetails = !showDetails">
|
|
{{showDetails ? "Hide Options" : "Show Options"}}
|
|
</a>
|
|
<br><br>
|
|
</p>
|
|
|
|
<div ng-show="showDetails">
|
|
<div class="form__row" ng-hide="useOAuth">
|
|
<input class="input-text" type="text" ng-model="username" placeholder="User (optional)">
|
|
</div>
|
|
|
|
<fieldset class="form-fieldset">
|
|
<legend>IMAP</legend>
|
|
<div class="form__row form__row--multi">
|
|
<div class="form__col form__col--2">
|
|
<input required class="input-text" type="text"
|
|
ng-model="imapHost" placeholder="Host"
|
|
pattern="^(([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])\.){3}([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])$|^(([a-zA-Z0-9]|[a-zA-Z0-9][a-zA-Z0-9\-]*[a-zA-Z0-9])\.)*([A-Za-z0-9]|[A-Za-z0-9][A-Za-z0-9\-]*[A-Za-z0-9])$"
|
|
autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false">
|
|
</div>
|
|
<div class="form__col">
|
|
<input required class="input-text" type="number"
|
|
ng-model="imapPort" placeholder="Port" min="0" max="65535" step="1" pattern="\d+">
|
|
</div>
|
|
</div>
|
|
<div class="form__row">
|
|
<label class="input-select">
|
|
<select required ng-model="imapEncryption">
|
|
<option value="" disabled selected style="display:none">Encryption method</option>
|
|
<option value="2">TLS</option>
|
|
<option value="1">STARTTLS</option>
|
|
<option value="0">None</option>
|
|
</select>
|
|
</label>
|
|
</div>
|
|
</fieldset>
|
|
|
|
<fieldset class="form-fieldset">
|
|
<legend>SMTP</legend>
|
|
<div class="form__row form__row--multi">
|
|
<div class="form__col form__col--2">
|
|
<input required class="input-text" type="text"
|
|
ng-model="smtpHost" placeholder="Host"
|
|
pattern="^(([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])\.){3}([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])$|^(([a-zA-Z0-9]|[a-zA-Z0-9][a-zA-Z0-9\-]*[a-zA-Z0-9])\.)*([A-Za-z0-9]|[A-Za-z0-9][A-Za-z0-9\-]*[A-Za-z0-9])$"
|
|
autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false">
|
|
</div>
|
|
<div class="form__col">
|
|
<input required class="input-text" type="number"
|
|
ng-model="smtpPort" placeholder="Port" min="0" max="65535" step="1" pattern="\d+">
|
|
</div>
|
|
</div>
|
|
<div class="form__row">
|
|
<label class="input-select">
|
|
<select required ng-model="smtpEncryption">
|
|
<option value="" disabled selected style="display:none">Encryption method</option>
|
|
<option value="2">TLS</option>
|
|
<option value="1">STARTTLS</option>
|
|
<option value="0">None</option>
|
|
</select>
|
|
</label>
|
|
</div>
|
|
</fieldset>
|
|
</div>
|
|
<div class="spinner-block" ng-show="busy">
|
|
<span class="spinner spinner--big"></span>
|
|
</div>
|
|
<div class="form__row">
|
|
<button type="submit" ng-click="test()" class="btn">Login</button>
|
|
</div>
|
|
</form>
|
|
</main>
|
|
<div ng-include="'tpl/page-footer.html'"></div>
|
|
</div>
|
|
</section>
|