options for cards and new card styles

2022-12-05 18:14:56 +02:00
parent 6911540d30
commit f11bf318a5
20 changed files with 125 additions and 48 deletions
@@ -45,6 +45,12 @@

    .relative.block.border.border-gray-100
      %h3.mt-4.text-lg.font-bold Options
-      To be done
+      = form_tag( card_url(card.id) , {method: :patch , class: "mx-auto mt-8 mb-0 max-w space-y-4" }) do
+        - card.option_definitions.each do |option|
+          =render "merged/sections/option_form_#{option.type}" , section: card , option: option
+        -if card.option_definitions.empty?
+          %p No options
+        -else
+          = submit_button("Update")
 %p
  = green_button( "New Card" , new_section_card_url(@section.id) )
@@ -1,5 +1,5 @@
 .grid.grid-cols-4.gap-2.m-8
-  - @cards.each do |style|
+  - @cards.each do |name ,style|
    .relative.block.border.border-gray-100
      = link_to( section_set_card_template_path( card_template: style.template )) do
        =image_tag(style.card_preview , class: "h-56 w-full object-contain lg:h-72")
@@ -8,7 +8,7 @@
      = hidden_field_tag :redirect , section_set_image_url(@section.id,image: "NEW")
      = file_field_tag 'image_file'
      .inline-block.rounded.border.border-indigo-600.bg-indigo-600.px-12.py-3.text-sm.font-medium.text-white.hover:bg-transparent.hover:text-indigo-600.focus:outline-none.focus:ring.active:text-indigo-500{:href => merged.new_image_path}
-        = submit_tag 'Submit'
+      = submit_tag 'Submit'
  [email protected] do |name , image|
    .relative.block.border.border-gray-100
      = link_to( section_set_image_path( image: name)) do
@@ -7,5 +7,5 @@
        = section.text
  - template = "merged/view/cards/" + section.card_template
  .grid{ column_option(section)}
-    - section.cards.each do |element|
-      = render( template , element: element)
+    - section.cards.each do |card|
+      = render( template , card: card)
@@ -1,7 +1,7 @@
 .group.m-4.overflow-hidden.relative.flex.h-96.items-end.bg-black
-  = image_for( element , "absolute inset-0 h-full w-full object-cover hover:scale-110 ease-in duration-700")
+  = image_for( card , "absolute inset-0 h-full w-full object-cover hover:scale-110 ease-in duration-700")
  .relative.w-full.bg-cyan-600.m-2.p-4.text-center.tracking-widest.text-white.transition-colors.group-hover:bg-cyan-700{:class => "sm:w-1/2"}
    %h3.text-lg.uppercase
-      = element.header
+      = card.header
    %p.mt-1.text-xs.font-medium
-      = element.text
+      = card.text
@@ -0,0 +1,16 @@
+%article.overflow-hidden.rounded-lg.border.border-gray-100.shadow-sm
+  %img.h-56.w-full.object-cover{:alt => "Office", :src => "https://images.unsplash.com/photo-1600880292203-757bb62b4baf?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1770&q=80"}/
+  .p-4.sm:p-6
+    %a{:href => "#"}
+      %h3.text-lg.font-medium.text-gray-900
+        Lorem ipsum dolor sit amet consectetur adipisicing elit.
+    %p.mt-2.text-sm.leading-relaxed.text-gray-500.line-clamp-3
+      Lorem ipsum dolor sit amet, consectetur adipisicing elit. Recusandae
+      dolores, possimus pariatur animi temporibus nesciunt praesentium dolore
+      sed nulla ipsum eveniet corporis quidem, mollitia itaque minus soluta,
+      voluptates neque explicabo tempora nisi culpa eius atque dignissimos.
+      Molestias explicabo corporis voluptatem?
+    %a.group.mt-4.inline-flex.items-center.gap-1.text-sm.font-medium.text-blue-600{:href => "#"}
+      Find out more
+      %span.block.transition{"aria-hidden" => "true", :class => "group-hover:translate-x-0.5"}
+        →
@@ -0,0 +1,5 @@
+%div{background_option(card)}
+  = image_for( card , "h-96 w-full object-cover")
+  %div.m-4{align_option(card)}
+    %h3.mt-4.p-4.text-xl.font-bold= card.header
+    %p.mt-2.p-4= card.text
@@ -1,2 +1,2 @@
- unless section.button_text.blank? or section.button_link.blank?
+- unless section.has_option?("button_text") and section.has_option?("button_link")
  = blue_button( section.button_text , section.button_link)