consul/nairobi
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge pull request #6071 from KhanhVanCong/fix-bug/6047-the-legislation-title-text-box-does-not-fix-size-of-text

Browse Source 
Adjust legislation title height to prevent a layout break
This commit is contained in:
Javi Martín
2025-09-30 13:18:29 +02:00
committed by GitHub
parent d8f03c3b6e 1d437eab03
commit bb9a849324
2 changed files with 27 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files

33
app/assets/stylesheets/legislation_process.scss
View File

@@ -173,13 +173,25 @@
.quiz-header { .quiz-header {
margin-bottom: $line-height; margin-bottom: $line-height;
@include breakpoint(medium) {
display: flex;
> * {
@include grid-column-gutter;
}
.quiz-title {
flex-basis: 75%;
}
.quiz-next {
flex-basis: 25%;
}
}
.quiz-title, .quiz-title,
.quiz-next { .quiz-next {
padding: $line-height; padding: $line-height;
@include breakpoint(medium) {
height: $line-height * 4;
}
} }
.quiz-title { .quiz-title {
@@ -200,16 +212,15 @@
} }
.quiz-next-link { .quiz-next-link {
display: block; @include anchor-color;
&:hover, &:hover,
&:active { &:active {
text-decoration: none; @include anchor-color-hover;
} }
} }
.quiz-next { .quiz-next {
@include brand-color;
background: #ccdbe5; background: #ccdbe5;
font-size: $small-font-size; font-size: $small-font-size;
font-weight: bold; font-weight: bold;
@@ -220,12 +231,6 @@
.icon-angle-right { .icon-angle-right {
vertical-align: middle; vertical-align: middle;
} }
&:hover,
&:active {
@extend %brand-background;
text-decoration: none;
}
} }
} }
@@ -247,7 +252,7 @@
display: inline-block; display: inline-block;
margin-bottom: calc($line-height / 2); margin-bottom: calc($line-height / 2);
margin-right: $line-height; margin-right: $line-height;
padding: calc($line-height / 2) $line-height * 2; padding: calc($line-height / 2) $line-height * 2;
position: relative; position: relative;
} }

22
app/views/legislation/questions/show.html.erb
View File

@@ -2,26 +2,20 @@
<section class="debate-questions"> <section class="debate-questions">
<div class="quiz-header row small-collapse"> <div class="quiz-header row small-collapse">
<div class="small-12 medium-9 column"> <div class="quiz-title">
<div class="quiz-title"> <p class="quiz-header-title"><%= t("legislation.questions.show.title") %></p>
<p class="quiz-header-title"><%= t("legislation.questions.show.title") %></p> <strong><%= link_to @process.title, @process %></strong>
<strong><%= link_to @process.title, @process %></strong>
</div>
</div> </div>
<div class="small-12 medium-3 column"> <div class="quiz-next">
<% if @question.next_question_id %> <% if @question.next_question_id %>
<%= link_to legislation_process_question_path(@process, @question.next_question_id), class: "quiz-next-link" do %> <%= link_to legislation_process_question_path(@process, @question.next_question_id), class: "quiz-next-link" do %>
<div class="quiz-next"> <%= t("legislation.questions.show.next_question") %>
<%= t("legislation.questions.show.next_question") %> <span class="icon-angle-right" aria-hidden="true"></span>
<span class="icon-angle-right" aria-hidden="true"></span>
</div>
<% end %> <% end %>
<% elsif @question.first_question_id %> <% elsif @question.first_question_id %>
<%= link_to legislation_process_question_path(@process, @question.first_question_id), class: "quiz-next-link" do %> <%= link_to legislation_process_question_path(@process, @question.first_question_id), class: "quiz-next-link" do %>
<div class="quiz-next"> <%= t("legislation.questions.show.first_question") %>
<%= t("legislation.questions.show.first_question") %> <span class="icon-angle-right" aria-hidden="true"></span>
<span class="icon-angle-right" aria-hidden="true"></span>
</div>
<% end %> <% end %>
<% end %> <% end %>
</div> </div>