merge_requests.scss 16 KB
Newer Older
1
2
/**
 * MR -> show: Automerge widget
randx's avatar
randx committed
3
4
 *
 */
Simon Knox's avatar
Simon Knox committed
5
6
7
8
9
10
11
12
13
14
15
16
17

.space-children {
  @include clearfix;

  > * {
    float: left;
  }

  > *:not(:last-child) {
    margin-right: 10px;
  }
}

18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
.mr-widget-border-top {
  border-top: 1px solid $border-color;
}

.media-section {
  @include media-breakpoint-down(md) {
    align-items: flex-start;

    .media-body {
      flex-direction: column;
      align-items: flex-start;
    }
  }

  .code-text {
    @include media-breakpoint-up(lg) {
      align-self: center;
      flex: 1;
    }
  }
}

.mr-widget-section {
41
  border-radius: $border-radius-default $border-radius-default 0 0;
42
43
44
45
46
47

  .code-text {
    flex: 1;
  }
}

48
49
50
.mr-widget-heading {
  position: relative;
  border: 1px solid $border-color;
51
52
  border-radius: $border-radius-default;
}
53

54
55
56
.mr-widget-extension {
  border-top: 1px solid $border-color;
  background-color: $gray-light;
57
58
59
60
61

  &.clickable:hover {
    background-color: $gl-gray-200;
    cursor: pointer;
  }
62
63
64
65
66
67
68
}

.mr-widget-workflow {
  margin-top: $gl-padding;
  position: relative;

  &::before {
69
    content: '';
70
    border-left: 1px solid $gray-200;
71
72
73
74
75
76
77
78
79
80
81
82
83
    position: absolute;
    left: 32px;
    top: -17px;
    height: 16px;
  }
}

.mr-section-container {
  border: 1px solid $border-color;
  border-radius: $border-radius-default;
  border-top: 0;
}

84
.mr-widget-body,
85
.mr-widget-section,
86
.mr-widget-content,
87
88
89
90
.mr-widget-footer {
  padding: $gl-padding;
}

91
.mr-state-widget {
tauriedavis's avatar
tauriedavis committed
92
  color: $gl-text-color;
Simon Knox's avatar
Simon Knox committed
93

94
95
96
97
  .commit-message-edit {
    border-radius: $border-radius-default;
  }

Simon Knox's avatar
Simon Knox committed
98
99
100
101
102
  .mr-widget-section,
  .mr-widget-footer {
    border-top: solid 1px $border-color;
  }

103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
  .mr-fast-forward-message {
    padding-left: $gl-padding-50;
    padding-bottom: $gl-padding;
  }

  .commits-list {
    > li {
      padding: $gl-padding;

      @include media-breakpoint-up(md) {
        padding-left: $gl-padding-50;
      }
    }
  }

  .mr-commit-dropdown {
    .dropdown-menu {
      @include media-breakpoint-up(md) {
        width: 150%;
      }
    }
  }

Simon Knox's avatar
Simon Knox committed
126
127
128
  .mr-widget-footer {
    padding: 0;
  }
129

130
  .mr-report {
131
132
133
134
135
136
137
    padding: 0;

    > .media {
      padding: $gl-padding;
    }
  }

138
  form {
139
    margin-bottom: 0;
140

141
    .clearfix {
142
      margin-bottom: 0;
randx's avatar
randx committed
143
144
145
    }
  }

Simon Knox's avatar
Simon Knox committed
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
  label {
    margin-bottom: 0;
  }

  .btn {
    font-size: $gl-font-size;

    &[disabled] {
      opacity: 0.3;
    }

    &.dropdown-toggle {
      .fa {
        color: inherit;
      }
    }
  }

164
165
166
  .accept-merge-holder {
    .accept-action {
      display: inline-block;
167
      float: left;
168

169
      .accept-merge-request {
170
171
        &.ci-pending,
        &.ci-running {
172
          @include btn-blue;
173
174
175
176
177
178
179
180
181
        }

        &.ci-skipped,
        &.ci-failed,
        &.ci-canceled,
        &.ci-error {
          @include btn-red;
        }
      }
182
183
184
185
    }

    .accept-control {
      display: inline-block;
186
      float: left;
187
      margin: 0;
188
      margin-left: 20px;
189
      padding: 5px;
190
      padding-top: 8px;
191
192
      line-height: 20px;

Dmitriy Zaporozhets's avatar
Dmitriy Zaporozhets committed
193
194
      &.right {
        float: right;
195
        padding-right: 0;
196
      }
197

198
      .modify-merge-commit-link {
199
200
201
        padding: 0;
        background-color: transparent;
        border: 0;
202
        color: $gl-text-color;
203
204
205
206
207

        &:hover,
        &:focus {
          text-decoration: underline;
        }
Dmitriy Zaporozhets's avatar
Dmitriy Zaporozhets committed
208
209
      }

210
      .merge-param-checkbox {
211
212
        margin: 0;
      }
213
214
215
216
217
218
219
220
221

      a .fa-question-circle {
        color: $gl-text-color-secondary;

        &:hover,
        &:focus {
          color: $link-hover-color;
        }
      }
222
    }
randx's avatar
randx committed
223
  }
224

Fatih Acet's avatar
Fatih Acet committed
225
  .ci-widget {
tauriedavis's avatar
tauriedavis committed
226
    color: $gl-text-color;
227
    display: flex;
228
229
    align-items: center;
    justify-content: space-between;
230

Clement Ho's avatar
Clement Ho committed
231
    @include media-breakpoint-down(xs) {
232
233
      flex-wrap: wrap;
    }
234
235
236
237

    .ci-widget-content {
      display: flex;
      align-items: center;
238
      flex: 1;
239
    }
Simon Knox's avatar
Simon Knox committed
240
  }
241

Simon Knox's avatar
Simon Knox committed
242
243
244
  .mr-widget-icon {
    font-size: 22px;
  }
245

Simon Knox's avatar
Simon Knox committed
246
247
248
249
250
  .ci-status-icon svg {
    margin: 3px 0;
    position: relative;
    overflow: visible;
    display: block;
251
252
  }

253
254
  .mr-widget-pipeline-graph {
    .dropdown-menu {
255
      z-index: 300;
256
    }
Simon Knox's avatar
Simon Knox committed
257
  }
258

Simon Knox's avatar
Simon Knox committed
259
260
261
  .mini-pipeline-graph-dropdown-toggle {
    vertical-align: top;
  }
262

263
  .normal {
264
    flex: 1;
265
    flex-basis: auto;
Fatih Acet's avatar
Fatih Acet committed
266
267
268
269
  }

  .capitalize {
    text-transform: capitalize;
270
  }
271

272
  .label-branch {
273
274
275
    @extend .ref-name;

    color: $gl-text-color;
276
    font-weight: normal;
277
278
    overflow: hidden;
    word-break: break-all;
279
  }
280

281
282
  .deploy-link,
  .label-branch {
283
284
285
286
287
288
289
290
291
292
293
294
295
    &.label-truncate {
      // NOTE: This selector targets its children because some of the HTML comes from
      // 'source_branch_link'. Once this external HTML is no longer used, we could
      // simplify this.
      > a,
      > span {
        display: inline-block;
        max-width: 12.5em;
        margin-bottom: -3px;
        white-space: nowrap;
        text-overflow: ellipsis;
        line-height: 14px;
        overflow: hidden;
296
297
      }
    }
298
299
  }

300
301
302
303
  .widget-status-icon {
    align-self: flex-start;
  }

304
  .mr-widget-body {
305
306
    line-height: 28px;

307
308
309
310
311
312
313
314
315
    @include clearfix;

    &.media > *:first-child {
      margin-right: 10px;
    }

    .approve-btn {
      margin-right: 5px;
    }
316

317
    h4 {
Simon Knox's avatar
Simon Knox committed
318
      float: left;
319
      font-weight: $gl-font-weight-bold;
Simon Knox's avatar
Simon Knox committed
320
321
322
323
      font-size: 14px;
      line-height: inherit;
      margin-top: 0;
      margin-bottom: 0;
324
325

      &.has-conflicts .fa-exclamation-triangle {
326
        color: $orange-500;
327
      }
Fatih Acet's avatar
Fatih Acet committed
328
329

      time {
330
        font-weight: $gl-font-weight-normal;
Fatih Acet's avatar
Fatih Acet committed
331
      }
332
333
    }

334
335
336
337
338
    .btn-grouped {
      margin-left: 0;
      margin-right: 7px;
    }

Fatih Acet's avatar
Fatih Acet committed
339
    label {
340
      font-weight: $gl-font-weight-normal;
Fatih Acet's avatar
Fatih Acet committed
341
342
343
    }

    .spacing {
Simon Knox's avatar
Simon Knox committed
344
      margin: 0 0 0 10px;
Fatih Acet's avatar
Fatih Acet committed
345
346
347
    }

    .bold {
348
      font-weight: $gl-font-weight-bold;
Fatih Acet's avatar
Fatih Acet committed
349
350
351
352
      color: $gl-gray-light;
    }

    .state-label {
353
      font-weight: $gl-font-weight-bold;
Fatih Acet's avatar
Fatih Acet committed
354
355
356
357
      padding-right: 10px;
    }

    .danger {
358
      color: $red-500;
Fatih Acet's avatar
Fatih Acet committed
359
360
    }

361
362
363
364
365
    .spacing,
    .bold {
      vertical-align: middle;
    }

Fatih Acet's avatar
Fatih Acet committed
366
367
368
369
370
    .dropdown-menu {
      li a {
        padding: 5px;
      }

Simon Knox's avatar
Simon Knox committed
371
372
      .merge-opt-icon {
        line-height: 1.5;
Fatih Acet's avatar
Fatih Acet committed
373
374
375
376
377
378
379
380
381
      }

      .merge-opt-title {
        margin-left: 8px;
      }
    }

    .dropdown-toggle {
      .fa {
382
        margin-left: 0;
Fatih Acet's avatar
Fatih Acet committed
383
384
385
386
387
388
389
390
        color: inherit;
      }
    }

    .has-custom-error {
      display: inline-block;
    }

Clement Ho's avatar
Clement Ho committed
391
    @include media-breakpoint-down(xs) {
392
393
394
395
      p {
        font-size: 13px;
      }

396
397
398
399
400
      .btn-grouped {
        float: none;
        margin-right: 0;
      }

401
402
403
404
405
      .accept-action {
        width: 100%;
        text-align: center;
      }

406
407
408
409
410
411
      .accept-control {
        width: 100%;
        text-align: center;
        margin: 0;
      }
    }
Fatih Acet's avatar
Fatih Acet committed
412
413
414
415
416
417
418

    .commit-message-editor {
      label {
        padding: 0;
      }
    }

Simon Knox's avatar
Simon Knox committed
419
420
    &.mr-widget-empty-state {
      line-height: 20px;
421
422
423
424

      .artwork {
        margin-bottom: $gl-padding;
      }
425

426
427
      .text {
        span {
428
          font-weight: $gl-font-weight-bold;
429
        }
430

431
432
433
434
435
        p {
          margin-top: $gl-padding;
        }
      }
    }
436
437
  }

438
  .mr-widget-help {
439
    padding: 10px 16px 10px $gl-padding-50;
440
441
442
    font-style: italic;
  }

443
444
445
  .ci-coverage {
    float: right;
  }
446

447
  .stop-env-container {
448
449
    color: $gl-text-color;
    float: right;
450

451
452
453
454
    a {
      color: $gl-text-color;
    }
  }
randx's avatar
randx committed
455
}
456

457
458
.mr_source_commit,
.mr_target_commit {
Phil Hughes's avatar
Phil Hughes committed
459
460
  margin-bottom: 0;

461
  .commit {
462
    margin: 0;
463
    padding: 10px;
464
    list-style: none;
465

466
    &:hover {
467
      background: none;
468
469
470
471
    }
  }
}

Artem Sidorenko's avatar
Artem Sidorenko committed
472
473
474
475
476
477
478
.commits-empty {
  text-align: center;

  h4 {
    padding-top: 20px;
    padding-bottom: 10px;
  }
479

Artem Sidorenko's avatar
Artem Sidorenko committed
480
481
482
483
484
  svg {
    width: 230px;
  }
}

485
486
487
488
489
490
.nothing-here-block {
  img {
    width: 230px;
  }
}

491
492
.mr-list {
  .merge-request {
Filipa Lacerda's avatar
Filipa Lacerda committed
493
    padding: 10px 0 10px 15px;
494
    position: relative;
Nur Rony's avatar
Nur Rony committed
495
496
    display: -webkit-flex;
    display: flex;
497

498
    .issuable-info-container {
Nur Rony's avatar
Nur Rony committed
499
500
      -webkit-flex: 1;
      flex: 1;
Nur Rony's avatar
Nur Rony committed
501
    }
502
503

    .merge-request-title {
504
      margin-bottom: 2px;
505
506
507
508
509
510
511
512

      .ci-status-link {
        svg {
          height: 16px;
          width: 16px;
          position: relative;
          top: 3px;
        }
Clement Ho's avatar
Clement Ho committed
513
514
515
516
517

        &:hover,
        &:focus {
          text-decoration: none;
        }
518
      }
519
    }
Stefan Tatschner's avatar
Stefan Tatschner committed
520
521
522
523
524
  }

  .merge-request-labels {
    display: inline-block;
  }
525
}
Dmitriy Zaporozhets's avatar
Dmitriy Zaporozhets committed
526
527
528

.merge-request-angle {
  text-align: center;
Dmitriy Zaporozhets's avatar
Dmitriy Zaporozhets committed
529
  margin: 0 auto;
530
531
  font-size: 2em;
  line-height: 1.1;
Dmitriy Zaporozhets's avatar
Dmitriy Zaporozhets committed
532
533
}

534
// hide mr close link for inline diff comment form
535
536
537
.diff-file .close-mr-link,
.diff-file .reopen-mr-link {
  display: none;
538
}
539

Douwe Maan's avatar
Douwe Maan committed
540
#modal_merge_info .modal-dialog {
541
542
543
544
  .dark {
    margin-right: 40px;
  }

545
  .btn-clipboard {
546
    margin-right: 20px;
547
548
549
550
    margin-top: 5px;
    position: absolute;
    right: 0;
  }
Douwe Maan's avatar
Douwe Maan committed
551
}
552

Bob Van Landuyt's avatar
Bob Van Landuyt committed
553
.mr-links {
554
  padding-left: $status-icon-size + $gl-btn-padding;
Simon Knox's avatar
Simon Knox committed
555
556
}

Fatih Acet's avatar
Fatih Acet committed
557
.mr-info-list {
Simon Knox's avatar
Simon Knox committed
558
  clear: left;
Fatih Acet's avatar
Fatih Acet committed
559
  position: relative;
Simon Knox's avatar
Simon Knox committed
560
  padding-top: 4px;
561

Fatih Acet's avatar
Fatih Acet committed
562
  p {
Simon Knox's avatar
Simon Knox committed
563
    margin: 0;
564
    position: relative;
Simon Knox's avatar
Simon Knox committed
565
    padding: 4px 0;
Fatih Acet's avatar
Fatih Acet committed
566
567

    &:last-child {
Simon Knox's avatar
Simon Knox committed
568
      padding-bottom: 0;
569
    }
570
  }
Fatih Acet's avatar
Fatih Acet committed
571

572
573
574
575
  &.mr-memory-usage {
    p {
      float: left;
    }
576

577
578
579
580
    .memory-graph-container {
      float: left;
      margin-left: 5px;
    }
581
582
583
  }
}

584
.mr-source-target {
Simon Knox's avatar
Simon Knox committed
585
586
  display: flex;
  flex-wrap: wrap;
587
588
589
590
591
592
593
594
  border-radius: $border-radius-default;
  padding: $gl-padding;
  border: 1px solid $border-color;
  min-height: 69px;

  @include media-breakpoint-up(md) {
    align-items: center;
  }
Fatih Acet's avatar
Fatih Acet committed
595
596
597
598

  .dropdown-toggle .fa {
    color: $gl-text-color;
  }
599
600
601
602
603
604
605
606
607
608


  .git-merge-container {
    justify-content: space-between;
    flex: 1;
    flex-direction: row;
    align-items: center;

    @include media-breakpoint-down(md) {
      flex-direction: column;
609
      align-items: stretch;
610
611
612
613
614
615
616
617
618

      .branch-actions {
        margin-top: 16px;
      }
    }

    @include media-breakpoint-up(lg) {
      .branch-actions {
        align-self: center;
619
        margin-left: $gl-padding;
620
        white-space: nowrap;
621
622
623
624
625
626
627
      }
    }
  }

  .diverged-commits-count {
    color: $gl-text-color-secondary;
  }
628
}
629

Clement Ho's avatar
Clement Ho committed
630
.card-new-merge-request {
631
  .card-header {
Phil Hughes's avatar
Phil Hughes committed
632
    padding: 5px 10px;
633
    font-weight: $gl-font-weight-bold;
Phil Hughes's avatar
Phil Hughes committed
634
635
636
    line-height: 25px;
  }

Clement Ho's avatar
Clement Ho committed
637
  .card-body {
Phil Hughes's avatar
Phil Hughes committed
638
639
640
    padding: 10px 5px;
  }

Clement Ho's avatar
Clement Ho committed
641
  .card-footer {
642
    padding: 0;
643
644
645
646

    .btn {
      min-width: auto;
    }
Phil Hughes's avatar
Phil Hughes committed
647
648
649
650
651
652
653
  }

  .commit {
    .commit-row-title {
      margin-bottom: 4px;
    }

654
    .item-title {
Clement Ho's avatar
Clement Ho committed
655
      @include media-breakpoint-up(sm) {
656
        width: 45%;
657
658
659
      }
    }

Phil Hughes's avatar
Phil Hughes committed
660
    .avatar {
661
662
      left: 0;
      top: 2px;
Phil Hughes's avatar
Phil Hughes committed
663
664
665
666
667
668
669
670
    }
  }

  .btn-clipboard {
    margin-right: 5px;
    padding: 0;
    background: transparent;
  }
Phil Hughes's avatar
Phil Hughes committed
671
672
673
674

  .ci-status-link {
    margin-right: 5px;
  }
Phil Hughes's avatar
Phil Hughes committed
675
676
677
678
679
}

.merge-request-select {
  padding-left: 5px;
  padding-right: 5px;
Phil Hughes's avatar
Phil Hughes committed
680
681
682
683
684
685
  margin-bottom: 10px;

  &:last-child {
    margin-bottom: 0;
  }

Clement Ho's avatar
Clement Ho committed
686
  @include media-breakpoint-up(xs) {
Phil Hughes's avatar
Phil Hughes committed
687
688
689
690
    float: left;
    width: 50%;
    margin-bottom: 0;
  }
Phil Hughes's avatar
Phil Hughes committed
691
692
693
694
695
696
697
698
699
700

  .dropdown-menu-toggle {
    width: 100%;
  }

  .dropdown-menu {
    left: 5px;
    right: 5px;
    width: auto;
  }
Phil Hughes's avatar
Phil Hughes committed
701
}
Phil Hughes's avatar
Phil Hughes committed
702

Phil Hughes's avatar
Phil Hughes committed
703
704
705
.issuable-form-select-holder {
  display: inline-block;
  width: 250px;
706
707
708
709

  .dropdown-menu-toggle {
    width: 100%;
  }
Phil Hughes's avatar
Phil Hughes committed
710
}
Annabel Dunstone's avatar
Annabel Dunstone committed
711

712
713
714
715
.target-branch-select-dropdown-container {
  position: relative;
}

716
717
718
719
720
.assign-to-me-link {
  padding-left: 12px;
  white-space: nowrap;
}

Annabel Dunstone's avatar
Annabel Dunstone committed
721
.table-holder {
722
  .ci-table {
Annabel Dunstone's avatar
Annabel Dunstone committed
723
724
    th {
      background-color: $white-light;
tauriedavis's avatar
tauriedavis committed
725
      color: $gl-text-color-secondary;
Annabel Dunstone's avatar
Annabel Dunstone committed
726
727
728
    }
  }
}
729
730
731
732
733
734

.merged-buttons {
  .btn {
    float: left;
  }
}
735

736
.mr-version-controls {
737
  position: relative;
738
  z-index: 103;
739
  background: $gray-light;
tauriedavis's avatar
tauriedavis committed
740
741
742
743
744
  color: $gl-text-color;

  .mr-version-menus-container {
    display: flex;
    align-items: center;
745
    flex-wrap: wrap;
tauriedavis's avatar
tauriedavis committed
746
    padding: 16px;
Felipe Artur's avatar
Felipe Artur committed
747
    z-index: 199;
748
749
750
751
752
753
754
755
756
757
758
    white-space: nowrap;

    .dropdown-menu-toggle {
      width: auto;
      max-width: 170px;

      svg {
        top: 10px;
        right: 8px;
      }
    }
tauriedavis's avatar
tauriedavis committed
759
760
  }

761
762
763
764
  .content-block {
    padding: $gl-padding-top $gl-padding;
  }

tauriedavis's avatar
tauriedavis committed
765
  .comments-disabled-notif {
766
767
    line-height: 28px;

tauriedavis's avatar
tauriedavis committed
768
769
770
771
    .btn {
      margin-left: 5px;
    }
  }
772

773
774
  .mr-version-dropdown,
  .mr-version-compare-dropdown {
tauriedavis's avatar
tauriedavis committed
775
    margin: 0 7px;
776
777
778
779
780
  }

  .dropdown-title {
    color: $gl-text-color;
  }
781

782
  .fa-info-circle {
783
    color: $orange-500;
tauriedavis's avatar
tauriedavis committed
784
    padding-right: 5px;
785
  }
786
787
788
789
790
791
792
793
794
795
796
797
798
799
800
801
802
803
804
805
806

  @include media-breakpoint-up(md) {
    position: -webkit-sticky;
    position: sticky;
    top: $header-height + $mr-tabs-height;
    width: 100%;
    border-top: 1px solid $border-color;

    &.is-fileTreeOpen {
      margin-left: -16px;
      width: calc(100% + 32px);
    }

    .mr-version-menus-container {
      flex-wrap: nowrap;
    }

    .with-performance-bar & {
      top: $header-height + $performance-bar-height + $mr-tabs-height;
    }
  }
807
}
808

809
.merge-request-tabs-holder {
810
  top: $header-height;
811
  z-index: 200;
812
  background-color: $white-light;
813
814
815
816

  @include media-breakpoint-down(md) {
    border-bottom: 1px solid $border-color;
  }
817

Clement Ho's avatar
Clement Ho committed
818
  @include media-breakpoint-up(sm) {
819
820
821
822
    position: sticky;
    position: -webkit-sticky;
  }

823
  &.affix {
824
    left: 0;
Filipa Lacerda's avatar
Filipa Lacerda committed
825
    transition: right 0.15s;
826

Clement Ho's avatar
Clement Ho committed
827
    @include media-breakpoint-down(xs) {
828
829
      right: 0;
    }
830
831
832
833
834

    .merge-request-tabs-container {
      padding-left: $gl-padding;
      padding-right: $gl-padding;
    }
835
  }
836
837
838
839
840
841

  .nav-links {
    border: 0;
  }
}

842
.with-performance-bar .merge-request-tabs-holder {
843
  top: $header-height + $performance-bar-height;
844
845
}

846
847
.merge-request-tabs {
  display: flex;
848
  flex-wrap: nowrap;
849
850
  margin-bottom: 0;
  padding: 0;
851
}
852

853
854
855
856
857
.limit-container-width {
  .merge-request-tabs-container {
    max-width: $limited-layout-width;
    margin-left: auto;
    margin-right: auto;
858
859
860
861
862
863

    .inner-page-scroll-tabs {
      background-color: $white-light;
      margin-left: -$gl-padding;
      padding-left: $gl-padding;
    }
864
865
866
  }
}

867
868
869
870
.merge-request-tabs-container {
  display: flex;
  justify-content: space-between;

871
  @include media-breakpoint-down(sm) {
872
873
    flex-direction: column-reverse;
  }
874
875
876
877
878
879
880
881

  .discussion-filter-container {
    margin-top: $gl-padding-8;

    &:not(:only-child) {
      padding-right: $gl-padding-8;
    }
  }
882
883
}

884
885
886
887
888
.limit-container-width:not(.container-limited) {
  .merge-request-tabs-holder:not(.affix) {
    .merge-request-tabs-container {
      max-width: $limited-layout-width - ($gl-padding * 2);
    }
889
890
  }
}
Fatih Acet's avatar
Fatih Acet committed
891
892

.mr-memory-usage {
Phil Hughes's avatar
Phil Hughes committed
893
894
  width: 100%;

895
896
897
  p.usage-info-loading .usage-info-load-spinner {
    margin-right: 10px;
    font-size: 16px;
Fatih Acet's avatar
Fatih Acet committed
898
899
  }
}
900
901
902
903

.fork-sprite {
  margin-right: -5px;
}
904

Phil Hughes's avatar
Phil Hughes committed
905
.deploy-heading {
906
907
908
909
  @include media-breakpoint-up(md) {
    padding: $gl-padding-8 $gl-padding;
  }

Phil Hughes's avatar
Phil Hughes committed
910
911
  .media-body {
    min-width: 0;
912
913
    font-size: 12px;
    margin-left: 48px;
Phil Hughes's avatar
Phil Hughes committed
914
  }
915
916
917
918

  &:not(:last-child) {
    border-bottom: 1px solid $border-color;
  }
Phil Hughes's avatar
Phil Hughes committed
919
920
}

921
922
.deploy-body {
  display: flex;
923
  align-items: center;
924
925
  flex-wrap: wrap;

Clement Ho's avatar
Clement Ho committed
926
  @include media-breakpoint-up(xs) {
Phil Hughes's avatar
Phil Hughes committed
927
928
929
930
    flex-wrap: nowrap;
    white-space: nowrap;
  }

931
932
933
934
935
936
937
938
939
  @include media-breakpoint-down(md) {
    flex-direction: column;
    align-items: flex-start;

    .deployment-info {
      margin-bottom: $gl-padding;
    }
  }

940
  > *:not(:last-child) {
Filipa Lacerda's avatar
Filipa Lacerda committed
941
    margin-right: 0.3em;
942
  }
943
944
945
946

  svg {
    vertical-align: text-top;
  }
947

948
949
950
951
952
953
  .deployment-info {
    flex: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    min-width: 100px;
Phil Hughes's avatar
Phil Hughes committed
954

955
956
957
958
959
960
961
    @include media-breakpoint-up(xs) {
      min-width: 0;
      max-width: 100%;
    }
  }

  .btn svg {
962
    fill: $gray-700;
Phil Hughes's avatar
Phil Hughes committed
963
  }
Filipa Lacerda's avatar
Filipa Lacerda committed
964
965
966
967

  .dropdown-menu {
    width: 400px;
  }
968
}
969
970
971

// Hack alert: we've rewritten `btn` class in a way that
// we've broken it and it is not possible to use with `btn-link`
Filipa Lacerda's avatar
Filipa Lacerda committed
972
// which causes a blank button when it's disabled and hovering
973
974
975
976
977
// The css in here is the boostrap one
.btn-link-retry {
  &[disabled] {
    cursor: not-allowed;
    box-shadow: none;
Filipa Lacerda's avatar
Filipa Lacerda committed
978
    opacity: 0.65;
979
980

    &:hover {
981
      color: $gl-gray-500;
982
983
984
      text-decoration: none;
    }
  }
985
}
986
987
988
989
990
991

.ci-widget-container {
  justify-content: space-between;
  flex: 1;
  flex-direction: row;

992
  @include media-breakpoint-down(sm) {
993
994
995
996
997
998
999
1000
1001
1002
1003
1004
1005
    flex-direction: column;

    .stage-cell .stage-container {
      margin-top: 16px;
    }

    .dropdown .mini-pipeline-graph-dropdown-menu.dropdown-menu {
      transform: initial;
    }
  }

  .coverage {
    font-size: 12px;
1006
    color: $gray-700;
1007
1008
1009
1010
1011
1012
1013
1014
1015
    line-height: initial;
  }

  .mini-pipeline-graph-dropdown-toggle,
  .stage-cell .mini-pipeline-graph-dropdown-toggle svg {
    height: $ci-action-icon-size-lg;
    width: $ci-action-icon-size-lg;
  }
}
1016
1017
1018
1019
1020
1021

.merge-request-details .file-finder-overlay.diff-file-finder {
  position: fixed;
  z-index: 99999;
  background: $black-transparent;
}
1022
1023
1024
1025
1026

.source-branch-removal-status {
  padding-left: 50px;
  padding-bottom: $gl-padding;
}