ceph/src/pybind/mgr/dashboard/frontend/src/styles/bootstrap-extends.scss

   1 /*
   2  * Include here all styles from components that extend from bootstrap.
   3  * This removes the need to @import bootstrap into those component,
   4  * thus reducing the final css size.
   5 */
   6
   7 cd-info-card {
   8   .card {
   9     @extend .pb-2;
  10
  11     .card-body {
  12       .card-title {
  13         @extend .pl-2;
  14       }
  15
  16       .card-text {
  17         @extend .pt-2;
  18       }
  19     }
  20   }
  21 }
  22
  23 .btn-toolbar cd-table-actions.btn-group {
  24   @extend .mr-2;
  25 }
  26
  27 cd-table {
  28   .cd-datatable {
  29     .datatable-footer {
  30       @extend .p-2;
  31
  32       .datatable-pager {
  33         ul {
  34           @extend .pagination;
  35
  36           li {
  37             @extend .page-item;
  38
  39             a {
  40               @extend .page-link;
  41             }
  42           }
  43         }
  44       }
  45     }
  46   }
  47 }
  48
  49 cd-health {
  50   cd-info-card {
  51     @extend .d-flex;
  52     @extend .flex-column;
  53     @extend .mb-4;
  54
  55     @extend .col-12;
  56     @extend .col-sm-12;
  57     @extend .col-md-6;
  58     @extend .col-lg-4;
  59
  60     &.cd-status-card {
  61       @extend .col-xl-3;
  62     }
  63
  64     &.cd-performance-card,
  65     &.cd-capacity-card {
  66       @extend .col-xl;
  67     }
  68
  69     &.cd-capacity-card {
  70       @extend .col-lg-3;
  71     }
  72
  73     &.cd-performance-card {
  74       @extend .col-lg-6;
  75     }
  76
  77     &.cd-chart-card {
  78       @extend .col-md-12;
  79       @extend .col-lg-6;
  80       @extend .col-xl-4;
  81       @extend .col-2xl-3;
  82     }
  83   }
  84 }
  85
  86 cd-logs {
  87   label {
  88     @extend .mr-2;
  89   }
  90
  91   .form-inline > .form-group {
  92     @extend .mr-3;
  93     @extend .mb-3;
  94   }
  95 }
  96
  97 cd-about {
  98   dl {
  99     @extend .row;
 100   }
 101
 102   dt {
 103     @extend .col-4;
 104     @extend .font-weight-bold;
 105   }
 106
 107   dd {
 108     @extend .col-8;
 109   }
 110 }
 111
 112 .cd-header,
 113 legend {
 114   @extend .pb-1;
 115   @extend .mt-4;
 116   @extend .mb-4;
 117   @extend .border-bottom;
 118 }
 119
 120 // All '.fa' icons will have fixed width
 121 .fa {
 122   @extend .fa-fw;
 123 }
 124
 125 pre:not(cd-api-docs *) {
 126   @extend .card;
 127   @extend .bg-light;
 128   @extend .p-2;
 129 }