swc-01

swc-01.html

<layout-box layout="horizontal" align="center" responsive>

  <data-source id="citiesDS" table="cities"></data-source>

  <app-form for="citiesDS" required="city,state">

    <layout-box layout="vertical">

      <h2>Cities</h2>

      <text-box style="width:15em" name="city" placeholder="Keene"></text-box>
      <text-box style="width:2em" name="state" placeholder="NH"></text-box>
      <text-box style="width:4em" name="population" placeholder="23000"></text-box>
      
      <app-button style="text-align: left;" label="Add City"></app-button>

      <list-view style="text-align: left;" for="citiesDS" fields="city,state,population">
        <list-card style="background-color: rgb(239, 236, 232); border: none;" />
      </list-view>

    </layout-box>

  </app-form>  
</layout-box>