diff --git a/app/controllers/sites_controller.rb b/app/controllers/sites_controller.rb
index 63865e44..d4a3322b 100644
--- a/app/controllers/sites_controller.rb
+++ b/app/controllers/sites_controller.rb
@@ -28,6 +28,7 @@ class SitesController < ApplicationController
@site = Site.new
authorize @site
+ @designs = Design.all.order(priority: :desc).reject(&:no_theme?)
end
def create
diff --git a/app/views/sites/_designs.haml b/app/views/sites/_designs.haml
index 538b5bc9..9bd95a9c 100644
--- a/app/views/sites/_designs.haml
+++ b/app/views/sites/_designs.haml
@@ -7,78 +7,6 @@
= t('activerecord.errors.models.site.attributes.design_id.layout_incompatible.help',
layouts: site.incompatible_layouts.to_sentence)
- -# Desktop view with 3 columns and radio_buttons
- .row.designs.d-none.d-lg-flex
- - @designs = Design.all.order(priority: :desc).reject(&:no_theme?)
- .col-md-4.designlist
- %h2.pb-3= t('.selector')
- - @designs.each do |design|
- .col.d-flex.flex-column.custom-control-design
- %div
- = f.radio_button :design_id, design.id,
- checked: design.id == site.design_id,
- disabled: design.disabled,
- required: true, class: 'radio-toolbar'
- = f.label "design_id_#{design.id}", " - #{design.name}",
- class: 'h5 font-weight-bolder'
- .flex-fill.f-3
- = sanitize_markdown design.description,
- tags: %w[p a strong em]
- .col-md-6.designpreview
- %h2.text-center.pb-3= t('.preview')
- .embed-responsive.embed-responsive-1by1
- %iframe.embed-responsive-item{allowfullscreen: "", src: "/placeholder.png"}
- .col-md-2
- %h2.pb-3= t('.characteristics')
- %div
- %p.design 1. Es gratis
- %p.design 2. Sofware libre - Licencia GPL
- %p.design 3. Compatible con la web distribuida
- %br
- %a.btn.btn-primary.btn-lg.mt-4{role: "button", href: "sutty.nl"}= t('.source_code')
-
- -# Tablet and mobile views with 1 columns and accordion
- .row.d-lg-none
- - @designs = Design.all.order(priority: :desc).reject(&:no_theme?)
- .col
- -# image_path("images/logo.png")
- %h1.pb-3.text-center.font-weight-bolder= t('.selector')
- - @designs.each do |design|
- %details.styled.custom-control-design
- %summary
- %h5.font-weight-bolder.pt-2 - #{design.name}
- .pb-2 #{design.description}
- .col
- %h5.text-center.font-weight-bolder.pb-3= t('.preview')
- .embed-responsive.embed-responsive-1by1
- %iframe.embed-responsive-item{allowfullscreen: "", src: "/placeholder.png"}
- .col
- %h5.text-center.font-weight-bolder.pb-3= t('.characteristics')
- - characteris = design.characteristics.split(".")
- - characteris.each_with_index do |charact, index|
- %h5.design #{index + 1}. #{charact}
- %a.btn.btn-primary.btn-lg.btn-block.mt-4{role: "button", href: design.url}= t('.source_code')
-
-
- -# Custom and Donation buttons
- .row.pt-5
- .col-lg-10.offset-2
- .row
- .col-8
- %h3.text-primary= t('.custom.title')
- %p= t('.custom.help')
- .col-4.pt-3
- %button.btn.btn-primary= t('.custom.contact')
- .row.py-4
- .col-lg-10.offset-2
- .row
- .col-8
- %h3.text-primary= t('.donation.title')
- %p= t('.donation.help')
- .col-4.pt-3
- %button.btn.btn-primary= t('.donation.link')
-
-
-
-
-
+ = render 'designs_desktop', site: @site, designs: @designs
+ = render 'designs_mobile', site: @site, designs: @designs
+ = render 'designs_buttons', site: @site, designs: @designs
diff --git a/app/views/sites/_designs_buttons.haml b/app/views/sites/_designs_buttons.haml
new file mode 100644
index 00000000..b3952425
--- /dev/null
+++ b/app/views/sites/_designs_buttons.haml
@@ -0,0 +1,17 @@
+-# Custom and Donation buttons
+.row.pt-5
+ .col-lg-10.offset-2
+ .row
+ .col-8
+ %h3.text-primary= t('.custom.title')
+ %p= t('.custom.help')
+ .col-4.pt-3
+ %button.btn.btn-primary= t('.custom.contact')
+.row.py-4
+ .col-lg-10.offset-2
+ .row
+ .col-8
+ %h3.text-primary= t('.donation.title')
+ %p= t('.donation.help')
+ .col-4.pt-3
+ %button.btn.btn-primary= t('.donation.link')
\ No newline at end of file
diff --git a/app/views/sites/_designs_desktop.haml b/app/views/sites/_designs_desktop.haml
new file mode 100644
index 00000000..8414caa4
--- /dev/null
+++ b/app/views/sites/_designs_desktop.haml
@@ -0,0 +1,29 @@
+= form_for site, html: { class: form_class(site) } do |f|
+ -# Desktop view with 3 columns and radio_buttons
+ .row.designs.d-none.d-lg-flex
+ .col-md-4.designlist
+ %h2.pb-3= t('.selector')
+ - @designs.each do |design|
+ .col.d-flex.flex-column.custom-control-design
+ %div
+ = f.radio_button :design_id, design.id,
+ checked: design.id == site.design_id,
+ disabled: design.disabled,
+ required: true, class: 'radio-toolbar'
+ = f.label "design_id_#{design.id}", " - #{design.name}",
+ class: 'h5 font-weight-bolder'
+ .flex-fill.f-3
+ = sanitize_markdown design.description,
+ tags: %w[p a strong em]
+ .col-md-6.designpreview
+ %h2.text-center.pb-3= t('.preview')
+ .embed-responsive.embed-responsive-1by1
+ %iframe.embed-responsive-item{allowfullscreen: "", src: "/placeholder.png"}
+ .col-md-2
+ %h2.pb-3= t('.characteristics')
+ %div
+ %p.design 1. Es gratis
+ %p.design 2. Sofware libre - Licencia GPL
+ %p.design 3. Compatible con la web distribuida
+ %br
+ %a.btn.btn-primary.btn-lg.mt-4{role: "button", href: ""}= t('.source_code')
diff --git a/app/views/sites/_designs_mobile.haml b/app/views/sites/_designs_mobile.haml
new file mode 100644
index 00000000..4de1eba7
--- /dev/null
+++ b/app/views/sites/_designs_mobile.haml
@@ -0,0 +1,20 @@
+= form_for site, html: { class: form_class(site) } do |f|
+ -# Tablet and mobile views with 1 columns and accordion
+ .row.d-lg-none
+ .col
+ %h1.pb-3.text-center.font-weight-bolder= t('.selector')
+ - @designs.each do |design|
+ %details.styled.custom-control-design
+ %summary
+ %h5.font-weight-bolder.pt-2 - #{design.name}
+ .pb-2 #{design.description}
+ .col
+ %h5.text-center.font-weight-bolder.pb-3= t('.preview')
+ .embed-responsive.embed-responsive-1by1
+ %iframe.embed-responsive-item{allowfullscreen: "", src: "/placeholder.png"}
+ .col
+ %h5.text-center.font-weight-bolder.pb-3= t('.characteristics')
+ - characteris = design.characteristics.split(".")
+ - characteris.each_with_index do |charact, index|
+ %h5.design #{index + 1}. #{charact}
+ %a.btn.btn-primary.btn-lg.btn-block.mt-4{role: "button", href: design.url}= t('.source_code')
diff --git a/app/views/sites/_form.haml b/app/views/sites/_form.haml
index a22bbaf2..1941b9a1 100644
--- a/app/views/sites/_form.haml
+++ b/app/views/sites/_form.haml
@@ -46,7 +46,7 @@
.invalid-feedback= site.errors.messages[:description].join(', ')
%hr/
- = render 'designs', site: @site
+ = render 'designs', site: @site, designs: @designs
.form-group.licenses#license_id
%h2= t('.licencia.title')
diff --git a/config/locales/en.yml b/config/locales/en.yml
index 0ac1e611..365ed46d 100644
--- a/config/locales/en.yml
+++ b/config/locales/en.yml
@@ -456,11 +456,17 @@ en:
title: Store
first_time_html: 'The store is an optional service that allows you to commercialize through your Sutty web site. To configure it, we invite you to contact us :).'
help: 'You can configure your store here.'
- designs:
+ designs_desktop:
selector: 'Theme Selector'
preview: 'Theme Preview'
characteristics: 'Characteristics'
source_code: 'View source code'
+ designs_mobile:
+ selector: 'Theme Selector'
+ preview: 'Theme Preview'
+ characteristics: 'Characteristics'
+ source_code: 'View source code'
+ designs_buttons:
custom:
title: 'Want a custom design?'
help: 'Contact us with the details and we`ll send you a budget.'
diff --git a/config/locales/es.yml b/config/locales/es.yml
index bc01334b..fca664bb 100644
--- a/config/locales/es.yml
+++ b/config/locales/es.yml
@@ -464,11 +464,17 @@ es:
title: Tienda
first_time_html: 'La tienda es un servicio opcional que te permite comercializar a través de tu sitio en Sutty. Para configurarla, te invitamos a ponerte en contacto con nosotres :)'
help: 'Puedes configurar tu tienda aquí.'
- designs:
+ designs_desktop:
selector: 'Selector de Plantillas'
preview: 'Previsualización de Plantilla'
characteristics: 'Características'
source_code: 'Ver código fuente'
+ designs_mobile:
+ selector: 'Selector de Plantillas'
+ preview: 'Previsualización de Plantilla'
+ characteristics: 'Características'
+ source_code: 'Ver código fuente'
+ designs_buttons:
custom:
title: '¿Deseas un diseño personalizado?'
help: 'Contáctanos con los detalles y te enviaremos un presupuesto'