]> git.immae.eu Git - github/Chocobozzz/PeerTube.git/blame - client/src/sass/bootstrap.scss
Translated using Weblate (Spanish)
[github/Chocobozzz/PeerTube.git] / client / src / sass / bootstrap.scss
CommitLineData
2f4c784a
C
1$icon-font-path: '~@neos21/bootstrap3-glyphicons/assets/fonts/';
2@import '_bootstrap';
3
4@import '_variables';
5@import '_mixins';
6
7// Thanks https://gist.github.com/alexandrevicenzi/680147013e902a4eaa5d
8.glyphicon-refresh-animate {
9 animation: spin .7s infinite linear;
10}
11
12@keyframes spin {
a3705089
C
13 from {
14 transform: scale(1) rotate(0deg);
15 }
16 to {
17 transform: scale(1) rotate(360deg);
18 }
2f4c784a
C
19}
20
21.dropdown-menu {
22 border-radius: 3px;
6f6e89db 23 box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -2px rgba(0, 0, 0, 0.2);
2f4c784a
C
24 font-size: 15px;
25
26 .dropdown-item {
27 padding: 3px 15px;
28
29 &:active {
30 color: #000 !important;
31 }
32 }
33
34 button {
35 @include disable-default-a-behaviour;
36 }
37
38 a {
39 @include disable-default-a-behaviour;
40 color: #000 !important;
41 }
42}
43
3921166d 44
a3705089 45@media screen and (min-width: 768px) {
3921166d
RK
46 .modal:before {
47 display: inline-block;
48 vertical-align: middle;
49 content: " ";
50 height: 100%;
51 }
52
53 .modal-dialog {
54 display: inline-block;
55 text-align: left;
56 vertical-align: middle;
57 min-width: 500px;
58 width: 40vw;
59 max-width: 900px;
60 }
61}
62
2f4c784a 63.modal {
3921166d
RK
64 text-align: center;
65
2f4c784a
C
66 .modal-content {
67 background-color: var(--mainBackgroundColor);
68 }
69
70 .modal-header {
71 border-bottom: none;
72 margin-bottom: 5px;
73
74 .modal-title {
75 font-size: 20px;
76 font-weight: $font-semibold;
77 }
78
79 my-global-icon {
80 @include icon(24px);
81
82 position: relative;
83 top: 3px;
84 float: right;
85
86 margin: 0;
87 padding: 0;
88 opacity: 1;
89 }
90 }
91
92 .inputs {
93 margin-bottom: 0;
94 text-align: right;
95
96 .action-button-cancel {
97 @include peertube-button;
98 @include grey-button;
99
100 display: inline-block;
101 margin-right: 10px;
102 }
103
104 .action-button-submit {
105 @include peertube-button;
106 @include orange-button;
107 }
108 }
109}
110
111// Nav customizations
112.nav .nav-link {
113 display: flex !important;
114 align-items: center;
115 height: 30px !important;
116 padding: 10px 15px !important;
117}
118
119.nav.nav-pills {
120 font-size: 16px !important;
121
122 .nav-link.active {
123 font-weight: $font-semibold !important;
124 }
125
126 a {
127 @include disable-default-a-behaviour;
128
129 color: var(--mainForegroundColor);
130 }
131}
132
133ngb-tabset.bootstrap {
134
135 .nav-link {
136 &, & a {
137 @include disable-default-a-behaviour;
138
139 color: var(--mainForegroundColor) !important;
140 }
141 }
142
143 .nav-pills .nav-link.active {
144 color: #000 !important;
145 }
146}
147
148.nav-tabs .nav-link.active {
149 background-color: var(--mainBackgroundColor) !important;
150 border-bottom: none;
151}
152
a4610bc6
JM
153.card {
154 background-color: var(--mainBackgroundColor);
155 border-color: #dee2e6;
156}
157
2f4c784a
C
158.collapse-transition {
159 // Animation when we show/hide the filters
160 transition: max-height 0.3s;
161 display: block !important;
162 overflow: hidden !important;
163 max-height: 0;
164
165 &.show {
166 max-height: 1500px;
167 }
168}
bc584963
RK
169
170.dropdown-divider {
171 margin: 0.3rem 0;
000eb0e4
RK
172}
173
174ngb-modal-backdrop {
175 z-index: 10000 !important;
176}
aa0f1963
RK
177
178.btn-outline-tertiary {
a3705089 179 color: var(--secondaryColor);
aa0f1963 180 border-color: var(--secondaryColor);
a3705089 181
aa0f1963
RK
182 &:hover {
183 color: var(--mainBackgroundColor);
184 background-color: var(--secondaryColor);
185 }
186}