bia-framework/components/core-button/core-button.style.css

Bia Framework to work with angular 2

/*#endregion */
.core-button {
  position: relative;
  border: none;
  padding: 0px 8px;
  overflow: hidden;
  outline: none;
  cursor: pointer;
  text-decoration: none;
  -webkit-transition: all 0.2s cubic-bezier(0.4, 0, 1, 1), background-color 0.2s cubic-bezier(0.4, 0, 0.2, 1), color 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  -moz-transition: all 0.2s cubic-bezier(0.4, 0, 1, 1), background-color 0.2s cubic-bezier(0.4, 0, 0.2, 1), color 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  -o-transition: all 0.2s cubic-bezier(0.4, 0, 1, 1), background-color 0.2s cubic-bezier(0.4, 0, 0.2, 1), color 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  transition: all 0.2s cubic-bezier(0.4, 0, 1, 1), background-color 0.2s cubic-bezier(0.4, 0, 0.2, 1), color 0.2s cubic-bezier(0.4, 0, 0.2, 1); }
  .core-button.type-raised {
    font-size: 14px;
    font-weight: 400;
    text-transform: uppercase;
    border-radius: 2px;
    overflow: hidden;
    height: 36px;
    min-width: 88px;
    box-shadow: 0 1px 1.5px 0 rgba(0, 0, 0, 0.12), 0 1px 1px 0 rgba(0, 0, 0, 0.24); }
    .core-button.type-raised:active {
      box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12), 0 2px 4px -1px rgba(0, 0, 0, 0.2); }
    .core-button.type-raised[disabled] {
      background: rgba(0, 0, 0, 0.12) !important;
      color: rgba(0, 0, 0, 0.26) !important;
      box-shadow: none; }
    .core-button.type-raised .text {
      color: white !important; }
    .core-button.type-raised.float-top-right {
      position: absolute !important;
      top: 28px;
      right: 28px; }
    .core-button.type-raised.float-top-left {
      position: absolute !important;
      top: 28px;
      left: 28px; }
    .core-button.type-raised.float-bottom-right {
      position: absolute !important;
      bottom: 28px;
      right: 28px; }
    .core-button.type-raised.float-bottom-left {
      position: absolute !important;
      bottom: 28px;
      left: 28px; }
  .core-button.type-floating {
    border-radius: 50%;
    overflow: hidden;
    height: 68px;
    width: 68px;
    padding: 0;
    z-index: 10;
    box-shadow: 0 1px 1.5px 0 rgba(0, 0, 0, 0.12), 0 1px 1px 0 rgba(0, 0, 0, 0.24); }
    .core-button.type-floating:active {
      box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12), 0 2px 4px -1px rgba(0, 0, 0, 0.2); }
    .core-button.type-floating[disabled] {
      background: rgba(0, 0, 0, 0.12) !important;
      color: rgba(0, 0, 0, 0.26) !important;
      box-shadow: none; }
    .core-button.type-floating.color-primary {
      background: white;
      color: #fff; }
    .core-button.type-floating.color-primary-dark {
      background: #558B2F;
      color: #fff; }
    .core-button.type-floating.color-accent {
      background: #00B8D4;
      color: #fff; }
    .core-button.type-floating.float-top-right {
      position: absolute;
      top: 28px;
      right: 28px; }
    .core-button.type-floating.float-top-left {
      position: absolute;
      top: 28px;
      left: 28px; }
    .core-button.type-floating.float-bottom-right {
      position: absolute;
      bottom: 28px;
      right: 28px; }
    .core-button.type-floating.float-bottom-left {
      position: absolute;
      bottom: 28px;
      left: 28px; }
  .core-button.type-flat {
    font-size: 14px;
    font-weight: 400;
    height: 36px;
    min-width: 88px;
    overflow: hidden;
    border: none;
    border-radius: 2px;
    line-height: normal;
    text-transform: uppercase;
    letter-spacing: 0;
    outline: none; }
    .core-button.type-flat[disabled] {
      background: 0 0 !important;
      color: rgba(0, 0, 0, 0.26) !important; }
    .core-button.type-flat:hover, .core-button.type-flat:focus {
      background: rgba(153, 153, 153, 0.21); }
    .core-button.type-flat:active {
      background: rgba(153, 153, 153, 0.4); }
    .core-button.type-flat.color-primary {
      color: #8BC34A; }
    .core-button.type-flat.color-primary-dark {
      color: #558B2F; }
    .core-button.type-flat.color-accent {
      color: #00B8D4; }
  .core-button.type-icon {
    padding: 0;
    overflow: hidden; }
    .core-button.type-icon[disabled] {
      cursor: none; }
      .core-button.type-icon[disabled] i:before {
        color: rgba(0, 0, 0, 0.2); }
    .core-button.type-icon:active {
      background-color: rgba(0, 0, 0, 0.3); }

/*# sourceMappingURL=core-button.style.css.map */