Skip to content

Minds Frontend
Minds Frontend
Commit 8256dad8 authored by Marcelo Rivera's avatar Marcelo Rivera
Browse files
Options
  • Download

(fix): several styling fixes

parent 0df9c772
No related merge requests found
Pipeline #106890187 running with stages
Hide whitespace changes
Inline Side-by-side
Showing with 99 additions and 42 deletions
src/app/modules/auth/login.component.html
View file @ 8256dad8
<div class="m-grid" *mIfFeature="'register_pages-december-2019'; else oldLogin">
<div
class="m-grid__column-6 m-grid__column__skip-4 m-grid__column-8--tablet m-grid__column__skip-3--tablet m-grid__column-10--mobile m-grid__column__skip-2--mobile"
class="m-grid__column-7 m-grid__column__skip-4 m-grid__column-10--tablet m-grid__column__skip-2--tablet m-grid__column-12--mobile m-grid__column__skip-1--mobile"
>
<div class="m-login__wrapper">
<minds-form-login
......
src/app/modules/auth/login.component.scss
View file @ 8256dad8
......@@ -68,6 +68,10 @@ m-login {
.m-grid {
height: 100%;
padding: 20vh 0;
@media screen and (max-width: $m-grid-max-mobile) {
padding: 5vh 0;
}
}
.m-login__wrapper {
......@@ -76,9 +80,6 @@ m-login {
}
minds-form-login {
@media screen and (max-width: $m-grid-max-mobile) {
padding: 48px 25px;
}
display: block;
background-color: #fcfcfc;
......@@ -86,6 +87,23 @@ m-login {
clip-path: polygon(0 2%, 100% 0, 100% 97%, 0 95%);
@media screen and (max-width: $m-grid-max-mobile) {
padding: 55px 26px 47px;
h3,
.m-register__alreadyAUser {
text-align: center;
}
.mdl-card__actions {
margin-top: 35px;
label.mdl-checkbox {
margin-bottom: 50px;
}
}
}
h3 {
font-size: 36px;
line-height: 48px;
......
src/app/modules/auth/register.component.html
View file @ 8256dad8
......@@ -3,7 +3,7 @@
*mIfFeature="'register_pages-december-2019'; else registerBlock"
>
<div
class="m-grid__column-6 m-grid__column__skip-4 m-grid__column-8--tablet m-grid__column__skip-3--tablet m-grid__column-12--mobile m-grid__column__skip-1--mobile"
class="m-grid__column-7 m-grid__column__skip-4 m-grid__column-10--tablet m-grid__column__skip-2--tablet m-grid__column-12--mobile m-grid__column__skip-1--mobile"
>
<div class="m-register__wrapper">
<minds-form-register
......
src/app/modules/auth/register.component.scss
View file @ 8256dad8
......@@ -43,6 +43,10 @@ m-register {
.m-grid {
height: 100%;
padding: 20vh 0;
@media screen and (max-width: $m-grid-max-mobile) {
padding: 5vh 0;
}
}
.m-register__wrapper {
......@@ -56,8 +60,20 @@ m-register {
background-color: #fcfcfc;
@media screen and (max-width: $m-grid-max-mobile) {
padding-left: 25px;
padding-right: 25px;
padding: 55px 26px 47px;
h3,
.m-register__alreadyAUser {
text-align: center;
}
.mdl-card__actions {
margin-top: 35px;
label.mdl-checkbox {
margin-bottom: 50px;
}
}
}
clip-path: polygon(0 2%, 100% 0, 100% 97%, 0 95%);
......@@ -74,10 +90,10 @@ m-register {
}
.m-register__alreadyAUser {
display: inline-block;
display: block;
font-size: 14px;
line-height: 19px;
margin-bottom: 19px;
margin-bottom: 30px;
font-weight: 400;
color: #9b9b9b;
......
src/app/modules/forms/login/login.scss
View file @ 8256dad8
......@@ -12,6 +12,16 @@ m-login {
color: themed($m-blue);
}
}
@media screen and(max-width: $m-grid-max-mobile) {
flex-direction: column;
margin-right: 0;
margin-bottom: 24px;
h3 {
margin-bottom: 0;
}
}
}
.m-login__error,
......
src/app/modules/onboarding-v2/page/onboarding.component.scss
View file @ 8256dad8
......@@ -56,12 +56,6 @@ m-onboarding {
padding: 50px 20px;
}
@media screen and(max-width: 740px) {
.m-onboarding__progressbar {
padding-top: 20px;
}
}
.m-onboarding__description {
margin: 35px 0;
font-size: 16px;
......@@ -126,7 +120,7 @@ m-onboarding {
text-align: center;
}
&:not(.m-onboarding__noticeTitle) {
&:not(.m-onboarding__noticeTitle):not(.m-onboardingProgressbar__stepName) {
@media screen and (max-width: 740px) {
color: #a2a2a2;
font-size: 13px;
......@@ -136,6 +130,7 @@ m-onboarding {
text-align: center;
margin-top: 50px;
margin-bottom: 0;
padding-bottom: 0;
}
}
}
......@@ -245,23 +240,34 @@ m-onboarding {
}
.m-onboardingControl__label {
position: relative;
& > label {
font-size: 14px;
line-height: 19px;
margin-bottom: 8px;
}
& > span {
font-style: italic;
position: absolute;
right: 0;
top: 0;
}
}
& > * {
margin-bottom: 8px;
}
input[type='text'],
input[type='number'] {
display: block;
width: 100%;
height: 36px;
border: 1px solid #e8e8e8;
font-size: 14px;
padding-left: 8px;
margin-bottom: 8px;
@include m-theme() {
color: themed($m-grey-800);
}
&:active,
&:focus {
......@@ -278,6 +284,7 @@ m-onboarding {
m-phone-input {
display: flex;
margin-bottom: 8px;
.m-phone-input--wrapper {
justify-content: flex-start;
......@@ -290,6 +297,12 @@ m-onboarding {
width: 100%;
padding-left: 8px;
font-size: 14px;
@include m-theme() {
color: themed($m-grey-800);
}
&:active,
&:focus {
outline: 1px solid #4a90e2;
......@@ -339,6 +352,7 @@ m-onboarding {
margin-left: 10px;
.m-tooltip--anchor {
font-weight: bold;
color: rgba(0, 0, 0, 0.5);
}
......@@ -374,6 +388,7 @@ m-onboarding {
font-size: 16px !important;
line-height: 21px !important;
font-weight: 300 !important;
height: 56px !important;
}
.mf-button--alt {
......@@ -382,5 +397,6 @@ m-onboarding {
color: white !important;
font-size: 20px !important;
line-height: 26px !important;
height: 56px !important;
}
}
src/app/modules/onboarding-v2/steps/info/phone-input/input.component.html
View file @ 8256dad8
......@@ -13,31 +13,28 @@
<span i18n>Optional</span>
</div>
<div class="m-onboarding__control">
<div class="m-onboarding__phoneInput">
<div class="m-onboarding__input">
<m-phone-input [(ngModel)]="number" ngDefaultControl></m-phone-input>
<div class="m-onboarding__error" *ngIf="numberError">
{{ numberError }}
</div>
<div class="m-onboarding__phoneInput">
<div class="m-onboarding__input">
<m-phone-input [(ngModel)]="number" ngDefaultControl></m-phone-input>
<div class="m-onboarding__error" *ngIf="numberError">
{{ numberError }}
</div>
</div>
<div
*ngIf="inProgress"
class="mdl-spinner mdl-js-spinner is-active"
[mdl]
></div>
<div
*ngIf="inProgress"
class="mdl-spinner mdl-js-spinner is-active"
[mdl]
></div>
<div
class="m-onboardingInput__saveButton"
[class.disabled]="!number || number.length < 13"
(click)="savePhoneNumber()"
*ngIf="!inProgress"
i18n
>
<i class="material-icons">check</i>
</div>
<div
class="m-onboardingInput__saveButton"
[class.disabled]="!number || number.length < 13"
(click)="savePhoneNumber()"
*ngIf="!inProgress"
i18n
>
<i class="material-icons">check</i>
</div>
</div>
</ng-container>
......
Please register or to comment