src/third_party/polymer/components/core-item/core-item.html

   1 <!--
   2 Copyright (c) 2014 The Polymer Project Authors. All rights reserved.
   3 This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
   4 The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
   5 The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
   6 Code distributed by Google as part of the polymer project is also
   7 subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
   8 -->
   9
  10 <!--
  11 `core-item` is a simple line-item object: a label and/or an icon that can also
  12 act as a link.
  13
  14 Example:
  15
  16     <core-item icon="settings" label="Settings"></core-item>
  17
  18 To use as a link, put &lt;a&gt; element in the item.
  19
  20 Example:
  21
  22     <core-item icon="settings" label="Settings">
  23       <a href="#settings" target="_self"></a>
  24     </core-item>
  25
  26 @group Polymer Core Elements
  27 @element core-item
  28 @homepage github.io
  29 -->
  30
  31 <link rel="import" href="../core-icon/core-icon.html">
  32
  33 <link rel="stylesheet" href="core-item.css" shim-shadowdom>
  34
  35 <polymer-element name="core-item" attributes="label icon src" horizontal center layout>
  36 <template>
  37
  38   <core-icon src="{{src}}" icon="{{icon}}" hidden?="{{!src && !icon}}"></core-icon>
  39   <div id="label">{{label}}</div>
  40   <content></content>
  41
  42 </template>
  43 <script>
  44
  45   Polymer('core-item', {
  46
  47     /**
  48      * The URL of an image for the icon.
  49      *
  50      * @attribute src
  51      * @type string
  52      * @default ''
  53      */
  54
  55     /**
  56      * Specifies the icon from the Polymer icon set.
  57      *
  58      * @attribute icon
  59      * @type string
  60      * @default ''
  61      */
  62
  63     /**
  64      * Specifies the label for the menu item.
  65      *
  66      * @attribute label
  67      * @type string
  68      * @default ''
  69      */
  70
  71   });
  72
  73 </script>
  74 </polymer-element>