.row.active_table_row{"ng-click" => "toggle()", "ng-class" => "{'closed' : !open(), 'has_shopfront' : producer.has_shopfront}"}
  .columns.small-12.medium-4.large-4.skinny-head
    / This needs logic to show profile only icon when available %i.ofn-i_060-producer-reversed
    %i{ng: {class: "producer.producer_icon_font"}}
    %span.margin-top
      %strong 
        %a{"bo-if" => "producer.has_shopfront" } {{ producer.path }}
        
  .columns.small-6.medium-3.large-3
    %span.margin-top {{ producer.address.city }}
  .columns.small-4.medium-3.large-4
    %span.margin-top {{ producer.address.state_name | uppercase }}
  .columns.small-2.medium-2.large-1.text-right
    %span.margin-top 
      %i{"ng-class" => "{'ofn-i_005-caret-down' : !open(), 'ofn-i_006-caret-up' : open()}"}

.row.active_table_row{"ng-click" => "toggle()", "ng-class" => "{'closed' : !open(), 'has_shopfront' : producer.has_shopfront}"}
  .columns.small-12.medium-4.large-4.skinny-head
    / This needs logic to show profile only icon when available %i.ofn-i_060-producer-reversed
    %span{"bo-if" => "producer.has_shopfront" }
      %a{"bo-href" => "producer.path" } 
        %i{ng: {class: "producer.producer_icon_font"}}
        %span.margin-top 
          %strong {{ producer.name }}
    %span{"bo-if" => "!producer.has_shopfront" }
      %i{ng: {class: "producer.producer_icon_font"}}
      %span.margin-top 
        %strong {{ producer.name }}

        
  .columns.small-6.medium-3.large-3
    %span.margin-top {{ producer.address.city }}
  .columns.small-4.medium-3.large-4
    %span.margin-top {{ producer.address.state_name | uppercase }}
  .columns.small-2.medium-2.large-1.text-right
    %span.margin-top 
      %i{"ng-class" => "{'ofn-i_005-caret-down' : !open(), 'ofn-i_006-caret-up' : open()}"}

Tweak markup to show producer name and write logic for link around producer if also own shopfront
Tweak markup to show producer name and write logic for link around producer if also own shopfront
