Skip to content

Commit c482b21

Browse files
MarcelRobitailleMarcelRobitaille
committed
Run stylelint-fix
Signed-off-by: Marcel Robitaille <[email protected]>
1 parent 0406886 commit c482b21

File tree

1 file changed

+56
-56
lines changed

1 file changed

+56
-56
lines changed

‎src/components/SimpleActionInput.vue

Lines changed: 56 additions & 56 deletions
Original file line numberDiff line numberDiff line change
@@ -268,21 +268,22 @@ $breakpoint-mobile: 1024px;
268268

269269
// top-bar spacing
270270
$topbar-margin: 4px;
271+
271272
button:not(.button-vue),
272273
input:not([type="range"]),
273274
textarea {
274-
margin: 0;
275275
padding: 7px 6px;
276-
277-
cursor: text;
278-
279-
color: var(--color-text-lighter);
280276
border: 1px solid var(--color-border-dark);
281277
border-radius: var(--border-radius);
282-
outline: none;
278+
margin: 0;
283279
background-color: var(--color-main-background);
284280

281+
color: var(--color-text-lighter);
282+
283+
cursor: text;
284+
285285
font-size: 13px;
286+
outline: none;
286287

287288
&:not(:disabled):not(.primary) {
288289
&:hover,
@@ -294,17 +295,17 @@ textarea {
294295
}
295296

296297
&:active {
298+
background-color: var(--color-main-background);
297299
color: var(--color-text-light);
298300
outline: none;
299-
background-color: var(--color-main-background);
300301
}
301302
}
302303

303304
&:disabled {
305+
background-color: var(--color-background-dark);
306+
color: var(--color-text-maxcontrast);
304307
cursor: default;
305308
opacity: $opacity_disabled;
306-
color: var(--color-text-maxcontrast);
307-
background-color: var(--color-background-dark);
308309
}
309310

310311
&:required {
@@ -318,10 +319,10 @@ textarea {
318319

319320
/* Primary action button, use sparingly */
320321
&.primary {
321-
cursor: pointer;
322-
color: var(--color-primary-text);
323322
border-color: var(--color-primary-element);
324323
background-color: var(--color-primary-element);
324+
color: var(--color-primary-text);
325+
cursor: pointer;
325326

326327
&:not(:disabled) {
327328
&:hover,
@@ -336,27 +337,27 @@ textarea {
336337
}
337338

338339
&:disabled {
339-
cursor: default;
340-
color: var(--color-primary-text-dark);
341340
// opacity is already defined to .5 if disabled
342341
background-color: var(--color-primary-element);
342+
color: var(--color-primary-text-dark);
343+
cursor: default;
343344
}
344345
}
345346
}
346347
@mixin action-active {
347348
li {
348349
&.active {
349-
background-color: var(--color-background-hover);
350-
border-radius: 6px;
351350
padding: 0;
351+
border-radius: 6px;
352+
background-color: var(--color-background-hover);
352353
}
353354
}
354355
}
355356

356357
@mixin action--disabled {
357358
.action--disabled {
358-
pointer-events: none;
359359
opacity: $opacity_disabled;
360+
pointer-events: none;
360361
&:hover,
361362
&:focus {
362363
cursor: default;
@@ -371,29 +372,29 @@ textarea {
371372
@mixin action-item($name) {
372373
.action-#{$name} {
373374
display: flex;
374-
align-items: flex-start;
375375

376376
width: 100%;
377377
height: auto;
378-
margin: 0;
378+
box-sizing: border-box; // otherwise router-link overflows in Firefox
379+
align-items: flex-start;
379380
padding: 0;
380381
padding-right: $icon-margin;
381-
box-sizing: border-box; // otherwise router-link overflows in Firefox
382-
383-
cursor: pointer;
384-
white-space: nowrap;
385-
386-
opacity: $opacity_normal;
387-
color: var(--color-main-text);
388382
border: 0;
389383
border-radius: 0; // otherwise Safari will cut the border-radius area
384+
margin: 0;
390385
background-color: transparent;
391386
box-shadow: none;
387+
color: var(--color-main-text);
392388

393-
font-weight: normal;
389+
cursor: pointer;
394390
font-size: var(--default-font-size);
391+
392+
font-weight: normal;
395393
line-height: $clickable-area;
396394

395+
opacity: $opacity_normal;
396+
white-space: nowrap;
397+
397398
&:hover,
398399
&:focus {
399400
opacity: $opacity_full;
@@ -407,10 +408,10 @@ textarea {
407408
&__icon {
408409
width: $clickable-area;
409410
height: $clickable-area;
410-
opacity: $opacity_full;
411411
background-position: $icon-margin center;
412-
background-size: $icon-size;
413412
background-repeat: no-repeat;
413+
background-size: $icon-size;
414+
opacity: $opacity_full;
414415
}
415416

416417
&::v-deep .material-design-icon {
@@ -425,17 +426,17 @@ textarea {
425426

426427
// long text area
427428
p {
429+
430+
// in case there are no spaces like long email addresses
431+
overflow: hidden;
428432
max-width: 220px;
429-
line-height: 1.6em;
430433

431434
// 14px are currently 1em line-height. Mixing units as '44px - 1.6em' does not work.
432435
padding: #{math.div($clickable-area - 1.6 * 14px, 2)} 0;
433436

434437
cursor: pointer;
438+
line-height: 1.6em;
435439
text-align: left;
436-
437-
// in case there are no spaces like long email addresses
438-
overflow: hidden;
439440
text-overflow: ellipsis;
440441
}
441442

@@ -446,12 +447,12 @@ textarea {
446447
}
447448

448449
&__title {
450+
display: inline-block;
451+
overflow: hidden;
452+
max-width: 100%;
449453
font-weight: bold;
450454
text-overflow: ellipsis;
451-
overflow: hidden;
452455
white-space: nowrap;
453-
max-width: 100%;
454-
display: inline-block;
455456
}
456457
}
457458
}
@@ -462,23 +463,23 @@ $input-margin: 4px;
462463

463464
.action-input {
464465
display: flex;
465-
align-items: flex-start;
466466

467467
width: 100%;
468468
height: auto;
469-
margin: 0;
469+
align-items: flex-start;
470470
padding: 0;
471-
472-
cursor: pointer;
473-
white-space: nowrap;
474-
475-
color: var(--color-main-text);
476471
border: 0;
477472
border-radius: 0; // otherwise Safari will cut the border-radius area
473+
margin: 0;
478474
background-color: transparent;
479475
box-shadow: none;
480476

477+
color: var(--color-main-text);
478+
479+
cursor: pointer;
480+
481481
font-weight: normal;
482+
white-space: nowrap;
482483

483484
&::v-deep .material-design-icon {
484485
width: $clickable-area;
@@ -532,41 +533,41 @@ $input-margin: 4px;
532533
// Forms & text inputs
533534
&__form {
534535
display: flex;
535-
align-items: center;
536536
flex: 1 1 auto;
537+
align-items: center;
538+
padding-right: $icon-margin;
537539

538540
margin: $input-margin 0;
539-
padding-right: $icon-margin;
540541
}
541542

542543
&__submit {
543544
position: absolute;
544-
left: -10000px;
545545
top: auto;
546+
left: -10000px;
547+
overflow: hidden;
546548
width: 1px;
547549
height: 1px;
548-
overflow: hidden;
549550
}
550551

551552
&__label {
552553
display: flex;
553-
align-items: center;
554-
justify-content: center;
555554

556555
width: #{$clickable-area - $input-margin * 2};
557556
height: #{$clickable-area - $input-margin * 2};
558557
box-sizing: border-box;
559-
margin: 0 0 0 -8px;
558+
align-items: center;
559+
justify-content: center;
560560
padding: 7px 6px;
561-
562-
opacity: $opacity_full;
563-
color: var(--color-text-lighter);
564561
border: 1px solid var(--color-border-dark);
565-
border-left-color: transparent;
566562
border-radius: 0 var(--border-radius) var(--border-radius) 0;
563+
border-left-color: transparent;
564+
margin: 0 0 0 -8px;
565+
background-clip: padding-box;
567566
/* Avoid background under border */
568567
background-color: var(--color-main-background);
569-
background-clip: padding-box;
568+
color: var(--color-text-lighter);
569+
570+
opacity: $opacity_full;
570571

571572
&,
572573
* {
@@ -576,11 +577,10 @@ $input-margin: 4px;
576577

577578
/* Inputs inside popover supports text, submit & reset */
578579
&__input {
579-
flex: 1 1 auto;
580-
581580
min-width: $clickable-area * 3;
582581
min-height: #{$clickable-area - $input-margin * 2}; /* twice the element margin-y */
583582
max-height: #{$clickable-area - $input-margin * 2}; /* twice the element margin-y */
583+
flex: 1 1 auto;
584584
margin: 0;
585585

586586
// if disabled, change cursor

0 commit comments

Comments
 (0)