baarkerlounger
/
submit-social-housing-lettings-and-sales-data
mirror of https://github.com/communitiesuk/submit-social-housing-lettings-and-sales-data.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
Browse Source

Revert "Reuse govuk grid" 

This reverts commit 8c71f5d9ed.
pull/2115/head
natdeanlewissoftwire 12 months ago
parent
8c71f5d9ed
commit
c738088619
3 changed files with 80 additions and 32 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 55
      app/frontend/styles/_data_box.scss
  2. 4
      app/views/home/_data_box.html.erb
  3. 53
      app/views/home/index.html.erb

55
app/frontend/styles/_data_box.scss
Unescape View File

@ -1,5 +1,53 @@
.app-data-box-group {
@include govuk-font($size: 19);
font-weight: bold;
white-space: nowrap;
}
@media (min-width: 54.0625em) {
.app-data-box-group-one-third {
display: flex;
justify-content: space-between;
column-gap: govuk-spacing(4);
width: 100%;
min-width: 733.33px;
}
}
@media (min-width: 54.0625em) {
.app-data-box-one-third {
width: 33.3333333%;
float: left;
}
}
@media (min-width: 54.0625em) {
.app-data-box__underline {
min-width: 733.33px;
}
}
@media (min-width: 54.0625em) {
.app-data-box-group-one-half {
display: flex;
justify-content: space-between;
column-gap: govuk-spacing(4);
width: 100%;
min-width: 733.33px;
}
}
@media (min-width: 54.0625em) {
.app-data-box-one-half {
width: 50%;
float: left;
}
}
@media (min-width: 54.0625em) {
.app-data-box-one-half__underline {
min-width: 733.33px;
}
}
.app-data-box__upper { .app-data-box__upper {
@include govuk-responsive-margin(2, "bottom"); @include govuk-responsive-margin(2, "bottom");
@include govuk-responsive-padding(4);
background-color: govuk-colour("light-grey"); background-color: govuk-colour("light-grey");
color: govuk-colour("blue"); color: govuk-colour("blue");
@ -7,16 +55,11 @@
.app-data-box__lower { .app-data-box__lower {
@include govuk-responsive-margin(4, "bottom"); @include govuk-responsive-margin(4, "bottom");
@include govuk-responsive-padding(4);
background-color: govuk-colour("blue"); background-color: govuk-colour("blue");
} }
.app-data-box {
@include govuk-responsive-padding(4);
font-weight: bold;
white-space: nowrap;
}
.app-data-box__count { .app-data-box__count {
font-size: 48px; font-size: 48px;
color: govuk-colour("blue"); color: govuk-colour("blue");

4
app/views/home/_data_box.html.erb
Unescape View File

@ -1,9 +1,9 @@
<div class="app-data-box app-data-box__upper"> <div class="app-data-box__upper">
<div class="app-data-box__count"> <div class="app-data-box__count">
<a><%= govuk_link_to data_count(@current_user, type), data_path(@current_user, type), class: "govuk-link--no-visited-state govuk-link--no-underline" %></a> <a><%= govuk_link_to data_count(@current_user, type), data_path(@current_user, type), class: "govuk-link--no-visited-state govuk-link--no-underline" %></a>
</div> </div>
<a><%= govuk_link_to data_subheading(@current_user, type), data_path(@current_user, type), class: "govuk-link--no-visited-state" %></a> <a><%= govuk_link_to data_subheading(@current_user, type), data_path(@current_user, type), class: "govuk-link--no-visited-state" %></a>
</div> </div>
<div class="app-data-box app-data-box__lower"> <div class="app-data-box__lower">
<%= govuk_link_to view_all_text(type), view_all_path(type), class: "govuk-link--inverse" %> <%= govuk_link_to view_all_text(type), view_all_path(type), class: "govuk-link--inverse" %>
</div> </div>

53
app/views/home/index.html.erb
Unescape View File

@ -1,43 +1,48 @@
<div class="govuk-grid-row"> <div class="govuk-grid-row">
<div class="govuk-width-container"> <div class="govuk-width-container">
<div class="govuk-grid-column-two-thirds">
<div class="govuk-grid-row govuk-!-margin-bottom-7"> <div class="govuk-grid-row govuk-!-margin-bottom-7">
<span class="govuk-body-l"><%= "Welcome back, #{@current_user.name}" %></span> <span class="govuk-body-l"><%= "Welcome back, #{@current_user.name}" %></span>
<h1 class="govuk-heading-l"><%= heading_for_user_role(@current_user) %></h1> <h1 class="govuk-heading-l"><%= heading_for_user_role(@current_user) %></h1>
</div> </div>
<div class="govuk-grid-row"> <div class="govuk-grid-row">
<div class="govuk-grid-column-three-quarters-from-desktop govuk-!-padding-left-0 govuk-!-padding-right-0"> <div class="app-data-box-group">
<% if @current_user.support? || (@current_user.data_coordinator? && @current_user.sales_logs.present?) %> <% if @current_user.support? || (@current_user.data_coordinator? && @current_user.sales_logs.present?) %>
<div class="govuk-grid-column-one-third govuk-!-padding-left-0"> <div class="app-data-box-group-one-third">
<span><%= render partial: "home/data_box", locals: { type: "lettings" } %></span> <div class="app-data-box-one-third">
</div> <span><%= render partial: "home/data_box", locals: { type: "lettings" } %></span>
<div class="govuk-grid-column-one-third govuk-!-padding-left-0">
<span><%= render partial: "home/data_box", locals: { type: "sales" } %></span>
</div>
<div class="govuk-grid-column-one-third govuk-!-padding-left-0">
<span><%= render partial: "home/data_box", locals: { type: "schemes" } %></span>
</div>
<% else %>
<div class="govuk-grid-column-one-half govuk-!-padding-left-0">
<span><%= render partial: "home/data_box", locals: { type: "lettings" } %></span>
</div>
<% if @current_user.data_coordinator? %>
<div class="govuk-grid-column-one-half govuk-!-padding-left-0">
<span><%= render partial: "home/data_box", locals: { type: "schemes" } %></span>
</div> </div>
<% elsif @current_user.sales_logs.present? %> <div class="app-data-box-one-third">
<div class="govuk-grid-column-one-half govuk-!-padding-left-0">
<span><%= render partial: "home/data_box", locals: { type: "sales" } %></span> <span><%= render partial: "home/data_box", locals: { type: "sales" } %></span>
</div> </div>
<% else %> <div class="app-data-box-one-third">
<div class="govuk-grid-column-one-half govuk-!-padding-left-0"> <span><%= render partial: "home/data_box", locals: { type: "schemes" } %></span>
<span><%= render partial: "home/data_box", locals: { type: "misc" } %></span>
</div> </div>
<% end %> </div>
<% else %>
<div class="app-data-box-group-one-half">
<div class="app-data-box-one-half">
<span><%= render partial: "home/data_box", locals: { type: "lettings" } %></span>
</div>
<% if @current_user.data_coordinator? %>
<div class="app-data-box-one-half">
<span><%= render partial: "home/data_box", locals: { type: "schemes" } %></span>
</div>
<% elsif @current_user.sales_logs.present? %>
<div class="app-data-box-one-half">
<span><%= render partial: "home/data_box", locals: { type: "sales" } %></span>
</div>
<% else %>
<div class="app-data-box-one-half">
<span><%= render partial: "home/data_box", locals: { type: "misc" } %></span>
</div>
<% end %>
</div>
<% end %> <% end %>
</div> </div>
</div> </div>
<div class="govuk-grid-row"> <div class="govuk-grid-row">
<div class="govuk-grid-column-three-quarters-from-desktop govuk-!-padding-left-0"> <div class="app-data-box__underline">
<hr class="govuk-section-break govuk-section-break--visible govuk-section-break--m"> <hr class="govuk-section-break govuk-section-break--visible govuk-section-break--m">
</div> </div>
</div> </div>

Write Preview
Loading…
Cancel
Save