[Summary view] [Print] [Text view]

   1  // Variables
   2  @import "../../../build/media_source/templates/administrator/atum/scss/variables";
   3  $jicon-css-prefix: icon;
   4  $fa-css-prefix: fa;
   5  $fa-font-path: "../../../media/vendor/fontawesome-free/webfonts";
   6  
   7  // Font Awesome
   8  @import "../../../build/media_source/templates/administrator/atum/scss/vendor/fontawesome-free/fontawesome";
   9  
  10  // "Font Awesome 5 Free"
  11  @import "../../../media/vendor/fontawesome-free/scss/fontawesome";
  12  @import "../../../media/vendor/fontawesome-free/scss/regular";
  13  @import "../../../media/vendor/fontawesome-free/scss/solid";
  14  @import "../../../media/vendor/fontawesome-free/scss/brands"; // order of loading is important.
  15  
  16  // B/C for Icomoon
  17  @import "../../../build/media_source/system/scss/icomoon";
  18  
  19  // Bootstrap
  20  @import "../../../media/vendor/bootstrap/scss/functions";
  21  
  22  // Variables from the Atum template
  23  @import "../../../build/media_source/templates/administrator/atum/scss/variables";
  24  
  25  // Bootstrap with the root.scss overridden
  26  @import "../../../build/media_source/templates/administrator/atum/scss/vendor/bootstrap";
  27  
  28  // Backend Template stuff
  29  @import "../../../build/media_source/templates/administrator/atum/scss/blocks/global";
  30  @import "../../../build/media_source/templates/administrator/atum/scss/blocks/header";
  31  @import "../../../build/media_source/templates/administrator/atum/scss/vendor/bootstrap/custom-forms";
  32  @import "../../../build/media_source/templates/administrator/atum/scss/vendor/joomla-custom-elements/joomla-alert";
  33  
  34  // Safari fix
  35  @import "../../../build/media_source/templates/administrator/atum/scss/vendor/bootstrap/reboot";
  36  
  37  body {
  38    background: var(--template-bg-light);
  39  }
  40  
  41  .form-select {
  42    @extend .form-select;
  43  }
  44  
  45  *,
  46  *::after,
  47  *::before {
  48    box-sizing: border-box;
  49  }
  50  
  51  .j-install {
  52    display: flex;
  53    flex-direction: column;
  54    min-height: 100vh;
  55  
  56    .logo {
  57      max-width: 270px;
  58    }
  59  
  60    img.logo-small,
  61    svg.logo-small {
  62      width: 2rem;
  63      height: 2rem;
  64    }
  65  
  66    .icon-question {
  67      color: $white;
  68  
  69      &:hover {
  70        color: var(--template-link-color);
  71      }
  72    }
  73  }
  74  
  75  .j-container {
  76    width: 100%;
  77    max-width: 40rem;
  78    margin: 0 auto;
  79  
  80    h1 {
  81      color: $dark-blue;
  82      text-align: center;
  83    }
  84  }
  85  
  86  .j-install-step {
  87    display: none;
  88    margin-bottom: 20px;
  89    background-color: #fff;
  90    box-shadow: 0 0 2px rgba(52, 58, 67, .1), 0 2px 5px rgba(52, 58, 67, .08), 0 5px 15px rgba(52, 58, 67, .08);
  91  
  92    &.active {
  93      display: block;
  94    }
  95  
  96    select {
  97      width: 100%;
  98      margin-left: 0 !important;
  99    }
 100  }
 101  
 102  .j-install-step-header {
 103    position: relative;
 104    padding: 10px 25px;
 105    font-size: 1.1rem;
 106    line-height: 2.4rem;
 107    color: $dark-blue;
 108    background-color: #fff;
 109    border-bottom: 1px solid #efefef;
 110  
 111    span {
 112      position: relative;
 113      margin-right: 5px;
 114      font-size: 1.2rem;
 115    }
 116  }
 117  
 118  .j-install-step-form {
 119    padding: .65rem 1.2rem;
 120  
 121    // Remove default bootstrap margins in the installer forms.
 122    .control-group {
 123      margin-bottom: 0;
 124  
 125      .control-label {
 126        padding: 0;
 127      }
 128    }
 129  }
 130  
 131  .languageForm {
 132    padding: 0 0 30px;
 133  
 134    .form-select {
 135      width: 100%;
 136    }
 137  }
 138  
 139  // Alerts
 140  #system-message-container joomla-alert {
 141    margin-top: 25px;
 142  }
 143  
 144  .alert-heading {
 145    font-size: $h4-font-size;
 146  }
 147  
 148  .hidden,
 149  [hidden="hidden"] {
 150    display: none;
 151  }
 152  
 153  .btn-success {
 154    color: #fff;
 155    background-color: #75b544;
 156    border-color: #75b544;
 157  }
 158  
 159  
 160  // Form
 161  
 162  .form-control {
 163    background-color: var(--white-offset);
 164  
 165    &.input-full {
 166      max-width: 100%;
 167    }
 168  
 169  }
 170  
 171  label {
 172    margin-bottom: .5rem;
 173  }
 174  
 175  .control-group {
 176    margin-bottom: 18px;
 177  
 178    &::after {
 179      display: table;
 180      clear: both;
 181      content: "";
 182    }
 183  
 184    .control-label {
 185      padding-top: 5px;
 186      padding-right: 5px;
 187      text-align: left;
 188    }
 189  }
 190  
 191  .spacer hr {
 192    width: 380px;
 193  }
 194  
 195  .card .form-select {
 196    width: 100%;
 197  }
 198  
 199  td .form-control {
 200    display: inline-block;
 201    width: auto;
 202  }
 203  
 204  legend {
 205    margin-bottom: 1.1rem;
 206  }
 207  
 208  .checkboxes {
 209    padding-top: 5px;
 210  
 211    .checkbox input {
 212      position: static;
 213      margin-left: 0;
 214    }
 215  
 216  }
 217  
 218  .form-check {
 219    padding-top: 5px;
 220    margin-bottom: 0;
 221  }
 222  
 223  // Possibly temporary until Bootstrap support it themselves
 224  .form-select[multiple] {
 225    height: auto;
 226    background: none;
 227  }
 228  
 229  // Block display for the validation message
 230  .form-control-feedback {
 231    display: block;
 232    color: $red;
 233  }
 234  
 235  // Language Table
 236  caption {
 237    caption-side: top;
 238  }
 239  
 240  .bg-warning {
 241    color: #292b2c;
 242  }
 243  
 244  // footer
 245  .footer {
 246    position: fixed;
 247    bottom: 0;
 248    left: 0;
 249    z-index: $zindex-header;
 250    background-color: $white;
 251    box-shadow: 0 0 1px 1px rgba(0, 0, 0, .25);
 252  }
 253  
 254  .table > :not(:last-child) > :last-child > * {
 255    border-bottom-color: $table-border-color;
 256  }