Merge pull request #7784 from Matt-Yorkley/webpacker-assets

Webpacker assets

Gemfile

@@ -13,7 +13,6 @@ gem 'angular-rails-templates', '>= 0.3.0'
 gem 'awesome_nested_set'
 gem 'ransack', '2.4.2'
 gem 'responders'
-gem 'sass-rails', '< 5.1.0' # this restriction originates from the compass-rails's version
 gem 'webpacker', '~> 5'
 
 gem 'i18n'
@@ -104,16 +103,12 @@ gem 'whenever', require: false
 gem 'test-unit', '~> 3.5'
 
 gem 'coffee-rails', '~> 5.0.0'
-gem 'compass-rails'
 
 gem 'mini_racer', '0.4.0'
 
 gem 'uglifier', '>= 1.0.3'
 
 gem 'angular_rails_csrf'
-gem 'foundation-icons-sass-rails'
-
-gem 'foundation-rails', '= 5.5.2.1'
 
 gem 'jquery-rails', '4.4.0'
 gem 'jquery-ui-rails', '~> 4.2'

Gemfile.lock

@@ -196,7 +196,6 @@ GEM
       rubyzip (>= 1.3.0, < 3)
     childprocess (4.1.0)
     chronic (0.10.2)
-    chunky_png (1.4.0)
     climate_control (0.2.0)
     cliver (0.3.2)
     cocaine (0.5.8)
@@ -211,22 +210,6 @@ GEM
     coffee-script-source (1.12.2)
     combine_pdf (1.0.21)
       ruby-rc4 (>= 0.1.5)
-    compass (1.0.3)
-      chunky_png (~> 1.2)
-      compass-core (~> 1.0.2)
-      compass-import-once (~> 1.0.5)
-      rb-fsevent (>= 0.9.3)
-      rb-inotify (>= 0.9)
-      sass (>= 3.3.13, < 3.5)
-    compass-core (1.0.3)
-      multi_json (~> 1.0)
-      sass (>= 3.3.0, < 3.5)
-    compass-import-once (1.0.5)
-      sass (>= 3.2, < 3.5)
-    compass-rails (4.0.0)
-      compass (~> 1.0.0)
-      sass-rails (< 5.1)
-      sprockets (< 4.0)
     concurrent-ruby (1.1.9)
     connection_pool (2.2.5)
     crack (0.4.5)
@@ -319,12 +302,6 @@ GEM
       nokogiri (>= 1.5.11, < 2.0.0)
     foreman (0.87.2)
     formatador (0.2.5)
-    foundation-icons-sass-rails (3.0.0)
-      railties (>= 3.1.1)
-      sass-rails (>= 3.1.1)
-    foundation-rails (5.5.2.1)
-      railties (>= 3.1.0)
-      sass (>= 3.3.0, < 3.5)
     fugit (1.4.5)
       et-orbi (~> 1.1, >= 1.1.8)
       raabro (~> 1.4)
@@ -732,7 +709,6 @@ DEPENDENCIES
   catalog!
   coffee-rails (~> 5.0.0)
   combine_pdf
-  compass-rails
   cuprite
   custom_error_message!
   database_cleaner
@@ -752,8 +728,6 @@ DEPENDENCIES
   flipper-ui
   fog-aws (~> 2.0)
   foreman
-  foundation-icons-sass-rails
-  foundation-rails (= 5.5.2.1)
   fuubar (~> 2.5.1)
   geocoder
   gmaps4rails
@@ -807,7 +781,6 @@ DEPENDENCIES
   rswag
   rubocop
   rubocop-rails
-  sass-rails (< 5.1.0)
   sd_notify
   select2-rails!
   selenium-webdriver

app/assets/javascripts/darkswarm/all.js.coffee

@@ -50,6 +50,7 @@
 #
 #= require modernizr
 #
+#= require foundation-sites/js/foundation.js
 #= require ./darkswarm
 #= require_tree ./mixins
 #= require_tree ./directives

app/assets/javascripts/templates/admin/modals/bulk_invoice.html.haml

@@ -6,7 +6,7 @@
 %p.error{ ng: { show: 'error' } }
   {{error}}
 
-%img.spinner{ src: image_path("spinning-circles.svg"), ng: { show: "loading" } }
+%img.spinner{ src: image_path("/spinning-circles.svg"), ng: { show: "loading" } }
 %p{ ng: { show: "loading" } }
   = t('js.admin.orders.index.please_wait')
 

app/assets/javascripts/templates/admin/modals/image_upload.html.haml

@@ -3,7 +3,7 @@
 
 %form#image_upload{ name: 'form', novalidate: true, enctype: 'multipart/form-data', multipart: true, ng: { controller: "ProductImageCtrl" } }
   %div.image-preview
-    %img.spinner{ src: image_path("spinning-circles.svg"), ng: { hide: "!imageUploader.isUploading" }}
+    %img.spinner{ src: image_path("/spinning-circles.svg"), ng: { hide: "!imageUploader.isUploading" }}
     %img.preview{ng: {src: "{{imagePreview}}", class: "{'faded': imageUploader.isUploading}"}}
 
   %label{for: 'image-upload', class: 'button'} {{ 'admin.products.index.upload_an_image' | t }}

app/assets/javascripts/templates/admin/panels/exchange_products_panel_footer.html.haml

@@ -6,6 +6,6 @@
 
 .sixteen.columns.alpha#loading{ 'ng-show' => 'productsLoading()' }
   %br
-  %img.spinner{ src: image_path("spinning-circles.svg")}
+  %img.spinner{ src: image_path("/spinning-circles.svg")}
   %h1
     {{ 'js.admin.panels.exchange_products.loading_variants' | t }}

app/assets/stylesheets/admin/all.scss

@@ -1,53 +0,0 @@
-/*
- * This is a manifest file that'll automatically include all the stylesheets available in this directory
- * and any sub-directories. You're free to add application-wide styles to this file and they'll appear at
- * the top of the compiled file, but it's generally better to create a new file per style scope.
- *
-
- *= require normalize
- *= require responsive-tables
- *= require jquery.powertip
- *= require jquery.ui.dialog
- *= require shared/textAngular
- *= require shared/ng-tags-input.min
- *= require select2
- *= require flatpickr/dist/flatpickr
- *= require flatpickr/dist/themes/material_blue
- *= require shortcut-buttons-flatpickr/dist/themes/light
-
- *= require_self
-*/
-
-//************************************************************************//
-//************************************************************************//
-@import 'globals/functions';
-@import 'globals/variables';
-@import 'variables';
-@import 'globals/mixins';
-
-@import 'shared/typography';
-@import 'shared/tables';
-@import 'shared/icons';
-@import 'shared/forms';
-@import 'shared/layout';
-
-@import 'plugins/flatpickr-customization';
-
-@import 'plugins/powertip';
-@import 'plugins/jstree';
-@import 'plugins/font-awesome';
-@import 'plugins/select2';
-
-@import 'sections/orders';
-@import 'sections/products';
-
-@import 'hacks/mozilla';
-@import 'hacks/opera';
-@import 'hacks/ie';
-
-@import 'components/*';
-@import 'pages/*';
-@import '*';
-
-@import "../shared/question-mark-icon";
-@import "question-mark-tooltip";

app/assets/stylesheets/admin/shared/icons.scss

@@ -1,26 +0,0 @@
-@import 'admin/plugins/font-awesome';
-
-// Some fixes for fontwesome stylesheets
-[class^="icon-"], [class*=" icon-"] {
-  &:before {
-    padding-right: 5px;
-  }
-
-  &.button, &.icon_link {
-    width: auto;
-
-    &:before {
-      padding-top: 3px;
-    }
-  }
-}
-
-.icon-email:before    { @extend .icon-envelope:before }
-.icon-resend_authorization_email:before    { @extend .icon-envelope:before }
-.icon-resume:before   { @extend .icon-refresh:before  }
-
-.icon-cancel:before,
-.icon-void:before     { @extend .icon-remove:before   }
-
-.icon-capture:before  { @extend .icon-ok:before       }
-.icon-credit:before   { @extend .icon-ok:before       }

app/assets/stylesheets/darkswarm/all.scss

@@ -1,26 +0,0 @@
-/*
-   * This is a manifest file that'll automatically include all the stylesheets available in this directory
-   * and any sub-directories. You're free to add application-wide styles to this file and they'll appear at
-   * the top of the compiled file, but it's generally better to create a new file per style scope.
-
-   *= require autocomplete
-   *= require leaflet
-
-   *= require_self
-*/
-@import 'variables';
-@import 'foundation';
-@import 'foundation-icons';
-
-@import 'base/*';
-@import 'layout/*';
-@import '*';
-@import 'pages/*';
-@import 'web/all';
-
-ofn-modal {
-  display: block;
-}
-
-@import "../shared/question-mark-icon";
-@import '../admin/shared/scroll_bar';

app/assets/stylesheets/darkswarm/base/colors.scss

@@ -1,13 +0,0 @@
-@import 'darkswarm/branding';
-
-$modal-background-color: #efefef;
-$modal-content-background-color: #fff;
-$modal-alert-link-color: #fff;
-$modal-alert-link-hover-color: rgba(255, 255, 255, .7);
-
-$cookies-banner-background-color: $dark-grey;
-$cookies-banner-button-background-color: $clr-turquoise;
-$cookies-banner-text-color: $white;
-$cookies-policy-modal-background-color: $disabled-light;
-$cookies-policy-modal-border-bottom-color: $disabled-light;
-$cookies-policy-modal-table-tr-even-background-color: $disabled-very-light;

app/assets/stylesheets/mail/all.css

@@ -1,11 +0,0 @@
-/* This file MUST be plain css, as roadie does not seem to be able to handle other file types */
-
-/*
- * This is a manifest file that'll automatically include all the stylesheets available in this directory
- * and any sub-directories. You're free to add application-wide styles to this file and they'll appear at
- * the top of the compiled file, but it's generally better to create a new file per style scope.
- *
-
- *= require_self
- *= require_tree .
-*/

app/models/spree/app_configuration.rb

@@ -27,7 +27,7 @@ module Spree
   class AppConfiguration < Preferences::Configuration
     # Should state/state_name be required
     preference :address_requires_state, :boolean, default: true
-    preference :admin_interface_logo, :string, default: 'ofn-logo.png'
+    preference :admin_interface_logo, :string, default: '/default_images/ofn-logo.png'
     preference :admin_products_per_page, :integer, default: 10
     # Should only be true if you don't need to track inventory
     preference :allow_backorder_shipping, :boolean, default: false
@@ -48,7 +48,7 @@ module Spree
     preference :default_seo_title, :string, default: ''
     preference :hide_cents, :boolean, default: false
     preference :layout, :string, default: 'darkswarm'
-    preference :logo, :string, default: 'ofn-logo.png'
+    preference :logo, :string, default: '/default_images/ofn-logo.png'
 
     # Maximum nesting level in taxons menu
     preference :max_level_in_taxons_menu, :integer, default: 1

app/views/admin/producer_properties/_form.html.haml

@@ -1,6 +1,6 @@
 %fieldset.no-border-top
   .add_producer_properties{"data-hook" => "add_producer_properties"}
-  = image_tag 'spinner.gif', :plugin => 'spree', :style => 'display:none;', :id => 'busy_indicator'
+  = image_pack_tag 'spinner.gif', :plugin => 'spree', :style => 'display:none;', :id => 'busy_indicator'
   %table.index.sortable{"data-hook" => "", "data-sortable-link" => main_app.update_positions_admin_enterprise_producer_properties_url(@enterprise)}
     %thead
       %tr{"data-hook" => "producer_properties_header"}

app/views/components/_spinner.html.haml

@@ -1 +1 @@
-%img.spinner{ src: image_path("spinning-circles.svg"), style: "max-width: 100%" }
+%img.spinner{ src: image_pack_path("spinning-circles.svg"), style: "max-width: 100%" }

app/views/home/_tagline.html.haml

@@ -2,7 +2,7 @@
   .row
     .small-12.text-center.columns
       %h1
-        %img{src: image_path("logo-white-notext.png"), title: Spree::Config.site_name}
+        %img{src: image_pack_path("logo-white-notext.png"), title: Spree::Config.site_name}
         %br/
         %a.button.transparent{href: "/shops"}
           = t :home_shop

app/views/layouts/darkswarm.html.haml

@@ -13,9 +13,9 @@
     - else
       = favicon_link_tag "/favicon-staging.ico"
     %link{href: "https://fonts.googleapis.com/css?family=Roboto:400,300italic,400italic,300,700,700italic|Oswald:300,400,700", rel: "stylesheet", type: "text/css"}
-    %link{href: font_path("OFN-v2.woff"), rel: "preload", as: "font", crossorigin: "anonymous"}
+    %link{href: asset_pack_path("media/fonts/OFN-v2.woff"), rel: "preload", as: "font", crossorigin: "anonymous"}
 
-    = stylesheet_link_tag "darkswarm/all", "data-turbo-track": "reload"
+    = stylesheet_pack_tag "darkswarm", "data-turbo-track": "reload"
     = javascript_pack_tag "application", "data-turbo-track": "reload"
 
     = render "layouts/shopfront_script" if @shopfront_layout

app/views/layouts/mailer.html.haml

@@ -5,7 +5,7 @@
     %meta{:content => "text/html; charset=UTF-8", "http-equiv" => "Content-Type"}/
     %title
       = Spree::Config[:site_name]
-    = stylesheet_link_tag 'mail/all'
+    = stylesheet_pack_tag 'mail'
   %body{:bgcolor => "#FFFFFF" }
     %table.head-wrap{:bgcolor => "#f2f2f2"}
       %tr

app/views/layouts/registration.html.haml

@@ -10,13 +10,13 @@
       = favicon_link_tag "/favicon-staging.ico"
     %link{href: "https://fonts.googleapis.com/css?family=Roboto:400,300italic,400italic,300,700,700italic|Oswald:300,400,700", rel: "stylesheet", type: "text/css"}
 
-    = stylesheet_link_tag "darkswarm/all"
+    = stylesheet_pack_tag "darkswarm"
     = javascript_include_tag "darkswarm/all"
     = javascript_pack_tag "application"
 
     = csrf_meta_tags
 
-  %body.off-canvas{ style: "background-image: url(#{image_path('tile-wide.png')})", "data-turbo": "false" }
+  %body.off-canvas{ style: "background-image: url(#{image_pack_path('tile-wide.png')})", "data-turbo": "false" }
     / [if lte IE 8]
       = render partial: "shared/ie_warning"
       = javascript_include_tag "iehack"

app/views/registration/steps/_limit_reached.html.haml

@@ -6,7 +6,7 @@
         %h4= t(".message")
   .row
     .small-12.medium-3.large-2.columns.text-right.hide-for-small-only
-      %img{:src => image_path("potatoes.png") }
+      %img{:src => image_pack_path("potatoes.png") }
     .small-12.medium-9.large-10.columns
       %p
         = t(".text")

app/views/shared/_footer.html.haml

@@ -3,7 +3,7 @@
     .row
       .small-12.columns.text-center
         .logo
-          %img{src: image_path("logo-white-notext.png") }
+          %img{src: image_pack_path("logo-white-notext.png") }
     .row
       .small-12.medium-8.medium-offset-2.columns.text-center
         .alert-box

app/views/shared/_ie_warning.html.haml

@@ -10,17 +10,17 @@
   .row
     .small-4.columns.browserbtn
       %a.browserlogo{href: "https://www.google.com/intl/en_au/chrome/browser/", target: "_blank"} 
-        %img{src: image_path("browser-logos/chrome.png") }
+        %img{src: image_pack_path("browser-logos/chrome.png") }
       %a{href: "https://www.google.com/intl/en_au/chrome/browser/", target: "_blank"}
         = t :ie_warning_chrome
     .small-4.columns.browserbtn
       %a.browserlogo{href: "http://www.mozilla.org/en-US/firefox/new/", target: "_blank"} 
-        %img{src: image_path("browser-logos/firefox.png") }
+        %img{src: image_pack_path("browser-logos/firefox.png") }
       %a{href: "http://www.mozilla.org/en-US/firefox/new/", target: "_blank"}
         = t :ie_warning_firefox
     .small-4.columns.browserbtn  
       %a.browserlogo{href: "http://windows.microsoft.com/en-AU/internet-explorer/download-ie", target: "_blank"} 
-        %img{src: image_path("browser-logos/internet-explorer.png") }
+        %img{src: image_pack_path("browser-logos/internet-explorer.png") }
       %a{href: "http://windows.microsoft.com/en-AU/internet-explorer/download-ie", target: "_blank"}
         = t :ie_warning_ie
   .row.ie-msg

app/views/shared/menu/_cart.html.haml

@@ -3,6 +3,6 @@
     %span
       = t '.cart'
     %span.count
-      %img{ src: image_path("menu/icn-cart.svg") }
+      %img{ src: image_pack_path("menu/icn-cart.svg") }
       %span
         {{ Cart.total_item_count() }}

app/views/shared/menu/_mobile_menu.html.haml

@@ -1,7 +1,7 @@
 %nav.tab-bar.show-for-medium-down
   %section.left
     %a.left-off-canvas-toggle.menu-icon
-      = image_tag "menu/btn-menu-mobile.png"
+      = image_pack_tag "menu/btn-menu-mobile.png"
 
   %section.left
     .ofn-logo
@@ -14,7 +14,7 @@
         %span
           = t '.cart'
         %span.count
-          = image_tag "menu/icn-cart.svg"
+          = image_pack_tag "menu/icn-cart.svg"
           %span
             {{ Cart.total_item_count() }}
 

app/views/shared/menu/_signed_in.html.haml

@@ -7,7 +7,7 @@
 %li.user-menu.has-dropdown.not-click
 
   %a{href: "#", class: "top-bar--menu-item-with-icon"}
-    %img{ src: image_path("menu/icn-profile.svg") }
+    %img{ src: image_pack_path("menu/icn-profile.svg") }
     %span
       = t '.profile'
 

app/views/shared/menu/_signed_out.html.haml

@@ -1,5 +1,5 @@
 %li#login-link
   %a{"auth" => "login"}
-    %img{ src: image_path("menu/icn-login.svg") }
+    %img{ src: image_pack_path("menu/icn-login.svg") }
     %span
       = t 'label_login'

app/views/shop/products/_searchbar.haml

@@ -8,7 +8,7 @@
               "ng-debounce" => "200",
               "disable-enter-with-blur" => true}
         %a.clear{type: 'button', ng: {show: 'query', click: 'clearQuery()'}, 'focus-search' => true}
-          = image_tag "icn-close.png"
+          = image_pack_tag "icn-close.png"
 
       .hide-for-large-up
         %button{type: 'button', ng: {click: 'toggleFilterSidebar()'}}

app/views/spree/admin/orders/invoice.html.haml

@@ -1,4 +1,4 @@
-= wicked_pdf_stylesheet_link_tag "mail/all"
+= wicked_pdf_stylesheet_pack_tag "mail"
 
 %table{:width => "100%"}
   %tbody

app/views/spree/admin/orders/invoice2.html.haml

@@ -1,5 +1,4 @@
-= wicked_pdf_stylesheet_link_tag "mail/all"
-
+= wicked_pdf_stylesheet_pack_tag "mail"
 
 %table{:width => "100%"}
   %tbody

app/views/spree/admin/payments/source_forms/_gateway.html.haml

@@ -41,5 +41,5 @@
         %a.info.cvvLink{href: "/content/cvv", target: "_blank"}
           (#{t(:what_is_this)})
     .nine.columns
-      = image_tag 'credit_cards/credit_card.gif', class: 'credit-card-image'
+      = image_pack_tag 'credit_cards/credit_card.gif', class: 'credit-card-image'
     .clear

app/views/spree/admin/product_properties/index.html.haml

@@ -12,7 +12,7 @@
 = form_for @product, url: admin_product_url(@product, @url_filters), method: :put do |f|
   %fieldset.no-border-top
     .add_product_properties
-    = image_tag 'select2-spinner.gif', plugin: 'spree', style: 'display:none;', id: 'busy_indicator'
+    = image_pack_tag 'select2-spinner.gif', plugin: 'spree', style: 'display:none;', id: 'busy_indicator'
 
     %table.index.sortable{"data-sortable-link" => update_positions_admin_product_product_properties_url}
       %thead

app/views/spree/admin/shared/_head.html.haml

@@ -11,7 +11,7 @@
 
 %link{:href => "//fonts.googleapis.com/css?family=Open+Sans:400italic,600italic,400,600&subset=latin,cyrillic,greek,vietnamese", :rel => "stylesheet", :type => "text/css"}
 
-= stylesheet_link_tag 'admin/all'
+= stylesheet_pack_tag 'admin'
 = render "layouts/bugsnag_js"
 = javascript_include_tag 'admin/all'
 

app/views/spree/admin/states/index.html.haml

@@ -11,6 +11,6 @@
   - databaseurl = "#{admin_states_path(format: :js)}?country_id="
   %select#country.observe_field.select2.fullwidth{"data-base-url" => databaseurl, "data-update" => "#state-list"}
     = options_from_collection_for_select(@countries, :id, :name, @country.id)
-= image_tag 'select2-spinner.gif', plugin: 'spree', style: 'display:none;', id: 'busy_indicator'
+= image_pack_tag 'select2-spinner.gif', plugin: 'spree', style: 'display:none;', id: 'busy_indicator'
 #state-list
   = render partial: 'state_list'

app/views/spree/admin/taxonomies/edit.haml

@@ -21,7 +21,7 @@
         Spree.routes.admin_taxonomy_taxons_path = "#{spree.admin_taxonomy_taxons_path(@taxonomy)}";
       #taxonomy_tree.tree
     #progress{style: "display:none;"}
-      = image_tag 'select2-spinner.gif', title: 'Spinner', style: "vertical-align:bottom;"
+      = image_pack_tag 'select2-spinner.gif', title: 'Spinner', style: "vertical-align:bottom;"
       = t("spree.updating")
       \..
     .info= t("spree.taxonomy_tree_instruction")

app/views/spree/layouts/bare_admin.html.haml

@@ -12,7 +12,8 @@
 
       %header#header{"data-hook" => ""}
         .container
-          %figure.columns.five{"data-hook" => "logo-wrapper"}= link_to image_tag(Spree::Config[:admin_interface_logo], :id => 'logo'), spree.admin_dashboard_path
+          %figure.columns.five{"data-hook" => "logo-wrapper"}
+            = link_to image_tag(Spree::Config[:admin_interface_logo], id: 'logo'), spree.admin_dashboard_path
           %nav.columns.eleven{"data-hook" => "admin_login_navigation_bar"}
             = render partial: "spree/layouts/admin/login_nav"
 

app/webpacker/css/admin/advanced_settings.scss

@@ -1,5 +1,3 @@
-@import "variables";
-
 #advanced_settings {
   background-color: $spree-light-blue;
   border: 1px solid $pale-blue;

app/webpacker/css/admin/alert.scss

@@ -1,5 +1,3 @@
-@import "variables";
-
 .alert {
   border: 3px solid $medium-grey;
   border-radius: 6px;

app/webpacker/css/admin/all.scss

@@ -0,0 +1,113 @@
+@import 'vendor/assets/stylesheets/normalize';
+@import 'vendor/assets/stylesheets/responsive-tables';
+@import 'vendor/assets/stylesheets/jquery.powertip';
+@import '~jquery-ui/themes/base/jquery.ui.dialog';
+@import '../shared/textAngular';
+@import '../shared/ng-tags-input.min';
+@import 'vendor/assets/stylesheets/select2.css.scss';
+@import '~flatpickr/dist/flatpickr';
+@import '~flatpickr/dist/themes/material_blue';
+@import '~shortcut-buttons-flatpickr/dist/themes/light';
+
+@import 'globals/functions';
+@import 'globals/variables';
+@import 'variables';
+@import 'globals/mixins';
+
+@import 'plugins/font-awesome';
+
+@import '../shared/variables/layout';
+@import '../shared/variables/variables';
+@import 'shared/typography';
+@import 'shared/tables';
+@import 'shared/icons';
+@import 'shared/forms';
+@import 'shared/layout';
+@import 'shared/scroll_bar';
+
+@import 'plugins/flatpickr-customization';
+@import 'plugins/powertip';
+@import 'plugins/jstree';
+@import 'plugins/select2';
+
+@import 'sections/orders';
+@import 'sections/products';
+
+@import 'hacks/mozilla';
+@import 'hacks/opera';
+@import 'hacks/ie';
+
+@import 'components/actions';
+@import 'components/alert-box';
+@import 'components/alert_row';
+@import 'components/buttons';
+@import 'components/date-picker';
+@import 'components/dialogs';
+@import 'components/input';
+@import 'components/jquery_dialog';
+@import 'components/messages';
+@import 'components/navigation';
+@import 'components/ng-cloak';
+@import 'components/page_actions';
+@import 'components/pagination';
+@import 'components/per_page_controls';
+@import 'components/product_autocomplete';
+@import 'components/progress';
+@import 'components/save_bar';
+@import 'components/sidebar';
+@import 'components/simple_modal';
+@import 'components/states';
+@import 'components/stripe_connect_button';
+@import 'components/subscriptions_states';
+@import 'components/table-filter';
+@import 'components/table_loading';
+@import 'components/timepicker';
+@import 'components/todo';
+@import 'components/tooltip';
+@import 'components/wizard_progress';
+
+@import 'pages/enterprise_form';
+@import 'pages/subscription_form';
+@import 'pages/subscription_line_items';
+@import 'pages/subscription_review';
+
+@import 'advanced_settings';
+@import 'alert';
+@import 'animations';
+@import 'change_type_form';
+@import 'customers';
+@import 'dashboard_item';
+@import 'dashboard-single-ent';
+@import 'dialog';
+@import 'disabled';
+@import 'dropdown';
+@import 'enterprise_index_panels';
+@import 'enterprises';
+@import 'filters_and_controls';
+@import 'grid';
+@import 'icons';
+@import 'index_panel_buttons';
+@import 'index_panels';
+@import 'modals';
+@import 'offsets';
+@import 'openfoodnetwork';
+@import 'order_cycles';
+@import 'orders';
+@import 'product_import';
+@import 'products';
+@import 'question-mark-tooltip';
+@import 'relationships';
+@import 'reports';
+@import 'select2';
+@import 'sidebar-item';
+@import 'side_menu';
+@import 'tables';
+@import 'tag_rules';
+@import 'terms_of_service_files';
+@import 'validation';
+@import 'variables';
+@import 'variant_overrides';
+@import 'welcome';
+
+@import "../shared/question-mark-icon";
+@import "question-mark-tooltip";

app/webpacker/css/admin/change_type_form.scss

@@ -1,6 +1,5 @@
 @import "../darkswarm/branding";
 @import "../darkswarm/mixins";
-@import "variables";
 
 #change_type {
   section {

app/webpacker/css/admin/components/actions.scss

@@ -1,5 +1,3 @@
-@import 'admin/globals/variables';
-
 table tbody tr {
   &.highlight {
 

app/webpacker/css/admin/components/alert-box.scss

@@ -1,6 +1,3 @@
-@import "../../darkswarm/mixins";
-@import "../variables";
-
 .alert-box {
   position: relative;
   display: block;

app/webpacker/css/admin/components/alert_row.scss

@@ -1,5 +1,3 @@
-@import "../variables";
-
 .alert-row{
   margin-bottom: 10px;
   font-weight: bold;

app/webpacker/css/admin/components/date-picker.scss

@@ -1,7 +1,3 @@
-@import 'admin/globals/variables';
-@import 'admin/globals/mixins';
-@import 'admin/plugins/font-awesome';
-
 // scss-lint:disable QualifyingElement
 
 .date-range-filter {

app/webpacker/css/admin/components/dialogs.scss

@@ -1,5 +1,3 @@
-@import "../variables";
-
 #info-dialog, #confirm-dialog {
   .message {
     .text, .icon {

app/webpacker/css/admin/components/jquery_dialog.scss

@@ -1,5 +1,3 @@
-@import "../variables";
-
 /**
 Main colors:
 dark: #545454

app/webpacker/css/admin/components/messages.scss

@@ -1,5 +1,3 @@
-@import 'admin/globals/variables';
-
 .errorExplanation {
   padding: 5px;
   border: 1px solid very-light($color-error, 12);

app/webpacker/css/admin/components/navigation.scss

@@ -1,5 +1,3 @@
-@import 'admin/globals/variables';
-
 // Navigation
 //---------------------------------------------------
 .inline-menu {
@@ -129,7 +127,7 @@ nav.menu {
     }
 
     &.selected a {
-      @extend a:hover;
+      @extend a, :hover;
     }
   }
 }

app/webpacker/css/admin/components/pagination.scss

@@ -1,6 +1,3 @@
-@import 'admin/globals/variables';
-@import "admin/variables";
-
 .pagination {
   text-align: center;
   margin: 2em 0 1em;

app/webpacker/css/admin/components/progress.scss

@@ -1,6 +1,3 @@
-@import 'admin/globals/variables';
-@import 'admin/globals/mixins';
-
 #progress {
   @include border-radius(10px);
   position: fixed;

app/webpacker/css/admin/components/save_bar.scss

@@ -1,5 +1,3 @@
-@import "../variables";
-
 #save-bar {
   position: fixed;
   width: 100%;

app/webpacker/css/admin/components/sidebar.scss

@@ -1,5 +1,3 @@
-@import 'admin/globals/variables';
-
 // Sidebar
 //---------------------------------------------------
 #sidebar {

app/webpacker/css/admin/components/simple_modal.scss

@@ -1,5 +1,3 @@
-@import '../variables';
-
 .reveal-modal.simple-modal {
   width: 300px;
 

app/webpacker/css/admin/components/states.scss

@@ -1,5 +1,3 @@
-@import 'admin/globals/variables';
-
 .state {
   text-transform: uppercase;
   font-size: 80%;

app/webpacker/css/admin/components/subscriptions_states.scss

@@ -1,5 +1,3 @@
-@import "../variables";
-
 #subscriptions .state {
   border-radius: 3px;
   text-transform: uppercase;

app/webpacker/css/admin/components/table_loading.scss

@@ -1,5 +1,3 @@
-@import '../variables';
-
 .row-loading {
   opacity: .5;
 }

app/webpacker/css/admin/components/wizard_progress.scss

@@ -1,5 +1,3 @@
-@import "../variables";
-
 $color_unselected: #d9d9d9;
 $color_selected: $spree-blue;
 

app/webpacker/css/admin/customers.scss

@@ -1,5 +1,3 @@
-@import "variables";
-
 .tag-with-rules {
   color: black;
 }

app/webpacker/css/admin/dashboard_item.scss

@@ -1,5 +1,3 @@
-@import "variables";
-
 div.dashboard_item {
   margin-bottom: 30px;
 

app/webpacker/css/admin/dropdown.scss

@@ -1,5 +1,3 @@
-@import "variables";
-
 #content-header .ofn-drop-down {
   border: none;
   background-color: $spree-blue;

app/webpacker/css/admin/enterprise_index_panels.scss

@@ -1,5 +1,3 @@
-@import "variables";
-
 .enterprise_package_panel, .enterprise_producer_panel {
   .info {
     p {

app/webpacker/css/admin/enterprises.scss

@@ -1,5 +1,3 @@
-@import "variables";
-
 form[name="enterprise_form"] {
   div.row.warning {
     color: $warning-orange;

app/webpacker/css/admin/globals/variables.scss

@@ -1,5 +1,3 @@
-@import 'shared/variables/layout';
-
 // -------------------------------------------------------------
 //   Variables used in all other files
 //--------------------------------------------------------------

app/webpacker/css/admin/hacks/ie.scss

@@ -1,5 +1,3 @@
-@import 'admin/globals/variables';
-
 // IE general hacks
 html.ie {
 

app/webpacker/css/admin/index_panel_buttons.scss

@@ -1,5 +1,3 @@
-@import "variables";
-
 tbody.panel-ctrl {
   tr.panel-row {
     > td {

app/webpacker/css/admin/index_panels.scss

@@ -1,5 +1,3 @@
-@import "variables";
-
 tbody.panel-ctrl {
   td.panel-toggle{
     -webkit-touch-callout: none;

app/webpacker/css/admin/openfoodnetwork.scss

@@ -1,5 +1,3 @@
-@import "variables";
-
 .text-center {
   text-align: center;
 }

app/webpacker/css/admin/order_cycles.scss

@@ -1,5 +1,3 @@
-@import "variables";
-
 form.order_cycle {
   margin-bottom: 5em;
 }

app/webpacker/css/admin/orders.scss

@@ -1,5 +1,3 @@
-@import "variables";
-
 input, div {
 	&.update-pending {
 	  border: solid 1px orange;

app/webpacker/css/admin/pages/enterprise_form.scss

@@ -1,5 +1,3 @@
-@import "../variables";
-
 span.unavailable,
 span.available {
   font-weight: bold;

app/webpacker/css/admin/pages/subscription_form.scss

@@ -1,5 +1,3 @@
-@import '../variables';
-
 .admin-subscription-form-subscription-line-items {
   .not-in-open-and-upcoming-order-cycles-warning {
     color: $warning-red;

app/webpacker/css/admin/pages/subscription_review.scss

@@ -1,5 +1,3 @@
-@import '../variables';
-
 .admin-subscription-review-subscription-line-items {
   .not-in-open-and-upcoming-order-cycles-warning {
     color: $warning-red;

app/webpacker/css/admin/plugins/font-awesome.scss

@@ -27,8 +27,11 @@
  * -------------------------- */
 @font-face {
   font-family: 'FontAwesome';
-  src: font-url('fontawesome-webfont.eot?v=3.2.1');
-  src: font-url('fontawesome-webfont.eot?#iefix&v=3.2.1') format('embedded-opentype'), font-url('fontawesome-webfont.woff?v=3.2.1') format('woff'), font-url('fontawesome-webfont.ttf?v=3.2.1') format('truetype'), font-url('fontawesome-webfont.svg#fontawesomeregular?v=3.2.1') format('svg');
+  src: url('../fonts/fontawesome-webfont.eot?v=3.2.1');
+  src: url('../fonts/fontawesome-webfont.eot?#iefix&v=3.2.1') format('embedded-opentype'),
+      url('../fonts/fontawesome-webfont.woff?v=3.2.1') format('woff'),
+      url('../fonts/fontawesome-webfont.ttf?v=3.2.1') format('truetype'),
+      url('../fonts/fontawesome-webfont.svg#fontawesomeregular?v=3.2.1') format('svg');
   font-weight: normal;
   font-style: normal;
 }

app/webpacker/css/admin/plugins/jstree.scss

@@ -1,14 +1,10 @@
-@import 'admin/globals/variables';
-@import 'admin/globals/mixins';
-@import 'admin/plugins/font-awesome';
-
 #taxonomy_tree {
   > ul, .jstree-icon {
     background-image: none;
   }
   
   .jstree-icon {
-    @extend [class^="icon-"]:before;
+    @extend [class^="icon-"], :before;
   }
 
   .jstree-open > .jstree-icon {    
@@ -46,7 +42,7 @@
 #jstree-marker {
   background-image: none !important;
   background-color: transparent !important;
-  @extend [class^="icon-"]:before;   
+  @extend [class^="icon-"], :before;
 }
 #vakata-dragged.jstree-apple .jstree-invalid {
   @extend .icon-remove;  

app/webpacker/css/admin/plugins/powertip.scss

@@ -1,6 +1,3 @@
-@import 'admin/globals/variables';
-@import 'admin/globals/mixins';
-
 #powerTip {
   background-color: $color-3;
   padding: 5px 15px;