designer

designer.html

<link rel="import" href="../at-carbon-container/at-carbon-container.html">
<link rel="import" href="../at-core-data-sample/at-core-data-sample.html">
<link rel="import" href="../at-core-spinner/at-core-spinner.html">

<polymer-element name="feed-item" attributes="item">

  <template>
    <style>    
      .item {
        box-sizing: border-box;
        height: 80px;
        padding: 4px;
        cursor: default;
        overflow: hidden;
      }
      .item a {
        text-decoration: none;
        color: black;
      }
      .title, .entry_published {
        width: 100%;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
      }
      .title {
        font-weight: bolder;
      }
      .content {
        height: 45px;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-overflow: ellipsis;
      }
      .caption h1 {
        -webkit-margin-before: 0px;
      }
      .body {
        font-size: 12px;
      }
      #at_carbon_container {
        left: 1410px;
        top: 250px;
      }
    </style>
    <at-carbon-container visible="{{ item.x }}" id="at_carbon_container">to be,</at-carbon-container>
    <at-carbon-container visible="{{ item.y }}" id="at_carbon_container">or not to be</at-carbon-container>
    <div class="item">
      <a href target="_blank" class="entry_title">
        <div class="title">{{ item.title }}</div>
        <small class="entry_published">{{ item.pubDate }}</small>
      </a>
    </div>
    <at-core-data-sample data="{{ item }}" id="at_core_data_sample">{
       "title": "value",
       "x": true,
			"y": false      
    }</at-core-data-sample>
    <at-core-actvity id="at_core_actvity"></at-core-actvity>
    <at-core-spinner visible type="wave" id="at_core_spinner"></at-core-spinner>

  </template>

  <script>

    Polymer({
      
    });

  </script>

</polymer-element>