Move navigation to bottom in onboarding (#20010)
* Shifted navigation to bottom in onboarding * Padding changes
This commit is contained in:
parent
7e83f18eca
commit
cd0f53e413
5 changed files with 30 additions and 30 deletions
|
|
@ -35,7 +35,7 @@
|
|||
|
||||
@media screen and (min-width: $breakpoint-s) {
|
||||
justify-content: center;
|
||||
padding: var(--su-7) var(--su-8);
|
||||
padding: var(--su-8);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -97,10 +97,10 @@
|
|||
align-self: flex-end;
|
||||
flex-shrink: 0;
|
||||
width: 100%;
|
||||
border-bottom: 2px solid #000;
|
||||
border-top: 1px solid var(--divider);
|
||||
|
||||
&.intro-slide {
|
||||
border-bottom: none;
|
||||
border-top: none;
|
||||
}
|
||||
|
||||
.navigation-content {
|
||||
|
|
|
|||
|
|
@ -62,12 +62,6 @@ export class EmailPreferencesForm extends Component {
|
|||
aria-labelledby="title"
|
||||
aria-describedby="subtitle"
|
||||
>
|
||||
<Navigation
|
||||
prev={prev}
|
||||
next={this.onSubmit}
|
||||
slidesCount={slidesCount}
|
||||
currentSlideIndex={currentSlideIndex}
|
||||
/>
|
||||
<div className="onboarding-content terms-and-conditions-wrapper">
|
||||
<header className="onboarding-content-header">
|
||||
<h1 id="title" className="title">
|
||||
|
|
@ -111,6 +105,12 @@ export class EmailPreferencesForm extends Component {
|
|||
</fieldset>
|
||||
</form>
|
||||
</div>
|
||||
<Navigation
|
||||
prev={prev}
|
||||
next={this.onSubmit}
|
||||
slidesCount={slidesCount}
|
||||
currentSlideIndex={currentSlideIndex}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -108,13 +108,6 @@ export class FollowTags extends Component {
|
|||
aria-labelledby="title"
|
||||
aria-describedby="subtitle"
|
||||
>
|
||||
<Navigation
|
||||
prev={prev}
|
||||
next={this.handleComplete}
|
||||
canSkip={canSkip}
|
||||
slidesCount={slidesCount}
|
||||
currentSlideIndex={currentSlideIndex}
|
||||
/>
|
||||
<div className="onboarding-content toggle-bottom">
|
||||
<header className="onboarding-content-header">
|
||||
<h1 id="title" className="title">
|
||||
|
|
@ -169,6 +162,13 @@ export class FollowTags extends Component {
|
|||
})}
|
||||
</div>
|
||||
</div>
|
||||
<Navigation
|
||||
prev={prev}
|
||||
next={this.handleComplete}
|
||||
canSkip={canSkip}
|
||||
slidesCount={slidesCount}
|
||||
currentSlideIndex={currentSlideIndex}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -197,13 +197,6 @@ export class FollowUsers extends Component {
|
|||
aria-labelledby="title"
|
||||
aria-describedby="subtitle"
|
||||
>
|
||||
<Navigation
|
||||
prev={prev}
|
||||
next={this.handleComplete}
|
||||
canSkip={canSkip}
|
||||
slidesCount={slidesCount}
|
||||
currentSlideIndex={currentSlideIndex}
|
||||
/>
|
||||
<div className="onboarding-content toggle-bottom">
|
||||
<header className="onboarding-content-header">
|
||||
<h1 id="title" className="title">
|
||||
|
|
@ -271,6 +264,13 @@ export class FollowUsers extends Component {
|
|||
})}
|
||||
</fieldset>
|
||||
</div>
|
||||
<Navigation
|
||||
prev={prev}
|
||||
next={this.handleComplete}
|
||||
canSkip={canSkip}
|
||||
slidesCount={slidesCount}
|
||||
currentSlideIndex={currentSlideIndex}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -190,13 +190,6 @@ export class ProfileForm extends Component {
|
|||
aria-labelledby="title"
|
||||
aria-describedby="subtitle"
|
||||
>
|
||||
<Navigation
|
||||
prev={prev}
|
||||
next={this.onSubmit}
|
||||
canSkip={canSkip}
|
||||
slidesCount={slidesCount}
|
||||
currentSlideIndex={currentSlideIndex}
|
||||
/>
|
||||
{error && (
|
||||
<div role="alert" class="crayons-notice crayons-notice--danger m-2">
|
||||
An error occurred: {errorMessage}
|
||||
|
|
@ -268,6 +261,13 @@ export class ProfileForm extends Component {
|
|||
|
||||
{sections}
|
||||
</div>
|
||||
<Navigation
|
||||
prev={prev}
|
||||
next={this.onSubmit}
|
||||
canSkip={canSkip}
|
||||
slidesCount={slidesCount}
|
||||
currentSlideIndex={currentSlideIndex}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue