Merge pull request #10801 from spree/fix/storefront-installer

Improve Spree installer

core/lib/generators/spree/install/install_generator.rb

@@ -23,6 +23,11 @@ def self.source_paths
       paths << File.expand_path('../templates', "../../#{__FILE__}")
       paths << File.expand_path('../templates', "../#{__FILE__}")
       paths << File.expand_path('templates', __dir__)
+      if Spree::Core::Engine.frontend_available? || Rails.env.test?
+        paths << File.expand_path('../../../../../frontend/app/views/spree', __dir__)
+        paths << File.expand_path('../../../../../frontend/app/assets/images', __dir__)
+        paths << File.expand_path('../../../../../frontend/app/assets/stylesheets/spree/frontend/variables', __dir__)
+      end
       paths.flatten
     end
 
@@ -41,9 +46,19 @@ def prepare_options
     def add_files
       template 'config/initializers/spree.rb', 'config/initializers/spree.rb'
 
+      # copy essential storefront files for easy customization / theming
       if Spree::Core::Engine.frontend_available? || Rails.env.test?
+        # main navigation configuration
         template 'config/initializers/spree_storefront.rb', 'config/initializers/spree_storefront.rb'
         template 'config/spree_storefront.yml', 'config/spree_storefront.yml'
+        # static images
+        directory 'noimage', './app/assets/images/noimage'
+        directory 'homepage', './app/assets/images/homepage'
+        directory 'meganav', './app/assets/images/meganav'
+        # SCSS theming
+        template 'variables.scss', './app/assets/stylesheets/spree/frontend/variables/variables.scss'
+        # home page template
+        directory 'home', './app/views/spree/home'
       end
     end
 

frontend/app/assets/stylesheets/spree/frontend/application.scss

@@ -1,6 +1,4 @@
 @import "spree/frontend/variables/variables";
-@import "spree/frontend/variables/bootstrap-overrides";
-@import "spree/frontend/variables/helper-variables";
 @import "bootstrap";
 @import "spree/frontend/bootstrap-patches";
 

frontend/app/assets/stylesheets/spree/frontend/variables/bootstrap-overrides.scss

@@ -1,3 +1,4 @@
+// we're keeping this file for legacy installations relying on it
 $grid-gutter-width: 19px;
 $body-color: $font-color;
 $theme-colors: (

frontend/app/assets/stylesheets/spree/frontend/variables/helper-variables.scss

@@ -1,3 +1,4 @@
+// we're keeping this file for legacy installations relying on it
 $container-padding: 17px;
 $photo-width-to-height-ratio: 30001/ 37500;
 $photo-width-to-height-ratio-zoom: 28015 / 37500;

frontend/app/assets/stylesheets/spree/frontend/variables/variables.scss

@@ -1,3 +1,4 @@
+// main spree variables
 $primary-color: #0074c2;
 $secondary-color: #4c4c4c;
 $primary-background: #ffffff;
@@ -18,3 +19,56 @@ $spree-header-max-width: 1440px;
 $spree-header-mobile-height: 50px;
 $spree-header-tablet-height: 75px;
 $spree-header-desktop-height: 75px;
+
+// bootstrap overrides
+$grid-gutter-width: 19px;
+$body-color: $font-color;
+$theme-colors: (
+  // standard bootstrap colors
+  "primary": $primary-color,
+  "secondary": $secondary-color,
+  "danger": #f53737,
+  "info": #999999,
+  "warning": #ffc107,
+  "light-secondary": #999999,
+  "borders": $second-global-border,
+  "dark-borders": $global-border-style,
+  "light-background": $primary-background,
+  "dark-text": $font-color,
+  "overlay": rgba(76, 76, 76, 0.5),
+  "shadow": rgba(0, 0, 0, 0.16)
+);
+$enable-rounded: false;
+$enable-shadows: false;
+$enable-gradients: false;
+$font-family-sans-serif: $font-family;
+$font-weight-medium: 500;
+.font-weight-medium {
+  font-weight: $font-weight-medium;
+}
+$btn-border-width: 2px;
+$modal-dialog-margin: 0;
+$grid-breakpoints: (
+  xs: 0,
+  sm: 576px,
+  md: 768px,
+  lg: 992px,
+  xl: 1200px
+);
+$container-max-widths: (
+  sm: 768px,
+  md: 992px,
+  lg: 1200px
+);
+
+// helper variables
+$container-padding: 17px;
+$photo-width-to-height-ratio: 30001/ 37500;
+$photo-width-to-height-ratio-zoom: 28015 / 37500;
+$thumbnails-carousel-single-height: 100% / $photo-width-to-height-ratio;
+$thumbnails-carousel-single-height-zoom: 100% /
+  $photo-width-to-height-ratio-zoom;
+$zoom-height-breakpoint: calc(
+  650px / #{$photo-width-to-height-ratio-zoom} + 102px * 2
+);
+$spree-plp-filter-desktop-position: $spree-header-desktop-height + 77px;

frontend/lib/generators/spree/frontend/copy_storefront/copy_storefront_generator.rb

@@ -1,24 +1,18 @@
 module Spree
   module Frontend
     class CopyStorefrontGenerator < Rails::Generators::Base
-      desc 'Copies storefront from spree frontend to your application'
+      desc 'Copies storefront views and stylesheets from spree frontend to your application'
 
       def self.source_paths
         [
           File.expand_path('../../../../../app', __dir__),
-          File.expand_path('../../../../../app/assets/images', __dir__),
           File.expand_path('../../../../../app/assets/stylesheets/spree/frontend', __dir__),
-          File.expand_path('../../../../../app/assets/stylesheets/spree/frontend/variables', __dir__)
         ]
       end
 
       def copy_storefront
         directory 'views', './app/views'
-        directory 'noimage', './app/assets/images/noimage'
-        directory 'homepage', './app/assets/images/homepage'
-        directory 'meganav', './app/assets/images/meganav'
         template 'application.scss', './app/assets/stylesheets/spree/frontend/application.scss'
-        template 'variables.scss', './app/assets/stylesheets/spree/frontend/variables/variables.scss'
       end
     end
   end