Поправлен стиль для полей ввода и кнопок, изменены отступы для блока описания приложения и изменена ширина всего сайта

This commit is contained in:
ErickSkrauch 2016-01-09 12:51:29 +03:00
parent 54fff54135
commit 6f742ea22a
5 changed files with 19 additions and 10 deletions

View File

@ -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 {

View File

@ -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);

View File

@ -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;
} }

View File

@ -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;
} }

View File

@ -6,7 +6,7 @@
} }
.wrapper { .wrapper {
width: 736px; width: 756px;
margin: 0 auto; margin: 0 auto;
} }