<!--
  The <repeat-after-days-sk> custom element declaration. Displays an iron-selector allowing
  the user to choose whether their task should be repeated either never, daily, every other day
  or weekly.

  Attributes:
    selected: Item of repeat-after-days that is currently selected. Notifies.

  Events:
    None.

  Methods:
    None.
-->

<dom-module id="repeat-after-days-sk">
  <style>
    .iron-selected {
      background-color: #D6ECF2;
    }

    iron-selector.short-field > div {
      width: 5em;
    }
  </style>
  <template>
    <table>
      <tr>
        <td>
          <iron-selector attr-for-selected="name" selected="{{selected}}" class="short-field">
            <div name="0">0</div> 
            <div name="1">1</div> 
            <div name="2">2</div> 
            <div name="7">7</div> 
          </iron-selector>
        </td>
        <td>
          Never repeat <br/>
          Repeat daily <br/>
          Repeat every other day <br/>
          Repeat weekly <br/>
        </td>
      </tr>
    </table>
  </template>
</dom-module>

<script>
   Polymer({
     is: "repeat-after-days-sk",
     properties: {
       selected: {
         type: String,
         value: '0',  // Select no repeats by default.
       },
     },
   });
</script>