Use back button svg icon in onboarding slides (#7455) [deploy]

This commit is contained in:
Vaidehi Joshi 2020-04-22 16:54:46 -07:00 committed by GitHub
parent 5f67f7b2e3
commit 046ec2eaee
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 54 additions and 5 deletions

View file

@ -126,6 +126,15 @@
@extend .crayons-btn;
}
.back-button {
@extend .crayons-btn;
@extend .crayons-btn--ghost;
@extend .crayons-btn--icon;
align-items: center;
display: flex;
}
.stepper {
display: flex;
align-items: center;

View file

@ -12,7 +12,15 @@ preact-render-spy (1 nodes)
class="back-button"
type="button"
>
Back
<svg
width="16"
height="16"
fill="none"
class="crayons-icon"
xmlns="http://www.w3.org/2000/svg"
>
<path d="M3.828 7H16v2H3.828l5.364 5.364-1.414 1.414L0 8 7.778.222l1.414 1.414L3.828 7z"></path>
</svg>
</button>
<div class="stepper">
<span class="dot active"></span>
@ -86,7 +94,15 @@ preact-render-spy (1 nodes)
class="back-button"
type="button"
>
Back
<svg
width="16"
height="16"
fill="none"
class="crayons-icon"
xmlns="http://www.w3.org/2000/svg"
>
<path d="M3.828 7H16v2H3.828l5.364 5.364-1.414 1.414L0 8 7.778.222l1.414 1.414L3.828 7z"></path>
</svg>
</button>
<div class="stepper">
<span class="dot active"></span>
@ -184,7 +200,15 @@ preact-render-spy (1 nodes)
class="back-button"
type="button"
>
Back
<svg
width="16"
height="16"
fill="none"
class="crayons-icon"
xmlns="http://www.w3.org/2000/svg"
>
<path d="M3.828 7H16v2H3.828l5.364 5.364-1.414 1.414L0 8 7.778.222l1.414 1.414L3.828 7z"></path>
</svg>
</button>
<div class="stepper">
<span class="dot active"></span>
@ -393,7 +417,15 @@ preact-render-spy (1 nodes)
class="back-button"
type="button"
>
Back
<svg
width="16"
height="16"
fill="none"
class="crayons-icon"
xmlns="http://www.w3.org/2000/svg"
>
<path d="M3.828 7H16v2H3.828l5.364 5.364-1.414 1.414L0 8 7.778.222l1.414 1.414L3.828 7z"></path>
</svg>
</button>
<div class="stepper">
<span class="dot active"></span>

View file

@ -42,7 +42,15 @@ class Navigation extends Component {
>
{!hidePrev && (
<button onClick={prev} className="back-button" type="button">
Back
<svg
width="16"
height="16"
fill="none"
className="crayons-icon"
xmlns="http://www.w3.org/2000/svg"
>
<path d="M3.828 7H16v2H3.828l5.364 5.364-1.414 1.414L0 8 7.778.222l1.414 1.414L3.828 7z" />
</svg>
</button>
)}