login-fire-styles.html

<!--
@license
Copyright (c) 2016 Convoo All Rights Reserved.
Use of this source code is governed by a MIT license that can be found in the
LICENSE file or at https://github.com/convoo/login-fire/blob/master/LICENSE.
-->
<dom-module id="login-fire-styles">
  <template>
    <style>
      .btn--anonymous {
        background-color: #303030;
        color: #ffffff;
      }
      .btn--anonymous:hover {
        background-color: #414040;
      }
      .btn--facebook {
        background-color: #3b5999;
        color: #ffffff;
      }
      .btn--facebook:hover {
        background-color: #4265b0;
      }
      .btn--github {
        color: black;
        background-color: #f5f5f5;
      }
      .btn--github:hover {
        background-color: #ffffff;
      }
      .btn--google {
        color: black;
        background-color: #ffffff;
      }
      .btn--mini {
        max-width: 140px;
      }
      .btn--twitter {
        background-color: #55acee;
        color: #ffffff;
      }
      .btn--twitter:hover {
        background-color: #5cb9ff;
      }
      .btn-progress  {
        position: absolute;
        left: 0;
        bottom: 0;
        width: 100%;
        border-radius: 0px 0px 3px 3px;
        --paper-progress-active-color: var(--login-fire-progress-active-color, var(--login-fire-progress-default-active-color));
        --paper-progress-container-color: var(--login-fire-progress-container-color, var(--login-fire-progress-default-container-color));
      }
      paper-button.btn--twitter > paper-progress.btn-progress {
        --login-fire-progress-default-active-color: #55acee;
      }
      paper-button.btn--anonymous > paper-progress.btn-progress {
        --login-fire-progress-default-active-color: #303030;
      }
      paper-button.btn--google > paper-progress.btn-progress {
        --login-fire-progress-default-active-color: black;
      }
      paper-button.btn--facebook > paper-progress.btn-progress {
        --login-fire-progress-default-active-color: #3b5999;
      }
      paper-button.btn--github > paper-progress.btn-progress {
        --login-fire-progress-default-active-color: black;
      }
    </style>
  </template>
</dom-module>