polishing stories views

app/views/members/show.html.haml

@@ -17,11 +17,19 @@
           %svg.inline-block.w-3.ml-2{:fill => "currentColor", :viewbox => "0 0 12 12"}
             %path{:d => "M9.707,5.293l-5-5A1,1,0,0,0,3.293,1.707L7.586,6,3.293,10.293a1,1,0,1,0,1.414,1.414l5-5A1,1,0,0,0,9.707,5.293Z"}
 
-.flex.justify-around
-  = link_to edit_member_path(@member) do
-    %button.bg-cyan-200.mr-3.inline-block.rounded-lg.px-4.py-3.text-md.font-medium.border.border-gray-400
-      Edit
+- if current_member == @member
+  .flex.justify-around
+    = link_to edit_member_path(@member) do
+      %button.bg-cyan-200.mr-3.inline-block.rounded-lg.px-4.py-3.text-md.font-medium.border.border-gray-400
+        Edit
 
-  = form_tag( destroy_member_session_path , {method: :delete  } ) do
-    %button.bg-cyan-200.mr-3.inline-block.rounded-lg.px-4.py-3.text-md.font-medium.border.border-gray-400{type: :submit}
-      Sign out
+    = link_to new_story_path() do
+      %button.bg-cyan-200.mr-3.inline-block.rounded-lg.px-4.py-3.text-md.font-medium.border.border-gray-400
+        New Story
+
+    = form_tag( destroy_member_session_path , {method: :delete  } ) do
+      %button.bg-cyan-200.mr-3.inline-block.rounded-lg.px-4.py-3.text-md.font-medium.border.border-gray-400{type: :submit}
+        Sign out
+
+- @member.stories.each do |story|
+  =render "stories/inline" , story: story

app/views/stories/_form.html.haml

@@ -1,22 +0,0 @@
-= form_for @story do |f|
-  - if @story.errors.any?
-    #error_explanation
-      %h2= "#{pluralize(@story.errors.count, "error")} prohibited this story from being saved:"
-      %ul
-        - @story.errors.full_messages.each do |message|
-          %li= message
-
-  .field
-    = f.label :picture
-    = f.text_field :picture
-  .field
-    = f.label :header
-    = f.text_field :header
-  .field
-    = f.label :text
-    = f.text_area :text
-  .field
-    = f.label :happened
-    = f.date_field :happened
-  .actions
-    = f.submit 'Save'

app/views/stories/_inline.haml

@@ -0,0 +1,12 @@
+%section.overflow-hidden.grid.grid-cols-1.m-5.md:m-12.lg:m-20.md:grid-cols-2
+  %div
+    = image_for( story , "h-56 w-full object-cover sm:h-full")
+  .p-8.md:p-12.lg:px-16.lg:py-24
+    .mx-auto.max-w-xl.text-center
+      %h2.text-2xl.font-bold.md:text-4xl
+        = story.header
+      %h4.text-xl.mt-10.md:text-2xl
+        = distance_of_time_in_words_to_now story.happened
+        ago
+      .mt-8{ prose_classes }
+        = markdown(story.text)

app/views/stories/edit.html.haml

@@ -1,7 +1,20 @@
-%h1 Editing story
+.grid.grid-cols-3
+  %div
+  %div
+    %h1 Editing story
+    = form_for @story do |f|
+      - if @story.errors.any?
+        #error_explanation
+          %h2= "#{pluralize(@story.errors.count, "error")} prohibited this story from being saved:"
+          %ul
+            - @story.errors.full_messages.each do |message|
+              %li= message
 
-= render 'form'
-
-= link_to 'Show', @story
-\|
-= link_to 'Back', stories_path
+      = f.input :picture , as: :file
+      = f.input :header
+      = f.input :text
+      = f.input :happened , class: "flex"
+      = f.submit 'Save'
+    = link_to 'Show', @story
+    = link_to 'Back', stories_path
+  %div

app/views/stories/index.html.haml

@@ -1,26 +1,6 @@
-%h1 Listing stories
-
-%table
-  %thead
-    %tr
-      %th Picture
-      %th Header
-      %th Text
-      %th Happened
-      %th
-      %th
-      %th
-
-  %tbody
-    - @stories.each do |story|
-      %tr
-        %td= story.picture
-        %td= story.header
-        %td= story.text
-        %td= story.happened
-        %td= link_to 'Show', story
-        %td= link_to 'Edit', edit_story_path(story)
-        %td= link_to 'Destroy', story, method: :delete, data: { confirm: 'Are you sure?' }
+= paginate @stories
+- @stories.each do |story|
+  = render "inline" , story: story
 
 %br
 

app/views/stories/new.html.haml

@@ -1,5 +1,20 @@
-%h1 New story
 
-= render 'form'
+.grid.grid-cols-3
+  %div
+  %div
+    %h1 New story
+    = form_for @story do |f|
+      - if @story.errors.any?
+        #error_explanation
+          %h2= "#{pluralize(@story.errors.count, "error")} prohibited this story from being saved:"
+          %ul
+            - @story.errors.full_messages.each do |message|
+              %li= message
 
-= link_to 'Back', stories_path
+      = f.input :picture , as: :file
+      = f.input :header
+      = f.input :text
+      = f.input :happened , class: "flex"
+      = f.submit 'Save'
+    = link_to 'Back', stories_path
+  %div

app/views/stories/show.html.haml

@@ -1,17 +1,4 @@
-%p#notice= notice
-
-%p
-  %b Picture:
-  = @story.picture
-%p
-  %b Header:
-  = @story.header
-%p
-  %b Text:
-  = @story.text
-%p
-  %b Happened:
-  = @story.happened
+= render "inline" , story: @story
 
 = link_to 'Edit', edit_story_path(@story)
 \|