This repository has been archived by the owner on Jan 17, 2024. It is now read-only.
forked from 18F/dol-whd-14c
-
Notifications
You must be signed in to change notification settings - Fork 2
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #189 from AppliedIS/feature-ui-design-2
Feature ui design 2
- Loading branch information
Showing
18 changed files
with
629 additions
and
314 deletions.
There are no files selected for viewing
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
18 changes: 17 additions & 1 deletion
18
....Section14c.Web/src/modules/components/formFooterControls/formFooterControlsTemplate.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,3 +1,19 @@ | ||
<div class="form-footer-controls" ng-show="vm.hasNext"> | ||
<button class="back-button" ng-show="vm.hasBack" ng-click="vm.onBackClick()">{{ vm.backLabel }}</button><span class="pull-right"><button class="save-button" ng-click="vm.onSaveClick()">Save & Continue Later</button><button class="next-button" ng-click="vm.onNextClick()">{{ vm.nextLabel }}</button></span> | ||
<div class="button-group"> | ||
<button class="back-button" ng-show="vm.hasBack" ng-click="vm.onBackClick()">{{ vm.backLabel }}</button> | ||
<div class="pull-right"> | ||
<!--<button class="save-button" ng-click="vm.onSaveClick()">Save & Continue Later</button>--> | ||
<button class="next-button" ng-click="vm.onNextClick()">{{ vm.nextLabel }}</button> | ||
</div> | ||
</div> | ||
|
||
<div class="dol-feedback-save"> | ||
<span class="dol-feedback-save-success" ng-show="vm.stateService.formData.lastSaved > 0"> | ||
Saved {{vm.stateService.formData.lastSaved | amUtc | amLocal | amDateFormat:'MM/DD/YYYY, h:mm A'}} | ||
</span> | ||
<span class="dol-feedback-save-error" ng-show="vm.stateService.formData.lastSaved === 0"> | ||
Error Saving Form | ||
</span> | ||
</div> | ||
</div> | ||
|
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
1 change: 1 addition & 0 deletions
1
...on14c.Web/src/modules/components/mainNavigationControl/mainNavigationControlTemplate.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
32 changes: 18 additions & 14 deletions
32
DOL.WHD.Section14c.Web/src/modules/components/userLoginForm/userLoginFormTemplate.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,35 +1,39 @@ | ||
<form ng-submit="onSubmitClick()"> | ||
<div class="login"> | ||
<div class="dol-panel-login"> | ||
<h2>Log in</h2> | ||
|
||
<div class="usa-alert usa-alert-error" role="alert" ng-show="vm.unknownError"> | ||
<div class="usa-alert-body"> | ||
<!--<h3 class="usa-alert-heading">Error Status</h3>--> | ||
<p class="usa-alert-text">An error occurred while connecting to the server. Please try again later if the error persists.</p> | ||
</div> | ||
</div> | ||
|
||
<div class="usa-alert usa-alert-error" role="alert" ng-show="vm.loginError"> | ||
<div class="usa-alert-body"> | ||
<!--<h3 class="usa-alert-heading">Error Status</h3>--> | ||
<p class="usa-alert-text">The email or password entered does not match our records.</p> | ||
</div> | ||
</div> | ||
|
||
<div ng-class="vm.loginError ? 'usa-input-error' : ''"><label for="userName">Email</label><input name="userName" id="userName" type="email" placeholder="Email" ng-model="formVals.email" /></div> | ||
<div ng-class="(vm.loginError ? 'usa-input-error' : '') + ' ' + 'password-wrap'"><label for="password">Password</label><input name="password" id="password" type="{{inputType}}" placeholder="Password" ng-model="formVals.pass" /> | ||
<div class="showpass"> | ||
<a href="" ng-click="hideShowPassword()"><span ng-show="inputType != 'password'">Hide</span><span ng-show="inputType === 'password'">Show</span> Password</a> | ||
</div></div> | ||
|
||
<div ng-class="vm.loginError ? 'usa-input-error' : ''"> | ||
<label for="userName">Email</label> | ||
<input name="userName" id="userName" type="email" ng-model="formVals.email" /> | ||
</div> | ||
<div ng-class="(vm.loginError ? 'usa-input-error' : '') + ' ' + 'password-wrap'"> | ||
<label for="password">Password</label> | ||
<input name="password" id="password" type="{{inputType}}" ng-model="formVals.pass" /> | ||
<div class="showpass"> | ||
<a href="" ng-click="hideShowPassword()"><span ng-show="inputType != 'password'">Hide</span><span ng-show="inputType === 'password'">Show</span> Password</a> | ||
</div> | ||
</div> | ||
<div class="loginbtn"> | ||
<button type="submit" ng-show="!vm.submittingForm">Log in</button> | ||
<button type="button" ng-show="vm.submittingForm" class='usa-button-active'><span class="loading-blue" ng-show="vm.submittingForm"></span>Loading</button> | ||
</div> | ||
<div class="forgotpass"><a href="" ng-click="forgotPassword()">Forgot Your Password?</a></div> | ||
<div class="forgotpass"> | ||
<a href="" ng-click="forgotPassword()">Forgot Your Password?</a> | ||
</div> | ||
</div> | ||
<div class="login"> | ||
<div><strong>Questions?</strong></div> | ||
<div>Contact the <a>Wage and Hour office closest to you</a></div> | ||
<div class="dol-panel-info"> | ||
<h3>Questions?</h3> | ||
<p>Contact the <a href="#">Wage and Hour office closest to you.</a></p> | ||
</div> | ||
</form> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,102 @@ | ||
|
||
// System Save Feedback | ||
// Appears in form header and form footer | ||
// ---------------------------------------- | ||
// Global styling for both locations | ||
.dol-feedback-save { | ||
span { | ||
display: block; | ||
padding: 1.5rem; | ||
|
||
&.dol-feedback-save-success { | ||
&:before { | ||
content: ""; | ||
display: inline-block; | ||
vertical-align: middle; | ||
margin-right: 7px; | ||
width: 20px; | ||
height: 20px; | ||
background: url('../images/dol-checkmark-green.png') center center; | ||
background: url('../images/dol-checkmark-green.svg') center center; | ||
background-size: contain; | ||
} | ||
} | ||
|
||
&.dol-feedback-save-error { | ||
&:before { | ||
content: ""; | ||
display: inline-block; | ||
vertical-align: middle; | ||
margin-right: 7px; | ||
width: 20px; | ||
height: 20px; | ||
background: url('../images/dol-error-red.png') center center; | ||
background: url('../images/dol-error-red.svg') center center; | ||
background-size: contain; | ||
} | ||
} | ||
|
||
&.dol-feedback-save-process { | ||
&:before { | ||
content: ""; | ||
display: inline-block; | ||
vertical-align: middle; | ||
margin-right: 7px; | ||
width: 20px; | ||
height: 20px; | ||
background: url('../images/dol-saving-small-green.gif') center center; | ||
background-size: contain; | ||
} | ||
} | ||
} | ||
} | ||
|
||
// Styling & positioning for System Save Feedback in form header | ||
.dol-applicant-meta { | ||
.dol-feedback-save { | ||
|
||
background-color: $color-white; | ||
|
||
span { | ||
&.dol-feedback-save-success, | ||
&.dol-feedback-save-process { | ||
border-top: .6rem solid $color-green; | ||
padding-top: .9rem; | ||
} | ||
|
||
&.dol-feedback-save-error { | ||
border-top: .6rem solid $color-secondary; | ||
padding-top: .9rem; | ||
} | ||
} | ||
} | ||
} | ||
|
||
// Styling & positiong for System Save Feedback in form footer | ||
.form-footer-controls { | ||
.dol-feedback-save { | ||
text-align: right; | ||
border-top: 1px solid #aeb0b5; | ||
margin-top: 1.5rem; | ||
|
||
span { | ||
padding-top: 2rem; | ||
padding-right: 0; | ||
|
||
&.dol-feedback-save-success { | ||
display: block !important; // TEMPORARY FOR TESTING | ||
} | ||
} | ||
} | ||
} | ||
|
||
@media (min-width: 50em) { | ||
.dol-applicant-meta { | ||
.dol-feedback-save { | ||
position: absolute; | ||
right: 0; | ||
top: 0; | ||
bottom: 0; | ||
} | ||
} | ||
} |
Oops, something went wrong.