<div class="page hidden" id="aboutPage">
  <h1 i18n-content="product"></h1>
  <div id="aboutPageLessInfo">
    <section>
      <div>
        <!-- White space is significant between spans. -->
        <div>
          <span i18n-content="browser"></span>
          <span i18n-content="browser_version"></span>
        </div>
        <div><span i18n-content="os"></span> <span id="osVersion0">
          <span class="loading" i18n-content="loading"></span></span></div>
        <div><span i18n-content="firmware"></span> <span id="osFirmware0">
          <span class="loading" i18n-content="loading"></span></span></div>
        <div>
          <button class="link-button" id="moreInfoButton"
                  i18n-content="more_info"></button>
        </div>
      </div>
    </section>
  </div>
  <div class="hidden" id="aboutPageMoreInfo">
    <section>
      <h3 i18n-content="channel"></h3>
      <div>
        <select id="channelSelect">
          <option value="stable-channel" i18n-content="stable"></option>
          <option value="beta-channel" i18n-content="beta"></option>
          <option value="dev-channel" i18n-content="dev"></option>
        </select>
        <div hidden id="channelWarningBlock">
          <div id="channelWarning" i18n-content="channel_warning_header"></div>
          <div i18n-content="channel_warning_text"></div>
        </div>
      </div>
    </section>
    <section>
      <h3 i18n-content="browser"></h3>
      <div i18n-content="browser_version"></div>
    </section>
    <section>
      <h3 i18n-content="os"></h3>
      <div id="osVersion1">
        <span class="loading" i18n-content="loading"></span>
      </div>
    </section>
    <section>
      <h3 i18n-content="firmware"></h3>
      <div id="osFirmware1">
        <span class="loading" i18n-content="loading"></span>
    </section>
    <section>
      <h3>WebKit</h3>
      <div i18n-content="webkit_version"></div>
    </section>
    <section>
      <h3 i18n-content="js_engine"></h3>
      <div i18n-content="js_engine_version"></div>
    </section>
    <section>
      <h3 i18n-content="user_agent"></h3>
      <div i18n-content="user_agent_info"></div>
    </section>
    <section>
      <h3 i18n-content="command_line"></h3>
      <div i18n-content="command_line_info"></div>
    </section>
  </div>
  <section>
    <div>
      <div i18n-content="copyright"></div>
      <div>
        <!-- Odd formatting to avoid unwanted spaces between elements. -->
        <span i18n-content="license_content_0">
        </span><a target="_blank"
                  i18n-values="href:license_link_0"
                  i18n-content="license_link_content_0">
        </a><span i18n-content="license_content_1">
        </span><a target="_blank"
                  i18n-values="href:license_link_1"
                  i18n-content="license_link_content_1">
        </a><span i18n-content="license_content_2">
        </span>
      </div>
      <div>
        <span i18n-content="cros_license_content_0">
        </span><a target="_blank"
                  i18n-values="href:cros_license_link_0"
                  i18n-content="cros_license_link_content_0">
        </a><span i18n-content="cros_license_content_1">
        </span>
      </div>
    </div>
  </section>
  <section>
    <div>
      <div>
        <div id="updateIcon" class="update-icon up-to-date"></div>
        <span id="updateStatus" i18n-content="update_status"></span>
      </div>
      <div>
        <!-- TODO seanparent: fill in last checked. -->
        <!-- <span i18n-content="last_check"></span> -->
        <button disabled id="checkNow" i18n-content="check_now"></button>
      </div>
    </div>
  </section>
</div>