You are here

Home » API reference » Social Auth 3.x

auth-icons.css in Social Auth 3.x

Same filename and directory in other branches
  1. 8.2 css/auth-icons.css
  2. 8 css/auth-icons.css
/**
 * Styles for the login form
 */
.social-auth.auth-link {
  border-bottom: none;
}
.social-auth.auth-icon {
  width: 3em;
  margin-right: 5px;
  -webkit-transition: all ease 0.3s;
  -moz-transition: all ease 0.3s;
  -o-transition: all ease 0.3s;
  -ms-transition: all ease 0.3s;
  transition: all ease 0.3s;
}

.social-auth.auth-icon:hover {
  animation-name: grey;
  animation-duration: 0.5s;
  filter: grayscale(1);
}

@keyframes grey {
  from {
    webkit-filter: grayscale(0);
    filter: grayscale(0);
  }
  to {
    webkit-filter: grayscale(1);
    filter: grayscale(1);
  }
}

File

css/auth-icons.css
View source 
  1. /**

  2.  * Styles for the login form

  3.  */

  4. .social-auth.auth-link {

  5.   border-bottom: none;

  6. }

  7. .social-auth.auth-icon {

  8.   width: 3em;

  9.   margin-right: 5px;

  10.   -webkit-transition: all ease 0.3s;

  11.   -moz-transition: all ease 0.3s;

  12.   -o-transition: all ease 0.3s;

  13.   -ms-transition: all ease 0.3s;

  14.   transition: all ease 0.3s;

  15. }

  16. 

  17. .social-auth.auth-icon:hover {

  18.   animation-name: grey;

  19.   animation-duration: 0.5s;

  20.   filter: grayscale(1);

  21. }

  22. 

  23. @keyframes grey {

  24.   from {

  25.     webkit-filter: grayscale(0);

  26.     filter: grayscale(0);

  27.   }

  28.   to {

  29.     webkit-filter: grayscale(1);

  30.     filter: grayscale(1);

  31.   }

  32. }