1
    2
    3
    4
    5
    6
    7
    8
    9
   10
   11
   12
   13
   14
   15
   16
   17
   18
   19
   20
   21
   22
   23
   24
   25
   26
   27
   28
   29
   30
   31
   32
   33
   34
   35
   36
   37
   38
   39
   40
   41
   42
   43
   44
   45
   46
   47
   48
   49
   50
   51
   52
   53
   54
   55
   56
   57
   58
   59
   60
   61
   62
   63
   64
   65
   66
   67
   68


ash / webui / scanning / resources / action_toolbar.html [blame]

<style include="scanning-shared">
  :host-context(body.jelly-enabled) #actionToolbar {
    background-color: var(--cros-sys-secondary_container);
  }

  :host-context(body.jelly-enabled) #pageNumbers {
    font: var(--cros-button-2-font);
  }

  :host-context(body:not(.jelly-enabled)) cr-icon-button {
    --cr-icon-button-fill-color: var(--google-grey-200);
    --cr-icon-button-hover-background-color:
          rgba(var(--google-grey-900-rgb), .4);
  }

  #actionToolbar {
    align-items: center;
    background-color: rgba(var(--google-grey-900-rgb), .8);
    border-radius:  calc(var(--action-toolbar-height) / 2);
    display: flex;
    height: var(--action-toolbar-height);
    justify-content: center;
    width: var(--action-toolbar-width);
  }

  .separator {
    background-color: white;
    border-inline-start: var(--cr-separator-line);
    flex-shrink: 0;
    height: 22px;
    margin: 0 16px;
    opacity: .14;
  }

  cr-icon-button {
    --cr-icon-button-margin-start: 0;
    --cr-icon-button-size: 24px;
  }

  #pageNumbers {
    color: var(--scanning-action-toolbar-text-color);
    font-family: var(--scanning-action-toolbar-font-family);
    font-size: var(--scanning-action-toolbar-font-size);
    font-weight: var(--scanning-medium-font-weight);
    line-height: var(--scanning-action-toolbar-line-height);
  }

  #removePageIcon {
    --cr-icon-button-margin-end: 16px;
    --cr-icon-image: url(svg/remove_page.svg);
  }

  #rescanPageIcon {
    --cr-icon-image: url(svg/rescan_page.svg);
  }
</style>
<div id="actionToolbar">
  <div id="pageNumbers" aria-hidden="true">[[pageNumberText]]</div>
  <div class="separator"></div>
  <div>
    <cr-icon-button id="removePageIcon" on-click="onRemovePageIconClick"
        title="[[i18n('removePageButtonLabel')]]">
    </cr-icon-button>
    <cr-icon-button id="rescanPageIcon" on-click="onRescanPageIconClick"
         title="[[i18n('rescanPageButtonLabel')]]">
    </cr-icon-button>
  </div>
</div>