chrome/browser/resources/chromeos/login/gaia_card.html

   1 <!-- Copyright 2015 The Chromium Authors. All rights reserved.
   2      Use of this source code is governed by a BSD-style license that can be
   3      found in the LICENSE file. -->
   4
   5 <link rel="import" href="chrome://resources/polymer/v1_0/iron-flex-layout/classes/iron-flex-layout.html">
   6 <link rel="import" href="chrome://resources/polymer/v1_0/paper-progress/paper-progress.html">
   7 <link rel="import" href="chrome://resources/polymer/v1_0/paper-styles/color.html">
   8 <link rel="import" href="chrome://resources/polymer/v1_0/polymer/polymer.html">
   9
  10 <!--
  11   Simple Gaia card which should be used for local UI elements that look like
  12   GAIA. It has blue header and grey footer.
  13
  14   Example:
  15     <gaia-card>
  16       <div class="header" flex vertical layout end-justified start>
  17         ...
  18       </div>
  19       <gaia-input-form class="footer" ...>
  20       </gaia-input-form>
  21     </gaia-card>
  22
  23   Add class |header| to all which you want to go inside blue header.  Similar
  24   with class |footer|.
  25 -->
  26 <dom-module name="gaia-card">
  27   <link rel="stylesheet" href="gaia_card.css">
  28
  29   <template>
  30     <div class="gaia-header vertical layout relative">
  31       <div class="header-container flex vertical layout relative">
  32         <content select=".header"></content>
  33       </div>
  34       <paper-progress id="progress-bar" indeterminate></paper-progress>
  35     </div>
  36     <div class="gaia-footer flex vertical layout">
  37       <div class="footer-container flex vertical layout">
  38         <content select=".footer"></content>
  39       </div>
  40       <div id="bottom-overlay" class="overlay"></div>
  41     </div>
  42     <div id="full-overlay" class="overlay"></div>
  43   </template>
  44 </dom-module>
  45