lino.jorzick/greenlight
1
0
Fork 0
forked from External/greenlight
Code Issues Pull Requests Projects Releases Wiki Activity

Unify the UI style in sign up, sign in buttons when using omniauth (GRN-35) (#301)

Browse Source 
* Changed style to buttons for sign up

* Added assets and generalized code for sign up buttons

* Added new style to sign in modal

* Replaced hex colors with the official ones

* Removed the old social icons that are no longer used

* Centred text in sign up buttons

* Base button rendering on iconset_providers and secured office 365
This commit is contained in:
Jesus Federico
2018-10-17 12:41:57 -04:00
committed by GitHub
parent 1bb5be68a5
commit 207ec6ffb2
11 changed files with 68 additions and 51 deletions
Download Patch File Download Diff File Expand all files Collapse all files

59
app/assets/stylesheets/main.scss
View File

@ -58,10 +58,10 @@
font-weight: normal;
}
.customBtn-google {
display: inline-block;
background: #4688F1;
.customBtn {
display: block;
text-align: center;
background: #cccccc;
color: #ffffff;
box-shadow: 0 2px 4px 0 rgba(0,0,0,.25);
-webkit-transition: background-color .218s,border-color .218s,box-shadow .218s;
@ -69,6 +69,7 @@
white-space: nowrap;
border-radius: 2px;
border: 1px solid transparent;
margin-bottom:20px;
&:hover {
cursor: pointer;
color: #ffffff;
@ -93,5 +94,53 @@
font-family: 'Roboto', sans-serif;
}
.customBtn-image {
background: #ffffff;
background-size: 18px 18px;
padding:10px 10px 10px 10px;
}
}
.customBtn-google {
@extend .customBtn;
background: #4688f1;
.customBtn-image {
background: #ffffff image-url("google-logo.png") no-repeat left top;
background-size: 18px 18px;
padding:10px 10px 10px 10px;
}
}
.customBtn-twitter {
@extend .customBtn;
background: #1da1f2;
.customBtn-image {
background: #ffffff image-url("twitter-logo.png") no-repeat left top;
background-size: 18px 18px;
padding:10px 10px 10px 10px;
}
}
.customBtn-microsoft_office365 {
@extend .customBtn;
background: #f65314;
.customBtn-image {
background: #ffffff image-url("office365-logo.jpeg") no-repeat left top;
background-size: 18px 18px;
padding:10px 10px 10px 10px;
}
}
.customBtn-microsoft_windows {
@extend .customBtn;
background: #00a1f1;
.customBtn-image {
background: #ffffff image-url("windows-logo.png") no-repeat left top;
background-size: 18px 18px;
padding:10px 10px 10px 10px;
}
}