Add some basic styles to active topic banner

slovensko-digital · Sep 19, 2020 · 6e69e42 · 6e69e42
1 parent 5a51dd6
commit 6e69e42
Show file tree

Hide file tree

Showing 6 changed files with 47 additions and 14 deletions.
diff --git a/app/assets/stylesheets/application.css b/app/assets/stylesheets/application.css
@@ -124,3 +124,27 @@
 .notification-subscription-group .govuk-form-group:last-child {
     margin-bottom: 0;
 }
+
+.active-topic {
+    background-color: #e4e9f0;
+    padding: 20px 0;
+    font-size: 1rem;
+}
+
+.active-topic p {
+    margin: 10px 0;
+    font-size: 1rem;
+}
+
+.active-topic p:first-child {
+    margin-top: 0;
+}
+
+.active-topic p:last-child {
+    margin-bottom: 0;
+}
+
+.active-topic__inner {
+    display: grid;
+    grid-template-columns: 1fr 100px;
+}
diff --git a/app/controllers/application_controller.rb b/app/controllers/application_controller.rb
@@ -1,5 +1,5 @@
 class ApplicationController < ActionController::Base
-  before_action :set_default_metadata
+  before_action :set_default_metadata, :set_active_current_topic
 
   protected
 
@@ -46,4 +46,10 @@ def set_default_metadata
       )
     )
   end
+
+  def set_active_current_topic
+    active_current_topic = CurrentTopic.active
+    return if active_current_topic.blank? || cookies[:current_topic] == active_current_topic.key
+    @active_current_topic = active_current_topic
+  end
 end
diff --git a/app/models/current_topic.rb b/app/models/current_topic.rb
@@ -1,5 +1,9 @@
 class CurrentTopic < ApplicationRecord
 
+  def key
+    updated_at.to_s
+  end
+
   def self.active
     last_current_topic = self.last
 

diff --git a/app/views/components/_active_topic.html.erb b/app/views/components/_active_topic.html.erb
@@ -1,11 +1,12 @@
-<div class="sdn-phase-banner govuk-phase-banner" role="banner">
+<div class="active-topic" role="banner">
   <div class="govuk-width-container">
-    <p class="govuk-phase-banner__content"><strong class="govuk-tag govuk-phase-banner__content__tag ">
-      BETA verzia
-    </strong>
-      <span class="govuk-phase-banner__text">
-                Toto je nová služba občianskeho združenia <strong>Slovensko.Digital</strong>. <%= link_to 'Pomôžte nám ju zlepšiť.', page_path('ako-sa-zapojit') %>
-              </span>
-    </p>
+  <div class="active-topic__inner">
+    <div>
+      <%= @active_current_topic.body.html_safe %>
+    </div>
+    <div>
+      <a href="#" data-key="<%= @active_current_topic.key %>">Skryť správu</a>
+    </div>
+  </div>
   </div>
 </div>
diff --git a/app/views/layouts/application.html.erb b/app/views/layouts/application.html.erb
@@ -45,6 +45,7 @@
   <% if content_for?(:before_main_wrapper) %>
     <%= yield(:before_main_wrapper) %>
   <% else %>
+    <%= render 'components/active_topic' if @active_current_topic.present? %>
     <div class="govuk-width-container">
       <%= yield(:before_content) %>
 

diff --git a/app/views/pages/index.html.erb b/app/views/pages/index.html.erb
@@ -2,6 +2,8 @@
 
 <% content_for(:before_main_wrapper) do %>
   <%= render 'searches/search_box' %>
+  <%= render 'components/active_topic' if @active_current_topic.present? %>
+
   <main id="main-content" class="govuk-main-wrapper govuk-!-padding-top-0" role="main">
     <div class="featured-journeys govuk-!-padding-top-9 govuk-!-padding-bottom-9">
       <div class="govuk-width-container">
@@ -20,11 +22,6 @@
             </div>
           </div>
         </div>
-        <!--        <div class="govuk-grid-row">-->
-        <!--          <div id="show-more-container" class="govuk-grid-column-full govuk-!-padding-top-6">-->
-        <%#= link_to 'Zobraziť viac', '#', class: 'govuk-button', role: 'button', draggable: false  %>
-        <!--          </div>-->
-        <!--        </div>-->
       </div>
     </div>