1 files changed, 27 insertions, 2 deletions
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'
+}