From 6f742ea22af91be43c46647219224fed90b3298a Mon Sep 17 00:00:00 2001
From: ErickSkrauch <erickskrauch@yandex.ru>
Date: Sat, 9 Jan 2016 12:51:29 +0300
Subject: [PATCH] =?UTF-8?q?=D0=9F=D0=BE=D0=BF=D1=80=D0=B0=D0=B2=D0=BB?=
 =?UTF-8?q?=D0=B5=D0=BD=20=D1=81=D1=82=D0=B8=D0=BB=D1=8C=20=D0=B4=D0=BB?=
 =?UTF-8?q?=D1=8F=20=D0=BF=D0=BE=D0=BB=D0=B5=D0=B9=20=D0=B2=D0=B2=D0=BE?=
 =?UTF-8?q?=D0=B4=D0=B0=20=D0=B8=20=D0=BA=D0=BD=D0=BE=D0=BF=D0=BE=D0=BA,?=
 =?UTF-8?q?=20=D0=B8=D0=B7=D0=BC=D0=B5=D0=BD=D0=B5=D0=BD=D1=8B=20=D0=BE?=
 =?UTF-8?q?=D1=82=D1=81=D1=82=D1=83=D0=BF=D1=8B=20=D0=B4=D0=BB=D1=8F=20?=
 =?UTF-8?q?=D0=B1=D0=BB=D0=BE=D0=BA=D0=B0=20=D0=BE=D0=BF=D0=B8=D1=81=D0=B0?=
 =?UTF-8?q?=D0=BD=D0=B8=D1=8F=20=D0=BF=D1=80=D0=B8=D0=BB=D0=BE=D0=B6=D0=B5?=
 =?UTF-8?q?=D0=BD=D0=B8=D1=8F=20=D0=B8=20=D0=B8=D0=B7=D0=BC=D0=B5=D0=BD?=
 =?UTF-8?q?=D0=B5=D0=BD=D0=B0=20=D1=88=D0=B8=D1=80=D0=B8=D0=BD=D0=B0=20?=
 =?UTF-8?q?=D0=B2=D1=81=D0=B5=D0=B3=D0=BE=20=D1=81=D0=B0=D0=B9=D1=82=D0=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/auth/appInfo.scss | 8 ++++----
 src/components/ui/buttons.scss   | 4 ++++
 src/components/ui/form.scss      | 9 ++++++---
 src/pages/auth/auth.scss         | 6 ++++--
 src/pages/root/root.scss         | 2 +-
 5 files changed, 19 insertions(+), 10 deletions(-)

diff --git a/src/components/auth/appInfo.scss b/src/components/auth/appInfo.scss
index d8a5878..a6a9537 100644
--- a/src/components/auth/appInfo.scss
+++ b/src/components/auth/appInfo.scss
@@ -2,19 +2,19 @@
 @import '~components/ui/fonts.scss';
 
 .appInfo {
-    padding: 55px 15px;
+    padding: 55px 25px;
 }
 
 .logoContainer {
     position: relative;
-    padding: 15px;
+    padding: 15px 0;
 
     &:after {
         content: '';
         display: block;
 
         position: absolute;
-        left: 25px;
+        left: 0;
         bottom: 0;
         height: 3px;
         width: 40px;
@@ -26,7 +26,7 @@
 .logo {
     font-family: $font-family-title;
     color: #fff;
-    font-size: 22px;
+    font-size: 36px;
 }
 
 .descriptionContainer {
diff --git a/src/components/ui/buttons.scss b/src/components/ui/buttons.scss
index f89c346..15613f9 100644
--- a/src/components/ui/buttons.scss
+++ b/src/components/ui/buttons.scss
@@ -47,6 +47,10 @@
     &:active {
         background-color: $black-button-dark;
     }
+
+    &:focus {
+        outline: none;
+    }
 }
 
 @include button-color('blue', $blue);
diff --git a/src/components/ui/form.scss b/src/components/ui/form.scss
index 800b1ca..3f664ed 100644
--- a/src/components/ui/form.scss
+++ b/src/components/ui/form.scss
@@ -29,9 +29,9 @@
     border: 2px solid lighter($black);
     background: $black;
 
-    font-size: 20px;
+    font-size: 18px;
     color: #aaa;
-    font-family: $font-family-base;
+    font-family: $font-family-title;
     padding: 0 10px;
 
     transition: border-color .25s;
@@ -52,6 +52,7 @@
     &:focus {
         border-color: $green;
         color: #fff;
+        outline: none;
 
         ~ .formFieldIcon {
             background: $green;
@@ -72,5 +73,7 @@
     border: 2px solid lighter($black);
     color: #444;
 
-    transition: border-color .25s;
+    // Анимация фона должна быть быстрее анимации рамки, т.к. визуально фон заполняется медленнее
+    transition: border-color .25s,
+                background-color .20s;
 }
diff --git a/src/pages/auth/auth.scss b/src/pages/auth/auth.scss
index a403a1c..e945dc7 100644
--- a/src/pages/auth/auth.scss
+++ b/src/pages/auth/auth.scss
@@ -1,16 +1,18 @@
 @import "~components/ui/colors.scss";
 
+$sidebar-width: 320px;
+
 .sidebar {
     position: absolute;
     top: 50px;
     bottom: 0;
     left: 0;
-    width: 300px;
+    width: $sidebar-width;
 
     background: $black;
 }
 
 .content {
-    margin-left: 300px;
+    margin-left: $sidebar-width;
     padding: 55px 50px;
 }
diff --git a/src/pages/root/root.scss b/src/pages/root/root.scss
index e3d3a86..99514a1 100644
--- a/src/pages/root/root.scss
+++ b/src/pages/root/root.scss
@@ -6,7 +6,7 @@
 }
 
 .wrapper {
-    width: 736px;
+    width: 756px;
     margin: 0 auto;
 }