diff --git a/projects/angular/src/accordion/stepper/_stepper.clarity.scss b/projects/angular/src/accordion/stepper/_stepper.clarity.scss index f40f82c2c8..0ed2b75932 100644 --- a/projects/angular/src/accordion/stepper/_stepper.clarity.scss +++ b/projects/angular/src/accordion/stepper/_stepper.clarity.scss @@ -104,7 +104,6 @@ } .clr-step-button { - display: inline-block; margin-top: tokens.$cds-global-space-9; margin-right: tokens.$cds-global-space-6; } diff --git a/projects/demo/src/app/stepper/stepper.demo.html b/projects/demo/src/app/stepper/stepper.demo.html index 39aa22f575..46641a142b 100644 --- a/projects/demo/src/app/stepper/stepper.demo.html +++ b/projects/demo/src/app/stepper/stepper.demo.html @@ -31,7 +31,7 @@

Stepper with a nested accordion inside it

Accordion 2 content - + diff --git a/projects/demo/src/app/stepper/stepper.demo.ts b/projects/demo/src/app/stepper/stepper.demo.ts index 95b5033e0b..34b0161619 100644 --- a/projects/demo/src/app/stepper/stepper.demo.ts +++ b/projects/demo/src/app/stepper/stepper.demo.ts @@ -7,12 +7,15 @@ import { Component, ElementRef, inject, ViewChild } from '@angular/core'; import { FormBuilder, FormControl, FormGroup, Validators } from '@angular/forms'; +import { ClrLoadingState } from '@clr/angular'; @Component({ templateUrl: 'stepper.demo.html', styleUrls: ['./stepper.demo.scss'], }) export class StepperDemo { + state: ClrLoadingState = ClrLoadingState.DEFAULT; + showSecondStep = true; initialStep = 'name'; form: FormGroup = this.getReactiveForm(); @@ -36,6 +39,13 @@ export class StepperDemo { }; loading = false; + loadingDemo() { + this.state = ClrLoadingState.LOADING; + setTimeout(() => { + this.state = ClrLoadingState.SUCCESS; + }, 1500); + } + submit() { console.log('reactive form submit', this.form.value); }