Adjust styles

Since we're now allowing <h2> and <h3> tags in the description, we
remove the broken <h3> tag from quiz-question class. Since its content
is also in the <title> element, and in order to be consistent with other
show actions in the public area, we change this tag to <h1>.

We add <h2> tag in the "Share" heading and we replace the broken <h4>
tag above adding new styles.

app/assets/stylesheets/legislation_process.scss

@@ -191,13 +191,15 @@
         margin-bottom: 0;
         text-transform: uppercase;
       }
-    }
 
-    h4 a {
-      @include brand-color;
+      a {
+        @include brand-color;
+        font-size: rem-calc(18);
+        font-weight: 700;
 
-      &:hover {
-        text-decoration: none;
+        &:hover {
+          text-decoration: none;
+        }
       }
     }
 

app/views/legislation/questions/show.html.erb

@@ -5,7 +5,7 @@
     <div class="small-12 medium-9 column">
       <div class="quiz-title">
         <p class="quiz-header-title"><%= t("legislation.questions.show.title") %></p>
-        <h4><%= link_to @process.title, @process %></h4>
+        <%= link_to @process.title, @process %>
       </div>
     </div>
     <div class="small-12 medium-3 column">
@@ -28,7 +28,7 @@
   </div>
   <div class="row">
     <div class="small-12 medium-9 column">
-      <h3 class="quiz-question"><%= @question.title %></h3>
+      <h1 class="quiz-question"><%= @question.title %></h1>
       <%= AdminWYSIWYGSanitizer.new.sanitize(@question.description) %>
       <div class="debate-questions" id="legislation-answer-form">
         <%= render "answer_form", process: @process, question: @question, answer: @answer %>
@@ -37,7 +37,7 @@
 
     <aside class="small-12 medium-3 column">
       <div id="social-share" class="sidebar-divider"></div>
-      <h3><%= t("legislation.questions.show.share") %></h3>
+      <h2><%= t("legislation.questions.show.share") %></h2>
       <%= render "/shared/social_share", title: @question.title, url: legislation_process_question_url(@question.process, @question) %>
     </aside>
   </div>