better home

app/assets/javascripts/application.js

@@ -11,3 +11,11 @@
 // about supported directives.
 //
 //= require_tree .
+
+
+$(document).ready(function(){
+  var msnry = new Masonry( '#infos', {
+    columnWidth: 180,
+    itemSelector: '.card'
+  });
+});

app/assets/stylesheets/application.css

@@ -8,7 +8,35 @@ a {
   color:black;
 }
 
-a:hover{
-  background-color: black;
-  color: white;
+p:hover{
+  background-color: green;
+}
+.card:hover{
+  background-color: green;
+}
+
+.card{
+  color: black;
+  width: 200px;
+  float: left;
+  border: 2px solid green;
+  margin: 10px;
+  padding: 25px;
+  font-size: 22px;
+  text-align: center;
+  box-shadow: 8px 8px 3px #1a54027a;
+}
+.date{
+  font-size: 14px;
+  color: gray;
+  padding-top: 15px
+}
+
+
+#nav{
+  display: inline-block;
+  width: 100%;
+  text-align: center;
+  padding: 10px;
+  font-size: 19px
 }

app/models/informativo.rb

@@ -1,4 +1,4 @@
 class Informativo < ApplicationRecord
   self.table_name = "informativo"
-  paginates_per  10
+  # paginates_per  10
 end

app/views/layouts/application.haml

@@ -7,6 +7,8 @@
     = csp_meta_tag
     = stylesheet_link_tag "https://fonts.googleapis.com/css?family=Inconsolata&display=swap"
     = stylesheet_link_tag    'application', media: 'all'
+    = javascript_include_tag    'application'
+
   %body
 
     %h1= "Ambiente Já!"

app/views/page/home.haml

@@ -1,5 +1,10 @@
 %h3= "#{@informativos.count} informativos"
-- @informativos.each do |i|
-  %p= link_to "#{i.data_inc} > #{i.titulo}", "/informativo/#{i.id}"
 
+#infos
+  - @informativos.each do |i|
+    .card
+      %span.link= link_to i.titulo, CGI.unescapeHTML("/informativo/#{i.id}")
+      .date= "#{i.data_inc}"
+
+#nav
   = will_paginate @informativos

config/environments/production.rb

@@ -3,6 +3,8 @@ Rails.application.configure do
 
   # Code is not reloaded between requests.
   config.cache_classes = true
+  config.serve_static_assets = true
+
 
   # Eager load code on boot. This eager loads most of Rails and
   # your application in memory, allowing both threaded web servers

config/initializers/assets.rb

@@ -7,7 +7,7 @@ Rails.application.config.assets.version = '1.0'
 # Rails.application.config.assets.paths << Emoji.images_path
 # Add Yarn node_modules folder to the asset load path.
 Rails.application.config.assets.paths << Rails.root.join('node_modules')
-
+Rails.application.config.assets.precompile += %w(application.js application.css)
 # Precompile additional assets.
 # application.js, application.css, and all non-JS/CSS in the app/assets
 # folder are already added.