1
0
mirror of https://github.com/moparisthebest/mail synced 2024-10-31 15:25:01 -04:00
mail/src/tpl/login-set-credentials.html

118 lines
5.6 KiB
HTML
Raw Normal View History

<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">
2015-02-24 08:10:21 -05:00
Please enter your credentials. 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">
2014-09-23 11:40:19 -04:00
<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>
2014-09-23 11:40:19 -04:00
</fieldset>
<div class="form__row">
<input class="input-text" type="text" ng-model="realname"
2015-03-01 13:11:16 -05:00
placeholder="Full name (optional)" tabindex="1">
</div>
2015-03-01 13:06:43 -05:00
<div class="form__row">
<input class="input-text" type="email" required ng-model="emailAddress"
2015-03-01 13:11:16 -05:00
placeholder="Email address" tabindex="2" spellcheck="false">
2015-03-01 13:06:43 -05:00
</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>