norm/Gainsight
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Luminate Templates, notes for walmart, Crayon changes.

Browse Source
This commit is contained in:
Norm Rasmussen
2023-06-14 17:30:03 -04:00
parent 1a6b3a630c
commit 73ae8fe55b
76 changed files with 7040 additions and 111 deletions
Download Patch File Download Diff File Expand all files Collapse all files

217
Custom_Templates/customer_templates/Crayon/auth_url_email.html.liquid Normal file
View File

@ -0,0 +1,217 @@
<main class="np-box-container np-open-access">
<div class="np-box sign-up-body">
<div class="np-box-content-container sign-up-body-content-container login-body-content-container">
<div class="sign-in-text-content-wrapper login-text-content-wrapper">
<img class="login-logo" src="https://s3.amazonaws.com/static.northpass.com/Crayon/crayon_logo_horizontal.png" alt="Welcome To Crayon Academy!">
<div class="np-form-headline login-text">
<span class="welcome-header"> Welcome to <span style="color: #FEC311">Crayon Academy</span></span>
</div>
<div class="np-form-subheadline login-text">
<span class="welcome-subheader">Whether you're a new or returning learner, please complete the form to access the academy.
<span class="login-emoji-mobile"> 👇</span>
<span class="login-emoji-desktop">👉</span></span>
</div>
</div>
<div class="sign-in-form-content-wrapper login-form-wrapper">
<form class="np-form np-box-content login-form" action="{{ form.url }}" method="get" novalidate>
{% form_authenticity_token %}
<div class="np-form-field">
<label class="np-input-label login-text login-input-label" for="learner_first_name">
First name
</label>
<input
autofocus="autofocus"
class="np-input login-input"
id="learner_first_name"
name="first_name"
placeholder="e.g., Jane"
type="text"
value="{{ form.first_name }}"
/>
</div>
<div class="np-form-field">
<label class="np-input-label login-text login-input-label" for="learner_last_name">
Last name
</label>
<input
type="text"
class="np-input login-input"
value="{{ form.last_name }}"
id="learner_last_name"
placeholder="e.g., Smith"
name="last_name"
/>
</div>
<div class="np-form-field">
<label class="np-input-label login-text login-input-label" for="learner_email">
Email
</label>
<input
type="text"
class="np-input login-input"
value="{{ form.email }}"
id="learner_email"
placeholder="e.g., jane.smith@acme.com"
name="email"
/>
</div>
<input
class="np-button np-button-big np-form-action login-button"
name="commit"
type="submit"
value="{% t shared.enter %}"
/>
</form>
</div>
</div>
</div>
</main>
<style>
.np-open-access{
height: 100%;
}
.sign-up-body{
align-items: center;
background: #0538BF;
border-radius: 0;
display: flex;
height: 100%;
justify-content: center;
margin: 0 !important;
width: 100%;
}
.sign-up-body-content-container{
align-items: center;
display: flex;
flex-direction: column;
height: 100%;
justify-content: space-evenly;
margin: 0 !important;
}
.sign-in-text-content-wrapper{
text-align: center;
}
.login-logo{
height: 100px;
padding: 20px;
}
.login-text{
color: #FFFFFF;
}
.welcome-header{
font-size: 36px;
}
.welcome-subheader{
font-size: 24px;
}
.login-emoji-desktop{
display: none;
}
.login-form-wrapper{
width: 80%;
}
.login-input-label{
font-size: 14px;
margin-bottom: 10px;
}
.login-input{
background: #FEC311;
border: 3px solid #FFFFFF;
border-radius: 0;
}
.login-button{
background: #FEC311;
border: 2px solid #FFFFFF;
color: #000000;
font-size: 30px;
margin-top: 30px;
padding: 0;
}
.login-button:hover{
background: #0538BF;
color: #FFFFFF;
}
@media screen and (min-width: 768px){
.np-box-content-container{
flex-direction: row;
}
.login-text-content-wrapper{
align-items: flex-start;
height: 100%;
display: flex;
flex-direction: column;
justify-content: center;
max-width: 50%;
}
.login-logo{
padding-left: 0;
}
.login-text{
text-align: left;
}
.welcome-header{
font-size: 62px;
}
.welcome-subheader{
font-size: 24px;
}
.login-emoji-mobile{
display: none;
}
.login-emoji-desktop{
display: inline;
}
.login-form-wrapper{
align-items: flex-end;
display: flex;
flex-direction: column;
max-width: 50%;
}
.login-form{
width: 80%;
}
}
@media screen and (min-width: 1000px){
.login-body-content-container{
padding: 75px;
}
}
@media screen and (min-width: 1200px){
.welcome-header{
font-size: 80px;
}
.welcome-subheader{
font-size: 36px;
}
}
</style>