diff --git a/app/assets/images/groups.svg b/app/assets/images/groups.svg new file mode 100644 index 0000000000..f4ca32ec27 --- /dev/null +++ b/app/assets/images/groups.svg @@ -0,0 +1,1565 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/app/assets/stylesheets/darkswarm/groups.css.sass b/app/assets/stylesheets/darkswarm/groups.css.sass new file mode 100644 index 0000000000..b859273ab7 --- /dev/null +++ b/app/assets/stylesheets/darkswarm/groups.css.sass @@ -0,0 +1,42 @@ +@import branding +@import mixins + +#groups + background-color: $clr-brick-light + background-image: url("/assets/groups.svg") + background-position: center 15px + background-repeat: no-repeat + padding-bottom: 20px + +.group + padding-bottom: 40px + hr + border-bottom: 10px solid white + outline: 0 + border-top: 0 + margin: 0 + +.group-hero + position: relative + padding: 0 + border: 10px solid white + background: white + +h3.group-name + margin-top: 0.5em + margin-bottom: 0.15em + +img.group-logo + max-width: 220px + max-height: 86px + float: right + padding-top: 10px + + +img.group-hero-img + background-color: black + width: 100% + height: inherit + max-height: 260px + min-height: 120px + overflow: hidden \ No newline at end of file diff --git a/app/assets/stylesheets/darkswarm/mixins.sass b/app/assets/stylesheets/darkswarm/mixins.sass index fde601f2d9..fd26cfcae9 100644 --- a/app/assets/stylesheets/darkswarm/mixins.sass +++ b/app/assets/stylesheets/darkswarm/mixins.sass @@ -85,10 +85,10 @@ &, & * color: $clr-turquoise a - color: white + color: $clr-turquoise &:hover text-decoration: none - color: $clr-turquoise-light + color: $clr-turquoise-bright @mixin fullbg background-position: center center diff --git a/app/models/enterprise.rb b/app/models/enterprise.rb index 5e53316607..2a61344d03 100644 --- a/app/models/enterprise.rb +++ b/app/models/enterprise.rb @@ -19,8 +19,8 @@ class Enterprise < ActiveRecord::Base delegate :latitude, :longitude, :city, :state_name, :to => :address accepts_nested_attributes_for :address - has_attached_file :logo, :styles => { :medium => "300x300>", :thumb => "100x100>" }, :default_url => "/images/:style/missing.png" - has_attached_file :promo_image, :styles => { :large => "570x380>", :thumb => "100x100>" }, :default_url => "/images/:style/missing.png" + has_attached_file :logo, :styles => { :medium => "300x300>", :thumb => "100x100>" } + has_attached_file :promo_image, :styles => { :large => "260x1200#", :thumb => "100x100>" } validates_presence_of :name validates_presence_of :address diff --git a/app/models/enterprise_group.rb b/app/models/enterprise_group.rb index 6c163b087a..1cea76db72 100644 --- a/app/models/enterprise_group.rb +++ b/app/models/enterprise_group.rb @@ -9,7 +9,7 @@ class EnterpriseGroup < ActiveRecord::Base attr_accessible :name, :description, :long_description, :on_front_page, :enterprise_ids attr_accessible :promo_image - has_attached_file :promo_image, styles: {medium: "800>400"} + has_attached_file :promo_image, styles: {large: "260x1200#"} validates_attachment_content_type :promo_image, :content_type => /\Aimage\/.*\Z/ attr_accessible :logo diff --git a/app/views/groups/index.html.haml b/app/views/groups/index.html.haml index 552e45fd48..afa28624f0 100644 --- a/app/views/groups/index.html.haml +++ b/app/views/groups/index.html.haml @@ -1,10 +1,15 @@ #groups{"ng-controller" => "GroupsCtrl"} :javascript angular.module('Darkswarm').value('groups', #{render partial: "json/groups", object: @groups}) - .row + .row.pad-top .small-12.columns.text-center %h1 Groups / Regions - %h3 Check out our food groups below + %div + Check out our + %ofn-modal{title: "food groups"} + = render partial: "modals/groups" + below + %p %input{type: :text, "ng-model" => "query", @@ -12,14 +17,27 @@ "ng-debounce" => "150", "ofn-disable-enter" => true} - .row.group_table{bindonce: true} - .small.12.columns - .group{"ng-repeat" => "group in Groups.groups | filter:query | orderBy:order"} - %h2 {{ group.name }} - %p {{ group.description }} + .group{"ng-repeat" => "group in Groups.groups | filter:query | orderBy:order"} + + .row.pad-top{bindonce: true} + .small-12.columns + .group-hero + %img.group-hero-img{"bo-src" => "group.promo_image"} + %img.group-logo{"bo-src" => "group.logo"} + %h3.group-name {{ group.name }} + %h5.group-description {{ group.description }} + + .row.pad-top{bindonce: true} + .small-6.columns %p {{ group.long_description }} - %img{"bo-src" => "group.logo"} - - %ul + .small-6.columns + %h5 Our hubs & producers + %ul.small-block-grid-2 %li{"ng-repeat" => "enterprise in group.enterprises"} %a{"bo-href" => "enterprise.path"} {{ enterprise.name }} + + .row.group_footer + .small-12.columns + %hr + += render partial: "shared/footer" diff --git a/app/views/home/_groups.html.haml b/app/views/home/_groups.html.haml index 0e16977f20..dd55a9bcd1 100644 --- a/app/views/home/_groups.html.haml +++ b/app/views/home/_groups.html.haml @@ -5,6 +5,6 @@ %h2 Groups / Regions %h5 See all the groups & regions on the Open Food Network %p - %button.neutral-btn.light + %a.neutral-btn.light{href: "/groups"} %i.fi-torsos-all View groups & regions \ No newline at end of file diff --git a/app/views/home/_producers.html.haml b/app/views/home/_producers.html.haml index c24f170e72..31a573d610 100644 --- a/app/views/home/_producers.html.haml +++ b/app/views/home/_producers.html.haml @@ -5,6 +5,6 @@ %h2 Producers %h5 Looking for a specific producer or farmer? %p - %button.neutral-btn.turquoise + %a.neutral-btn.turquoise{href: "/producers"} %i.fi-trees View all producers \ No newline at end of file diff --git a/app/views/json/_groups.rabl b/app/views/json/_groups.rabl index 9475b425c4..27325bb850 100644 --- a/app/views/json/_groups.rabl +++ b/app/views/json/_groups.rabl @@ -6,5 +6,9 @@ child enterprises: :enterprises do end node :logo do |group| - group.logo(:original) + group.logo(:medium) if group.logo.exists? +end + +node :promo_image do |group| + group.promo_image(:large) if group.promo_image.exists? end diff --git a/app/views/modals/_groups.html.haml b/app/views/modals/_groups.html.haml new file mode 100644 index 0000000000..80e210c98a --- /dev/null +++ b/app/views/modals/_groups.html.haml @@ -0,0 +1,4 @@ +%h2 Groups / Regions +%p These are the organisations and relationships between hubs which make up the Open Food Network. +%p Some groups are clustered by location or council, others by non-geographic similarities. +%a.close-reveal-modal{"ng-click" => "cancel()"} × \ No newline at end of file diff --git a/app/views/shop/products.rabl b/app/views/shop/products.rabl index ee5e567285..b1567a311a 100644 --- a/app/views/shop/products.rabl +++ b/app/views/shop/products.rabl @@ -13,10 +13,10 @@ child :supplier => :supplier do attributes :id, :name, :description, :long_description, :website, :instagram, :facebook, :linkedin, :twitter node :logo do |supplier| - supplier.logo.url + supplier.logo(:medium) if supplier.logo.exists? end node :promo_image do |supplier| - supplier.promo_image.url + supplier.promo_image(:large) if supplier.promo_image.exists? end end diff --git a/config/initializers/paperclip.rb b/config/initializers/paperclip.rb new file mode 100644 index 0000000000..c40b9a4130 --- /dev/null +++ b/config/initializers/paperclip.rb @@ -0,0 +1,3 @@ +Paperclip::Attachment.default_options[:convert_options] = { + all: "-auto-orient" +}