Commit 9a2f7449 authored by David Burke's avatar David Burke

Added aside link component

parent e0ab30aa
Pipeline #37853763 failed with stages
in 5 minutes and 1 second
import { configure } from "@storybook/angular";
console.log("why?????????????????????????Vy");
console.log("why?????????????????????????Vy");
console.log("why?????????????????????????Vy");
console.log("why?????????????????????????Vy");
console.log("why?????????????????????????Vy");
console.log("why?????????????????????????Vy");
// automatically import all files ending in *.stories.ts
const req = require.context("../src/stories", true, /.stories.ts$/);
function loadStories() {
......
This diff is collapsed.
......@@ -33,7 +33,11 @@
<div class="form-field form-field--large">
<div class="form-field__wrapper-for-link">
<label [for]="form.controls.password.id" class="form-field__label">Password</label>
<a class="text-link text-link--caret form-field__label-link" href="javascript:void(0)" [routerLink]="['/reset-password']" tabindex="8"><span class="u-visible--all-but-small">Forgot? </span>Recover&nbsp;your&nbsp;account</a>
<aside-link
text="Forgot? Recover your account"
tabindex="8"
[link]="['/reset-password']"
></aside-link>
</div>
<input
type="password"
......
......@@ -53,7 +53,7 @@
[ngrxFormControl]="form.controls.password"
(returnPress)="onSubmit()"
></app-text-field>
<Label
*ngIf="form.errors._password && form.isSubmitted"
class="text-label text-label--error"
......@@ -61,6 +61,12 @@
textWrap="true"
></Label>
<aside-link
text="Forgot? Recover your account"
tabindex="8"
[link]="['/reset-password']"
></aside-link>
<progress-indicator
[inProgress]="hasLoginStarted"
[completed]="hasLoginFinished"
......
<a
class="text-link text-link--caret form-field__label-link"
href="javascript:void(0)"
[routerLink]="link"
[tabindex]="tabindex"
>
<span class="u-visible--all-but-small">{{ text }}</span>
</a>
\ No newline at end of file
/* Add mobile styles for the component here. */
<Label
[text]="text"
[nsRouterLink]="link"
></Label>
\ No newline at end of file
import { Component, Input } from "@angular/core";
/**
* The aside link component often shows up near form labels, as an alternative option to the form.
* For example instead of logging, offer to go to forgot password.
*/
@Component({
selector: "aside-link",
templateUrl: "./aside-link.component.html",
styleUrls: ["./aside-link.component.css"]
})
export class AsideLinkComponent {
@Input() text: string;
@Input() link: string[];
@Input() tabindex: string;
constructor() {}
}
......@@ -7,12 +7,14 @@ import { TextFieldComponent } from "./text-field/text-field.component";
import { HeadingComponent } from "./heading/heading.component";
import { DirectivesModule } from "../directives";
import { CheckboxComponent } from "./checkbox/checkbox.component";
import { AsideLinkComponent } from "./aside-link/aside-link.component";
export const COMPONENTS = [
ButtonComponent,
TextFieldComponent,
HeadingComponent,
CheckboxComponent
CheckboxComponent,
AsideLinkComponent
];
@NgModule({
......
......@@ -10,6 +10,7 @@ import { NgrxFormsModule } from "ngrx-forms";
import { CheckboxComponent } from "./checkbox/checkbox.component";
import { NonFieldMessagesComponent } from "./non-field-messages/non-field-messages.component";
import { FormLabelComponent } from "./form-label/form-label.component";
import { AsideLinkComponent } from "./aside-link/aside-link.component";
export const COMPONENTS = [
NavbarContainer,
......@@ -17,7 +18,8 @@ export const COMPONENTS = [
SearchComponent,
CheckboxComponent,
NonFieldMessagesComponent,
FormLabelComponent
FormLabelComponent,
AsideLinkComponent
];
@NgModule({
......
import { storiesOf, moduleMetadata } from "@storybook/angular";
import { withKnobs } from "@storybook/addon-knobs";
import { AsideLinkComponent } from "~/app/shared/aside-link/aside-link.component";
import { RouterTestingModule } from "@angular/router/testing";
storiesOf("Shared", module)
.addDecorator(withKnobs)
.addDecorator(
moduleMetadata({
imports: [RouterTestingModule]
})
)
.add("Aside Link", () => ({
component: AsideLinkComponent,
props: {
text: "Try clicking here"
}
}));
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment