From b1946a1189a2ee8cebb46455a0af824374949526 Mon Sep 17 00:00:00 2001
From: Yannis Jaquet <yannisjaquet@me.com>
Date: Sun, 3 Sep 2023 13:09:01 +0200
Subject: [PATCH] Improve headlines (#277)

* Convert headline markdown to html on cup show page
* Improve Headline layout
---
 app/controllers/headlines_controller.rb |  2 +-
 app/views/cups/_headline.html.erb       |  2 +-
 app/views/headlines/_headline.html.erb  | 31 ++++++++++---------------
 app/views/headlines/index.html.erb      |  4 ++--
 app/views/headlines/show.html.erb       |  2 +-
 app/views/layouts/_navigation.html.erb  |  2 +-
 config/locales/models/headlines.en.yml  |  4 ++++
 config/locales/models/headlines.fr.yml  |  4 ++++
 8 files changed, 26 insertions(+), 25 deletions(-)

diff --git a/app/controllers/headlines_controller.rb b/app/controllers/headlines_controller.rb
index 20e79e5a..348bab48 100644
--- a/app/controllers/headlines_controller.rb
+++ b/app/controllers/headlines_controller.rb
@@ -7,7 +7,7 @@ class HeadlinesController < ApplicationController
   respond_to :html
 
   def index
-    respond_with @headlines.order(created_at: :desc)
+    @headlines = @headlines.order(created_at: :desc)
   end
 
   def show
diff --git a/app/views/cups/_headline.html.erb b/app/views/cups/_headline.html.erb
index d1b3886a..c9d52b99 100644
--- a/app/views/cups/_headline.html.erb
+++ b/app/views/cups/_headline.html.erb
@@ -2,7 +2,7 @@
   <div class="px-4 py-5 sm:p-6 prose prose-red-900 prose-lg">
     <h3 class="text-lg leading-6 font-medium text-gray-900"><%= headline.title %></h3>
     <div class="mt-2 max-w-xl text-sm text-gray-500">
-      <%== headline.content %>
+      <%= md_to_html(headline.content) %>
     </div>
     <div class="mt-3 text-sm">
       <%= link_to cup_headlines_path(@cup), class: "font-medium text-red-600 hover:text-red-500" do %>
diff --git a/app/views/headlines/_headline.html.erb b/app/views/headlines/_headline.html.erb
index 88650b01..bd1bc07c 100644
--- a/app/views/headlines/_headline.html.erb
+++ b/app/views/headlines/_headline.html.erb
@@ -1,21 +1,14 @@
-<li>
-  <div class="py-4 px-3 sm:px-6 lg:px-8">
-    <div class="flex items-center justify-between">
-      <div>
-        <p class="text-lg font-medium text-gray-600 prose">
-          <%= link_to(cup_headline_path(@current_cup, headline)) do %>
-            <%= headline.title %>
-          <% end %>
-        </p>
-        <p class="text-sm font-medium text-gray-400 truncate">
-          <em><%= headline.created_at.to_fs :day_month_year %></em>
-        </p>
-      </div>
-    </div>
-    <div class="mt-6 sm:flex sm:justify-between">
-      <div class="sm:flex">
-        <%= md_to_html(headline.content) %>
-      </div>
+<div class="w-full bg-white shadow">
+  <div class="px-4 py-5 sm:p-6 prose prose-red-900 prose-lg">
+    <p class="mt-1 text-xs text-gray-500 mb-0 italic">
+      <%= Headline.human_attribute_name(:created_at) %>
+      <%= l(headline.created_at.to_date, format: :day_month_year) %>
+    </p>
+    <h3 class="text-lg mt-1 font-medium text-gray-900">
+      <%= headline.title %>
+    </h3>
+    <div class="mt-2 max-w-xl text-sm text-gray-500">
+      <%= md_to_html(headline.content) %>
     </div>
   </div>
-</li>
+</div>
diff --git a/app/views/headlines/index.html.erb b/app/views/headlines/index.html.erb
index ab163cd3..f1dae123 100644
--- a/app/views/headlines/index.html.erb
+++ b/app/views/headlines/index.html.erb
@@ -11,12 +11,12 @@
         </div>
       </div>
     </div>
-    <ul role="list" class="divide-y divide-gray-200">
+    <div role="list" class="divide-y divide-gray-200">
       <% if @headlines.length.positive? %>
         <%= render @headlines %>
       <% else %>
         <%= t(".no_news") %>
       <% end %>
-    </ul>
+    </div>
   </div>
 </div>
diff --git a/app/views/headlines/show.html.erb b/app/views/headlines/show.html.erb
index a533ee1e..b5620700 100644
--- a/app/views/headlines/show.html.erb
+++ b/app/views/headlines/show.html.erb
@@ -1,6 +1,6 @@
 <% @title ||= @headline.title; title @title %>
 <div class="row headlines">
-  <div class="col-xs-12 col-md-12">
+  <div class="col-xs-12">
     <h2>
       <%= @title %>
       <small>
diff --git a/app/views/layouts/_navigation.html.erb b/app/views/layouts/_navigation.html.erb
index 77492e1f..c953cf6d 100644
--- a/app/views/layouts/_navigation.html.erb
+++ b/app/views/layouts/_navigation.html.erb
@@ -74,7 +74,7 @@
           render(NavigationDropdownComponent.new(
             name: "locale",
             text: I18n.locale.to_s.upcase,
-            css_class: "hidden lg:block text-gray-300 hover:bg-gray-700 hover:text-white px-3 py-2 rounded-md text-sm font-medium",
+            css_class: "hidden sm:block text-gray-300 hover:bg-gray-700 hover:text-white px-3 py-2 rounded-md text-sm font-medium",
             links: I18n.available_locales.map { |locale| {text: locale.to_s.upcase, url: {locale: locale}} }
           ))
         %>
diff --git a/config/locales/models/headlines.en.yml b/config/locales/models/headlines.en.yml
index 1e71e85a..99704a13 100644
--- a/config/locales/models/headlines.en.yml
+++ b/config/locales/models/headlines.en.yml
@@ -1,5 +1,9 @@
 ---
 en:
+  activerecord:
+    attributes:
+      headline:
+        created_at: Published
   headlines:
     index:
       no_news: No headlines yet…
diff --git a/config/locales/models/headlines.fr.yml b/config/locales/models/headlines.fr.yml
index 3acc5606..b7fd9c6d 100644
--- a/config/locales/models/headlines.fr.yml
+++ b/config/locales/models/headlines.fr.yml
@@ -1,5 +1,9 @@
 ---
 fr:
+  activerecord:
+    attributes:
+      headline:
+        created_at: Publié
   headlines:
     index:
       no_news: Pas de nouvelles pour l'instant…