diff options
author | Chocobozzz <me@florianbigard.com> | 2021-04-28 16:41:07 +0200 |
---|---|---|
committer | Chocobozzz <me@florianbigard.com> | 2021-04-28 17:53:57 +0200 |
commit | 931d3430184143ebd88e5243def6eb1d7acfdbf4 (patch) | |
tree | 909919bafd6fa8563d26d616c6257ebd0211c83c /client/src/sass/application.scss | |
parent | 7d026caf683e42fd57a243a3b52a5e4f476fbb4e (diff) | |
download | PeerTube-931d3430184143ebd88e5243def6eb1d7acfdbf4.tar.gz PeerTube-931d3430184143ebd88e5243def6eb1d7acfdbf4.tar.zst PeerTube-931d3430184143ebd88e5243def6eb1d7acfdbf4.zip |
Move to stylelint
Diffstat (limited to 'client/src/sass/application.scss')
-rw-r--r-- | client/src/sass/application.scss | 57 |
1 files changed, 35 insertions, 22 deletions
diff --git a/client/src/sass/application.scss b/client/src/sass/application.scss index fa9c0d992..89b6f0c4c 100644 --- a/client/src/sass/application.scss +++ b/client/src/sass/application.scss | |||
@@ -8,9 +8,9 @@ $icon-font-path: '~@neos21/bootstrap3-glyphicons/assets/fonts/'; | |||
8 | 8 | ||
9 | @import './bootstrap'; | 9 | @import './bootstrap'; |
10 | @import './primeng-custom'; | 10 | @import './primeng-custom'; |
11 | @import './ng-select.scss'; | 11 | @import './ng-select'; |
12 | 12 | ||
13 | @import './classes.scss'; | 13 | @import './classes'; |
14 | 14 | ||
15 | [hidden] { | 15 | [hidden] { |
16 | display: none !important; | 16 | display: none !important; |
@@ -89,14 +89,16 @@ input.readonly { | |||
89 | background-color: pvar(--inputBackgroundColor) !important; | 89 | background-color: pvar(--inputBackgroundColor) !important; |
90 | } | 90 | } |
91 | 91 | ||
92 | input, textarea { | 92 | input, |
93 | textarea { | ||
93 | outline: none; | 94 | outline: none; |
94 | color: pvar(--inputForegroundColor); | 95 | color: pvar(--inputForegroundColor); |
95 | } | 96 | } |
96 | 97 | ||
97 | button { | 98 | button { |
98 | background: unset; | ||
99 | @include disable-outline; | 99 | @include disable-outline; |
100 | |||
101 | background: unset; | ||
100 | } | 102 | } |
101 | 103 | ||
102 | label { | 104 | label { |
@@ -121,12 +123,12 @@ code { | |||
121 | margin-top: 5px; | 123 | margin-top: 5px; |
122 | } | 124 | } |
123 | 125 | ||
124 | .input-error | 126 | .input-error, |
125 | my-input-toggle-hidden ::ng-deep input { | 127 | my-input-toggle-hidden ::ng-deep input { |
126 | border-color: $red !important; | 128 | border-color: $red !important; |
127 | } | 129 | } |
128 | 130 | ||
129 | .fullWidth { | 131 | .full-width { |
130 | width: 100%; | 132 | width: 100%; |
131 | margin-left: auto; | 133 | margin-left: auto; |
132 | margin-right: auto; | 134 | margin-right: auto; |
@@ -134,7 +136,7 @@ my-input-toggle-hidden ::ng-deep input { | |||
134 | } | 136 | } |
135 | 137 | ||
136 | .glyphicon-black { | 138 | .glyphicon-black { |
137 | color: black; | 139 | color: #000; |
138 | } | 140 | } |
139 | 141 | ||
140 | .row { | 142 | .row { |
@@ -184,26 +186,26 @@ my-input-toggle-hidden ::ng-deep input { | |||
184 | width: 100%; | 186 | width: 100%; |
185 | } | 187 | } |
186 | 188 | ||
187 | &.lock-scroll .main-row > router-outlet + * { | 189 | &.lock-scroll .main-row > router-outlet + * { /* stylelint-disable-line selector-max-compound-selectors */ |
188 | // Lock and hide body scrollbars | 190 | // Lock and hide body scrollbars |
189 | position: fixed; | 191 | position: fixed; |
190 | 192 | ||
191 | // Lock and hide sub-menu scrollbars | 193 | // Lock and hide sub-menu scrollbars |
192 | .sub-menu { | 194 | .sub-menu { /* stylelint-disable-line */ |
193 | overflow-x: hidden; | 195 | overflow-x: hidden; |
194 | } | 196 | } |
195 | } | 197 | } |
196 | } | 198 | } |
197 | 199 | ||
198 | .title-page { | 200 | .title-page { |
201 | @include disable-default-a-behaviour; | ||
202 | |||
199 | opacity: 0.6; | 203 | opacity: 0.6; |
200 | color: pvar(--mainForegroundColor); | 204 | color: pvar(--mainForegroundColor); |
201 | font-size: 16px; | 205 | font-size: 16px; |
202 | display: inline-block; | 206 | display: inline-block; |
203 | margin-right: 55px; | 207 | margin-right: 55px; |
204 | font-weight: $font-semibold; | 208 | font-weight: $font-semibold; |
205 | @include disable-default-a-behaviour; | ||
206 | |||
207 | border-bottom: 2px solid transparent; | 209 | border-bottom: 2px solid transparent; |
208 | 210 | ||
209 | &.title-page-single { | 211 | &.title-page-single { |
@@ -219,13 +221,19 @@ my-input-toggle-hidden ::ng-deep input { | |||
219 | font-size: 125%; | 221 | font-size: 125%; |
220 | } | 222 | } |
221 | 223 | ||
222 | &:hover, &:active, &:focus { | 224 | &:hover, |
225 | &:active, | ||
226 | &:focus { | ||
223 | color: pvar(--mainForegroundColor); | 227 | color: pvar(--mainForegroundColor); |
224 | } | 228 | } |
225 | 229 | ||
226 | &.active, &:hover, &:active, &:focus, &.title-page-single { | 230 | &.active, |
231 | &:hover, | ||
232 | &:active, | ||
233 | &:focus, | ||
234 | &.title-page-single { | ||
227 | opacity: 1; | 235 | opacity: 1; |
228 | outline: 0px hidden !important; | 236 | outline: 0 hidden !important; |
229 | } | 237 | } |
230 | 238 | ||
231 | @media screen and (max-width: $mobile-view) { | 239 | @media screen and (max-width: $mobile-view) { |
@@ -262,7 +270,10 @@ my-input-toggle-hidden ::ng-deep input { | |||
262 | background-color: pvar(--submenuBackgroundColor); | 270 | background-color: pvar(--submenuBackgroundColor); |
263 | } | 271 | } |
264 | 272 | ||
265 | &.active, &:hover, &:active, &:focus { | 273 | &.active, |
274 | &:hover, | ||
275 | &:active, | ||
276 | &:focus { | ||
266 | opacity: 1; | 277 | opacity: 1; |
267 | } | 278 | } |
268 | } | 279 | } |
@@ -275,8 +286,13 @@ my-input-toggle-hidden ::ng-deep input { | |||
275 | 286 | ||
276 | // In tables, don't have a hover different background | 287 | // In tables, don't have a hover different background |
277 | table { | 288 | table { |
278 | .action-button-edit, .action-button-delete { | 289 | .action-button-edit, |
279 | &:hover, &:active, &:focus, &[disabled], &.disabled { | 290 | .action-button-delete { |
291 | &:hover, | ||
292 | &:active, | ||
293 | &:focus, | ||
294 | &[disabled], | ||
295 | &.disabled { | ||
280 | background-color: $grey-background-color !important; | 296 | background-color: $grey-background-color !important; |
281 | } | 297 | } |
282 | } | 298 | } |
@@ -329,15 +345,12 @@ ngx-loading-bar { | |||
329 | 345 | ||
330 | @media screen and (max-width: #{breakpoint(xxl)}) { | 346 | @media screen and (max-width: #{breakpoint(xxl)}) { |
331 | .main-col { | 347 | .main-col { |
332 | & { | 348 | --horizontalMarginContent: #{$not-expanded-horizontal-margins / 2}; |
333 | --horizontalMarginContent: #{$not-expanded-horizontal-margins / 2}; | 349 | --videosHorizontalMarginContent: 30px; |
334 | } | ||
335 | 350 | ||
336 | &.expanded { | 351 | &.expanded { |
337 | --horizontalMarginContent: #{$expanded-horizontal-margins / 2}; | 352 | --horizontalMarginContent: #{$expanded-horizontal-margins / 2}; |
338 | } | 353 | } |
339 | |||
340 | --videosHorizontalMarginContent: 30px; | ||
341 | } | 354 | } |
342 | } | 355 | } |
343 | 356 | ||