mirror of
https://github.com/elyby/accounts-frontend.git
synced 2024-12-27 07:20:23 +05:30
Поправлен стиль для полей ввода и кнопок, изменены отступы для блока описания приложения и изменена ширина всего сайта
This commit is contained in:
parent
54fff54135
commit
6f742ea22a
@ -2,19 +2,19 @@
|
|||||||
@import '~components/ui/fonts.scss';
|
@import '~components/ui/fonts.scss';
|
||||||
|
|
||||||
.appInfo {
|
.appInfo {
|
||||||
padding: 55px 15px;
|
padding: 55px 25px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.logoContainer {
|
.logoContainer {
|
||||||
position: relative;
|
position: relative;
|
||||||
padding: 15px;
|
padding: 15px 0;
|
||||||
|
|
||||||
&:after {
|
&:after {
|
||||||
content: '';
|
content: '';
|
||||||
display: block;
|
display: block;
|
||||||
|
|
||||||
position: absolute;
|
position: absolute;
|
||||||
left: 25px;
|
left: 0;
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
height: 3px;
|
height: 3px;
|
||||||
width: 40px;
|
width: 40px;
|
||||||
@ -26,7 +26,7 @@
|
|||||||
.logo {
|
.logo {
|
||||||
font-family: $font-family-title;
|
font-family: $font-family-title;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
font-size: 22px;
|
font-size: 36px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.descriptionContainer {
|
.descriptionContainer {
|
||||||
|
@ -47,6 +47,10 @@
|
|||||||
&:active {
|
&:active {
|
||||||
background-color: $black-button-dark;
|
background-color: $black-button-dark;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
&:focus {
|
||||||
|
outline: none;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@include button-color('blue', $blue);
|
@include button-color('blue', $blue);
|
||||||
|
@ -29,9 +29,9 @@
|
|||||||
border: 2px solid lighter($black);
|
border: 2px solid lighter($black);
|
||||||
background: $black;
|
background: $black;
|
||||||
|
|
||||||
font-size: 20px;
|
font-size: 18px;
|
||||||
color: #aaa;
|
color: #aaa;
|
||||||
font-family: $font-family-base;
|
font-family: $font-family-title;
|
||||||
padding: 0 10px;
|
padding: 0 10px;
|
||||||
|
|
||||||
transition: border-color .25s;
|
transition: border-color .25s;
|
||||||
@ -52,6 +52,7 @@
|
|||||||
&:focus {
|
&:focus {
|
||||||
border-color: $green;
|
border-color: $green;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
|
outline: none;
|
||||||
|
|
||||||
~ .formFieldIcon {
|
~ .formFieldIcon {
|
||||||
background: $green;
|
background: $green;
|
||||||
@ -72,5 +73,7 @@
|
|||||||
border: 2px solid lighter($black);
|
border: 2px solid lighter($black);
|
||||||
color: #444;
|
color: #444;
|
||||||
|
|
||||||
transition: border-color .25s;
|
// Анимация фона должна быть быстрее анимации рамки, т.к. визуально фон заполняется медленнее
|
||||||
|
transition: border-color .25s,
|
||||||
|
background-color .20s;
|
||||||
}
|
}
|
||||||
|
@ -1,16 +1,18 @@
|
|||||||
@import "~components/ui/colors.scss";
|
@import "~components/ui/colors.scss";
|
||||||
|
|
||||||
|
$sidebar-width: 320px;
|
||||||
|
|
||||||
.sidebar {
|
.sidebar {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 50px;
|
top: 50px;
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
left: 0;
|
left: 0;
|
||||||
width: 300px;
|
width: $sidebar-width;
|
||||||
|
|
||||||
background: $black;
|
background: $black;
|
||||||
}
|
}
|
||||||
|
|
||||||
.content {
|
.content {
|
||||||
margin-left: 300px;
|
margin-left: $sidebar-width;
|
||||||
padding: 55px 50px;
|
padding: 55px 50px;
|
||||||
}
|
}
|
||||||
|
@ -6,7 +6,7 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.wrapper {
|
.wrapper {
|
||||||
width: 736px;
|
width: 756px;
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user