[Summary view] [Print] [Text view]

   1  .media-toolbar {
   2    position: sticky;
   3    top: 67px;
   4    z-index: 1;
   5    display: flex;
   6    flex-wrap: wrap;
   7    padding: 0;
   8    background-color: $toolbar-bg;
   9    border-bottom: 1px solid $border-color;
  10    border-inline-start: 1px solid $border-color;
  11    border-radius: 0 $border-radius 0 0;
  12    box-shadow: 0 -1px 0 0  $border-color;
  13    input {
  14      padding: .3rem .75rem;
  15    }
  16    &-icon {
  17      display: inline-block;
  18      width: $toolbar-icon-width;
  19      font-size: 1.3rem;
  20      line-height: $toolbar-height;
  21      color: var(--template-bg-dark-60);
  22      text-align: center;
  23      background-color: transparent;
  24      border: 0;
  25      border-inline-start: 1px solid $border-color;
  26      box-shadow: 1px 0 #fefefe inset;
  27      &:hover {
  28        background-color: $toolbar-icon-bg-hover;
  29        box-shadow: none;
  30      }
  31    }
  32    &-select-all {
  33      width: 1rem;
  34      margin: 1rem;
  35    }
  36  }
  37  
  38  .media-view-icons {
  39    display: flex;
  40    .disabled {
  41      span {
  42        opacity: .3;
  43      }
  44      &:hover, span:hover {
  45        cursor: default;
  46      }
  47    }
  48  }
  49  
  50  .media-view-search-input {
  51    display: flex;
  52    align-items: center;
  53    padding: 0 5px;
  54  }
  55  
  56  .media-loader {
  57    position: absolute;
  58    right: 100%;
  59    bottom: 0;
  60    left: 0;
  61    z-index: 10;
  62    height: $toolbar-loader-height;
  63    background-image: $toolbar-loader-color;
  64    animation: 10s ease 0s normal none 1 running mediaLoader;
  65    animation-fill-mode: forwards;
  66  }
  67  
  68  @keyframes mediaLoader {
  69    from {
  70      right: 100%;
  71    }
  72  
  73    to {
  74      right: 0;
  75    }
  76  }