client/src/sass/_mixins.scss

   1 @mixin disable-default-a-behaviour {
   2   &:hover, &:focus {
   3     text-decoration: none !important;
   4     outline: none !important;
   5   }
   6 }
   7
   8 @mixin peertube-input-text($width) {
   9   display: inline-block;
  10   height: $button-height;
  11   width: $width;
  12   background: #fff;
  13   border: 1px solid #C6C6C6;
  14   border-radius: 3px;
  15   padding-left: 15px;
  16
  17   &::placeholder {
  18     color: #585858;
  19   }
  20 }
  21
  22 @mixin orange-button {
  23   color: #fff;
  24   background-color: $orange-color;
  25
  26   &:hover {
  27     background-color: $orange-hoover-color;
  28   }
  29 }
  30
  31 @mixin grey-button {
  32   background-color: $grey-color;
  33   color: #585858;
  34
  35   &:hover {
  36     background-color: $grey-hoover-color;
  37   }
  38 }
  39
  40 @mixin peertube-button {
  41   border: none;
  42   font-weight: $font-semibold;
  43   font-size: 15px;
  44   height: $button-height;
  45   line-height: $button-height;
  46   border-radius: 3px;
  47   text-align: center;
  48   padding: 0 17px 0 13px;
  49   cursor: pointer;
  50 }
  51
  52 @mixin peertube-button-link {
  53   display: inline-block;
  54
  55   @include disable-default-a-behaviour;
  56   @include peertube-button;
  57 }
  58
  59 @mixin avatar ($size) {
  60   width: $size;
  61   height: $size;
  62 }