fix: corregido vista desktop con toggler #13587

app/assets/stylesheets/application.scss

@@ -582,4 +582,52 @@ $bezier: cubic-bezier(0.75, 0, 0.25, 1);
   }
 }
 
-// force ci
+@import "new_editor";
+
+.new-editor {
+  .editor {
+    table {
+      @extend .table;
+      @extend .table-responsive;
+    }
+  }
+}
+
+.content {
+  p { min-height: $font-size-base * $line-height-base; }
+  h1 { min-height: $h1-font-size * $headings-line-height; }
+  h2 { min-height: $h2-font-size * $headings-line-height; }
+  h3 { min-height: $h3-font-size * $headings-line-height; }
+  h4 { min-height: $h4-font-size * $headings-line-height; }
+  h5 { min-height: $h5-font-size * $headings-line-height; }
+  h6 { min-height: $h6-font-size * $headings-line-height; }
+
+  iframe { border: 0; }
+
+  audio { width: 100%; }
+
+  img,
+  video,
+  iframe {
+    @extend .img-fluid;
+    height: auto;
+  }
+
+  & > * {
+    margin-bottom: 1rem;
+
+    &:last-child {
+      margin-bottom: 0;
+    }
+  }
+}
+
+.toggler {
+  & + .toggled {
+    display: none;
+  }
+
+  &:checked + .toggled {
+    display: flex;
+  }
+}

app/views/sites/_designs_desktop.haml

@@ -6,25 +6,28 @@
       - @designs.each do |design|
         .col.d-flex.flex-column.pl-2.mb-n1.border-magenta.border-solid
           %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.border-0.border-lg-right.border-dashed.border-cyan
+    .col
-      .border-lg-left.border-cyan
+      - designs.each do |design|
-        %h2.text-center.pb-3= t('.preview')
+        = f.radio_button :design_id, design.id,
-        .embed-responsive.embed-responsive-1by1
+          checked: design.id == (site.design_id || @designs.first.id),
-          %iframe.embed-responsive-item{allowfullscreen: "", src: "/placeholder.png"}
+          disabled: design.disabled,
-    .col-md-2
+          required: true, class: 'radio-toolbar toggler'
-      %h2.pb-3= t('.characteristics')
+        .row.toggled
-      %div
+          .col-md-8.border-0.border-lg-right.border-dashed.border-cyan
-      %p 1. Es gratis
+            .border-lg-left.border-cyan
-      %p 2. Sofware libre - Licencia GPL
+              %h2.text-center.pb-3= t('.preview')
-      %p 3. Compatible con la web distribuida
+              .embed-responsive.embed-responsive-1by1
-      %br 
+                %iframe.embed-responsive-item{allowfullscreen: "", src: "/placeholder.png"}
-      %a.btn.btn-primary.btn-lg.mt-4{role: "button", href: ""}= t('.source_code') 
+          .col-md-3
+            %h2.pb-3= t('.characteristics')
+            %div
+            - characteristics = design.characteristics
+            - characteristics.each_line.with_index do |characteristic, index|
+              %h5 #{index+1}. #{characteristic} 
+            %br 
+            %a.btn.btn-primary.btn-lg.mt-4{role: "button", href: design.url}= t('.source_code')