designer

designer.html

<link rel="import" href="../components/polymer/polymer.html">

<polymer-element name="my-element" attributes="name,phone,email,subscribeTo,publishTo,data">

  <template>
    <style>    
      #td {
        padding: 2px 3px;
        vertical-align: bottom;
      }
      #td1 {
        padding: 2px 3px;
        font-size: 100%;
        vertical-align: bottom;
      }
      #td2 {
        padding: 2px 3px;
        font-size: 100%;
        vertical-align: bottom;
      }
    </style>
    <table border="0" spacing="0">
      <tbody>
        <tr>
          <td>
            <table cellspacing="0" cellpadding="0" dir="ltr">
              <colgroup>
                <col width="100"></col>
                <col width="100"></col>
              </colgroup>
              <tbody>
                <tr>
                  <td rowspan="1" colspan="2">Contact</td>
                </tr>
                <tr>
                  <td></td>
                  <td></td>
                </tr>
                <tr>
                  <td id="td1">Name</td>
                  <td id="td2">{{ name }}</td>
                </tr>
                <tr>
                  <td id="td"></td>
                  <td></td>
                </tr>
                <tr>
                  <td>Phone</td>
                  <td>{{ phone }}</td>
                </tr>
                <tr>
                  <td></td>
                  <td></td>
                </tr>
                <tr>
                  <td>Email</td>
                  <td>{{ email }}</td>
                </tr>
                <tr>
                  <td></td>
                  <td></td>
                </tr>
              </tbody>
            </table>
          </td>
        </tr>
      </tbody>
    </table>
  </template>

  <script>

    Polymer('my-element', {
      name: '',
      phone: '',
      email: '',
      subscribeTo: '',
      publishTo: '',
      nameChanged: function (oldValue,newValue){},
      phoneChanged: function (oldValue,newValue){},
      emailChanged: function (oldValue,newValue){},
      subscribeToChanged: function (oldValue,newValue){},
      publishToChanged: function (oldValue,newValue){},
      dataChanged: function (oldValue,newValue){},
      created: function (){this.data={}},
      ready: function (){},
      attached: function (){},
      detached: function (){},
      attributeChanged: function (attrName, oldVal, newVal){},
      buttonClick: function (event, detail, sender){}
    });

  </script>

</polymer-element>