From 95a88c4bb3733200912a877821c0a919d42022b6 Mon Sep 17 00:00:00 2001
From: Vitaly Takmazov
Date: Fri, 22 Jun 2018 11:34:38 +0300
Subject: styling social buttons

---
 vnext/src/components/LoginButton.js | 29 +++++++++++++++++++++++++++--
 1 file changed, 27 insertions(+), 2 deletions(-)

(limited to 'vnext/src/components/LoginButton.js')

diff --git a/vnext/src/components/LoginButton.js b/vnext/src/components/LoginButton.js
index 2f73a4ee..22ae2198 100644
--- a/vnext/src/components/LoginButton.js
+++ b/vnext/src/components/LoginButton.js
@@ -57,8 +57,15 @@ export default class LoginButton extends React.Component {
           onClose={this.toggleModal}>
           <div className="dialoglogin">
             <p>Please, introduce yourself:</p>
-            <a href={`https://api.juick.com/_fblogin?state=${window.location.protocol}//${window.location.host}${window.location.pathname}`} id="signfb"><Icon name="ei-sc-facebook" size="s" />Login with facebook</a>
-            <a href={`https://api.juick.com/_vklogin?state=${window.location.protocol}//${window.location.host}${window.location.pathname}`} id="signvk"><Icon name="ei-sc-vk" size="s" />Login with VK</a>
+            <div style={socialButtonsStyle}>
+            <a href={`https://api.juick.com/_fblogin?state=${window.location.protocol}//${window.location.host}${window.location.pathname}`} style={facebookButtonStyle}>
+            <Icon name="ei-sc-facebook" size="s" noFill={true} />Log in
+            </a>
+            <a href={`https://api.juick.com/_vklogin?state=${window.location.protocol}//${window.location.host}${window.location.pathname}`} style={vkButtonStyle}>
+            <Icon name="ei-sc-vk" size="s" noFill={true} />
+            Log in
+            </a>
+            </div>
             <p>Already registered?</p>
             <form onSubmit={this.login.bind(this)}>
               <input className="signinput"
@@ -83,3 +90,21 @@ LoginButton.propTypes = {
   title: PropTypes.string.isRequired,
   onAuth: PropTypes.func.isRequired
 };
+
+const socialButtonsStyle = {
+  display: 'flex',
+  justifyContent: 'space-evenly',
+  padding: '4px'
+}
+
+const facebookButtonStyle = {
+  color: '#fff',
+  padding: '2px 14px',
+  background: '#3b5998'
+}
+
+const vkButtonStyle = {
+  color: '#fff',
+  padding: '2px 14px',
+  background: '#4c75a3'
+}
-- 
cgit v1.2.3