]> git.immae.eu Git - github/Chocobozzz/PeerTube.git/blame - client/src/sass/include/_mixins.scss
Redirect to uuid video route after upload
[github/Chocobozzz/PeerTube.git] / client / src / sass / include / _mixins.scss
CommitLineData
63c4db6d
C
1@import '_variables';
2
26c6ee80 3@mixin disable-default-a-behaviour {
cadb46d8 4 &:hover, &:focus, &:active {
26c6ee80
C
5 text-decoration: none !important;
6 outline: none !important;
7 }
8}
c30745f3
C
9
10@mixin peertube-input-text($width) {
11 display: inline-block;
12 height: $button-height;
13 width: $width;
14 background: #fff;
15 border: 1px solid #C6C6C6;
16 border-radius: 3px;
17 padding-left: 15px;
15ca2e87 18 padding-right: 15px;
c30745f3
C
19
20 &::placeholder {
21 color: #585858;
22 }
23}
24
7b272fd7
C
25@mixin orange-button {
26 color: #fff;
27 background-color: $orange-color;
28
cadb46d8 29 &:hover, &:active, &:focus {
0727cab0 30 color: #fff;
7b272fd7
C
31 background-color: $orange-hoover-color;
32 }
4cc66133
C
33
34 &[disabled], &.disabled {
35 cursor: default;
cadb46d8
C
36 color: #fff;
37 background-color: #C6C6C6;
4cc66133 38 }
7b272fd7
C
39}
40
41@mixin grey-button {
42 background-color: $grey-color;
43 color: #585858;
44
4cc66133 45 &:hover, &:active, &:focus, &[disabled], &.disabled {
0727cab0 46 color: #585858;
7b272fd7
C
47 background-color: $grey-hoover-color;
48 }
4cc66133
C
49
50 &[disabled], &.disabled {
51 cursor: default;
52 }
7b272fd7
C
53}
54
c30745f3
C
55@mixin peertube-button {
56 border: none;
c30745f3
C
57 font-weight: $font-semibold;
58 font-size: 15px;
59 height: $button-height;
60 line-height: $button-height;
61 border-radius: 3px;
62 text-align: center;
c30745f3
C
63 padding: 0 17px 0 13px;
64 cursor: pointer;
e600e1fe 65 outline: 0;
c30745f3
C
66}
67
68@mixin peertube-button-link {
69 display: inline-block;
70
c30745f3 71 @include disable-default-a-behaviour;
ce0e281d 72 @include peertube-button;
c30745f3 73}
2295ce6c
C
74
75@mixin avatar ($size) {
76 width: $size;
77 height: $size;
78}
0727cab0
C
79
80@mixin icon ($size) {
81 display: inline-block;
82 background-repeat: no-repeat;
83 background-size: contain;
84 width: $size;
85 height: $size;
86 vertical-align: middle;
87 cursor: pointer;
88}
4cc66133
C
89
90
91@mixin peertube-select ($width) {
92 background-color: #fff;
93 border: 1px solid #C6C6C6;
94 height: $button-height;
95 width: $width;
96 border-radius: 3px;
97 padding-left: 15px;
15ca2e87 98 padding-right: 15px;
4cc66133 99}