Merge pull request #20206 from edx/waheed/PROD-174-fix-social-auth-buttons
Fix Facebook and Google social auth buttons.
This commit is contained in:
@@ -471,8 +471,8 @@
|
||||
.icon-image {
|
||||
width: auto;
|
||||
height: auto;
|
||||
max-height: 1.4em;
|
||||
max-width: 1.4em;
|
||||
max-height: 2em;
|
||||
max-width: 2em;
|
||||
margin-top: -2px;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -593,22 +593,22 @@
|
||||
|
||||
&.button-oa2-google-oauth2:hover,
|
||||
&.button-oa2-google-oauth2:focus {
|
||||
background-color: $google-red;
|
||||
border: 1px solid #a5382b;
|
||||
background-color: $google-focus-blue;
|
||||
border: 1px solid $google-focus-blue;
|
||||
}
|
||||
|
||||
&.button-oa2-google-oauth2:hover {
|
||||
box-shadow: 0 2px 1px 0 #8d3024;
|
||||
box-shadow: 0 2px 1px 0 $google-focus-blue;
|
||||
}
|
||||
|
||||
&.button-oa2-facebook:hover,
|
||||
&.button-oa2-facebook:focus {
|
||||
background-color: $facebook-blue;
|
||||
border: 1px solid #263a62;
|
||||
background-color: $facebook-focus-blue;
|
||||
border: 1px solid $facebook-focus-blue;
|
||||
}
|
||||
|
||||
&.button-oa2-facebook:hover {
|
||||
box-shadow: 0 2px 1px 0 #30487c;
|
||||
box-shadow: 0 2px 1px 0 $facebook-focus-blue;
|
||||
}
|
||||
|
||||
&.button-oa2-linkedin-oauth2:hover,
|
||||
|
||||
@@ -186,10 +186,13 @@ $ui-notification-height: ($baseline*10);
|
||||
|
||||
// social platforms
|
||||
$twitter-blue: #55acee;
|
||||
$facebook-blue: #3b5998;
|
||||
$facebook-blue: #4267b2;
|
||||
$facebook-focus-blue: #29487d;
|
||||
$linkedin-blue: #0077b5;
|
||||
$google-red: #d73924;
|
||||
$microsoft-black: #000;
|
||||
$google-blue: #4285f4;
|
||||
$google-focus-blue: #287ae6;
|
||||
$microsoft-black: #2f2f2f;
|
||||
$microsoft-focus-black: #000;
|
||||
|
||||
// shadows
|
||||
$shadow: rgba(0, 0, 0, 0.2) !default;
|
||||
|
||||
@@ -557,31 +557,43 @@
|
||||
}
|
||||
|
||||
&.button-oa2-google-oauth2 {
|
||||
color: $google-red;
|
||||
color: white;
|
||||
border-color: $google-blue;
|
||||
background-color: $google-blue;
|
||||
|
||||
.icon {
|
||||
background: $google-red;
|
||||
background: transparent;
|
||||
|
||||
.icon-image {
|
||||
margin-left: 2px;
|
||||
}
|
||||
}
|
||||
|
||||
&:hover,
|
||||
&:focus {
|
||||
background-color: $google-red;
|
||||
border: 1px solid #a5382b;
|
||||
background-color: $google-focus-blue;
|
||||
border: 1px solid $google-focus-blue;
|
||||
color: $white;
|
||||
}
|
||||
}
|
||||
|
||||
&.button-oa2-facebook {
|
||||
color: $facebook-blue;
|
||||
color: white;
|
||||
border-color: $facebook-blue;
|
||||
background-color: $facebook-blue;
|
||||
|
||||
.icon {
|
||||
background: $facebook-blue;
|
||||
background: transparent;
|
||||
|
||||
.icon-image {
|
||||
margin-left: 2px;
|
||||
}
|
||||
}
|
||||
|
||||
&:hover,
|
||||
&:focus {
|
||||
background-color: $facebook-blue;
|
||||
border: 1px solid #263a62;
|
||||
background-color: $facebook-focus-blue;
|
||||
border: 1px solid $facebook-focus-blue;
|
||||
color: $white;
|
||||
}
|
||||
}
|
||||
@@ -602,16 +614,18 @@
|
||||
}
|
||||
|
||||
&.button-oa2-azuread-oauth2 {
|
||||
color: $microsoft-black;
|
||||
color: white;
|
||||
border-color: $microsoft-black;
|
||||
background-color: $microsoft-black;
|
||||
|
||||
.icon {
|
||||
background: $microsoft-black;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
&:hover,
|
||||
&:focus {
|
||||
background-color: $microsoft-black;
|
||||
border: 1px solid $microsoft-black;
|
||||
background-color: $microsoft-focus-black;
|
||||
border: 1px solid $microsoft-focus-black;
|
||||
color: $white;
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user