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
   69
   70
   71
   72
   73
   74
   75
   76
   77
   78
   79
   80
   81
   82
   83
   84
   85
   86
   87
   88
   89
   90
   91
   92
   93
   94
   95
   96
   97
   98
   99
  100
  101
  102
  103
  104
  105
  106
  107
  108
  109
  110
  111
  112
  113
  114
  115
  116
  117
  118
  119
  120
  121
  122
  123
  124
  125
  126
  127
  128
  129
  130
  131
  132
  133
  134


ash / webui / os_feedback_ui / resources / confirmation_page.html [blame]

<style include="os-feedback-shared cros-color-overrides">
  :host {
    --cr-icon-button-margin-start: 20px;
    --cr-section-vertical-padding: 11px;
    --iron-icon-height: 40px;
  }

  :host-context(body.jelly-enabled) .label {
    font: var(--cros-button-1-font);
  }

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

  :host-context(body.jelly-enabled) cr-link-row {
    background-color: var(--cros-sys-app_base);
    border: none;
    border-radius: 16px;
  }

  cr-link-row {
    --cr-link-row-icon-width: 40px;
    border: 1px solid var(--cros-separator-color);
    border-radius: 4px;
    box-sizing: border-box;
    margin: 12px 0 0 0;
  }

  #buttonDone {
    display: flex;
    height: 32px;
    padding: 6px 16px;
    width: 63px;
  }

  #help-resources {
    display: flex;
    flex-direction: column;
  }

  #helpResourcesLabel {
    margin: 24px 0 12px 0;
  }

  .label {
    color: var(--cros-text-color-primary);
    font-family: var(--feedback-roboto-font-family);
    font-size: 14px;
    font-weight: var(--feedback-medium-font-weight);
    line-height: 20px;
  }

  .sub-label {
    color: var(--cros-text-color-secondary);
    font-family: var(--feedback-roboto-font-family);
    font-size: 13px;
    font-weight: var(--feedback-regular-font-weight);
    line-height: 20px;
  }

  #helpResourcesLabel {
    color: var(--cros-text-color-secondary);
    font-family: var(--feedback-google-sans-font-family);
    font-size: 15px;
    font-weight: var(--feedback-medium-font-weight);
    line-height: 22px;
    margin: 24px 0 0;
  }

  cr-link-row::part(icon) {
    --cr-icon-button-fill-color: var(--cros-icon-color-primary);
  }

  cr-link-row::part(icon):focus-visible {
    box-shadow: none;
    outline: 2px solid var(--cros-focus-ring-color);
  }

  .page-title:focus {
    outline: none;
  }
</style>
<div id="container">
  <div id="header">
    <h1 id="pageTitle" class="page-title" tabindex="-1">
      [[getTitle(sendReportStatus)]]</h1>
  </div>
  <div id="shadowElevation"></div>
  <div id="content" on-scroll="onContainerScroll">
    <div id="message" class="sub-label">[[getMessage(sendReportStatus)]]</div>
    <div id="helpResources" hidden$="[[!isUserLoggedIn]]">
      <h2 id="helpResourcesLabel">[[i18n('helpResourcesLabel')]]</h2>
      <cr-link-row id="explore" start-icon="help-resources:explore"
          external using-slotted-label
          button-aria-description=""
          on-click="handleLinkClicked">
          <span slot="label" class="label">[[i18n('exploreAppLabel')]]</span>
          <span slot="sub-label"
              class="sub-label">[[i18n('exploreAppDescription')]]
          </span>
      </cr-link-row>
      <cr-link-row id="diagnostics" start-icon="help-resources:diagnostics"
          external using-slotted-label
          button-aria-description=""
          on-click="handleLinkClicked">
          <span slot="label" class="label">[[i18n('diagnosticsAppLabel')]]</span>
          <span slot="sub-label"
              class="sub-label">[[i18n('diagnosticsAppDescription')]]
          </span>
      </cr-link-row>
      <cr-link-row id="chromebookCommunity"
          start-icon="help-resources2:chromebook-community"
          hidden="[[isOffline(sendReportStatus)]]" external using-slotted-label
          button-aria-description=""
          on-click="handleLinkClicked">
          <span slot="label" class="label">[[i18n('askCommunityLabel')]]</span>
          <span slot="sub-label"
              class="sub-label">[[i18n('askCommunityDescription')]]
          </span>
      </cr-link-row>
    </div>
    <div id="shadowShield"></div>
  </div>
  <div id="separator"></div>
  <div id="navButtons">
    <cr-button id="buttonNewReport" class="cancel-button"
        on-click="handleBackButtonClicked">
      <span>[[i18n('buttonNewReport')]]</span>
    </cr-button>
    <cr-button id="buttonDone" class="action-button"
      on-click="handleDoneButtonClicked">[[i18n('buttonDone')]]</cr-button>
  </div>
</div>