[Summary view] [Print] [Text view]

   1  .subhead {
   2    position: sticky;
   3    top: 0;
   4    right: 0;
   5    left: 0;
   6    z-index: $zindex-toolbar;
   7    width: auto;
   8    min-height: 43px;
   9    padding: 8px 1rem;
  10    color: var(--template-text-dark); //#0c192e;
  11    background: $white;
  12    background-image: linear-gradient(var(--toolbar-bg), var(--template-bg-dark-3));
  13    box-shadow: 0 2px 10px -8px var(--template-bg-dark-50);
  14  
  15    .row {
  16      margin-right: 0;
  17      margin-left: 0;
  18    }
  19  
  20    &.noshadow {
  21      box-shadow: none;
  22    }
  23  
  24    joomla-toolbar-button,
  25    .btn-group {
  26      margin-inline-start: .75rem;
  27  
  28      &:first-child {
  29        margin-inline-start: 0;
  30      }
  31    }
  32  
  33    joomla-toolbar-button {
  34      .btn > span,
  35      .dropdown-item > span {
  36        margin-inline-end: .5rem;
  37        width: 1.25em;
  38        text-align: center;
  39      }
  40    }
  41  
  42    .btn {
  43      --subhead-btn-accent: var(--template-text-dark);
  44      padding: 0 1rem;
  45      margin: 5px 0;
  46      font-size: 1rem;
  47      line-height: $atum-toolbar-line-height;
  48      color: var(--template-text-dark);
  49      background: $white;
  50      border-color: hsl(var(--hue),20%,80%);
  51  
  52      > span {
  53        display: inline-block;
  54        color: var(--subhead-btn-accent);
  55      }
  56  
  57      &:not([disabled]):hover,
  58      &:not([disabled]):active,
  59      &:not([disabled]):focus {
  60        color: rgba(255, 255, 255, .9);
  61        background-color: var(--subhead-btn-accent);
  62        border-color: var(--subhead-btn-accent);
  63  
  64        > span {
  65          color: rgba(255, 255, 255, .9);
  66        }
  67      }
  68  
  69      &.btn-success {
  70        --subhead-btn-accent: var(--success);
  71      }
  72  
  73      &.btn-danger {
  74        --subhead-btn-accent: var(--danger);
  75      }
  76  
  77      &.btn-primary {
  78        --subhead-btn-accent: var(--template-link-color);
  79      }
  80  
  81      &.btn-secondary {
  82        --subhead-btn-accent: var(--template-special-color);
  83      }
  84  
  85      &.btn-info {
  86        --subhead-btn-accent: var(--template-bg-dark);
  87      }
  88  
  89      &.btn-action {
  90        --subhead-btn-accent: var(--template-bg-dark);
  91        display: flex;
  92        align-items: center;
  93  
  94        &::after {
  95          width: 2.375rem;
  96          font-family: "Font Awesome 5 Free";
  97          font-weight: 900;
  98          content: "\f078";
  99          border: 0;
 100        }
 101      }
 102  
 103      &[disabled],
 104      &.dropdown-toggle[disabled] {
 105        --subhead-btn-accent: var(--template-bg-dark);
 106        background: rgba($gray-300, .8);
 107        opacity: .5;
 108  
 109        &:hover,
 110        &:active,
 111        &:focus {
 112          cursor: not-allowed;
 113        }
 114      }
 115    }
 116  
 117    .dropdown-toggle {
 118      &.btn {
 119        padding-inline-end: 0;
 120      }
 121    }
 122  
 123    .btn-group:not(:last-child) > .dropdown-toggle-split {
 124      order: 1;
 125      margin-inline-start: -$border-radius;
 126  
 127      [dir="ltr"] & {
 128        border-radius: 0 $border-radius $border-radius 0;
 129      }
 130  
 131      [dir="rtl"] & {
 132        border-radius: $border-radius 0 0 $border-radius;
 133      }
 134    }
 135  
 136    .dropdown-menu joomla-toolbar-button,
 137    .btn-group joomla-toolbar-button {
 138      margin-inline-start: 0;
 139    }
 140  
 141    .contentpane & {
 142      margin: -15px -15px 0;
 143      background-image: none;
 144      border-bottom: 1px solid var(--template-bg-dark-7);
 145    }
 146  }
 147  
 148  @include media-breakpoint-down(sm) {
 149    joomla-tab[view=accordion] .col-md-9,
 150    joomla-tab[view=accordion] .col-md-3 {
 151      padding: .5rem 1rem !important;
 152    }
 153  
 154    #myTab {
 155      margin-top: 1rem;
 156      margin-bottom: 1.5rem;
 157    }
 158  
 159    joomla-tab[view=accordion] ul li {
 160      width: 100%;
 161    }
 162  
 163    .toggler-toolbar {
 164      top: 0;
 165      bottom: auto;
 166      z-index: $zindex-alerts;
 167      padding: 7px 10px;
 168      margin: 5px;
 169      background-color: var(--template-bg-dark);
 170      border-radius: 30px;
 171  
 172      .toggler-toolbar-icon::before {
 173        font: normal normal 900 28px/1 "Font Awesome 5 Free";
 174        color: var(--toggle-color);
 175        content: "\f00d";
 176      }
 177  
 178      &.collapsed .toggler-toolbar-icon::before {
 179        content: "\f085";
 180      }
 181    }
 182  
 183    .subhead {
 184      padding-right: 0;
 185      padding-left: 0;
 186  
 187      joomla-toolbar-button,
 188      .btn-group,
 189      .btn {
 190        width: 100%;
 191        margin-left: 0;
 192        text-align: left;
 193      }
 194  
 195      .btn-toolbar > .btn-group,
 196      .btn-toolbar > joomla-toolbar-button {
 197        margin-left: 0;
 198      }
 199  
 200      .btn.btn-action::after {
 201        text-align: center;
 202        margin-inline-start: auto;
 203      }
 204  
 205      .dropdown-toggle-split {
 206        width: auto;
 207      }
 208    }
 209  }