Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

UI adjustments #921

Merged
merged 4 commits into from
Oct 27, 2023
Merged

UI adjustments #921

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
45ff46a
Quote icon background
peterdavidhamilton Oct 25, 2023
8d2fb04
Patch section background
peterdavidhamilton Oct 25, 2023
5d4deaf
Opt into 2/3 section intro
peterdavidhamilton Oct 27, 2023
83343c7
Update spec
peterdavidhamilton Oct 27, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 1 addition & 3 deletions app/assets/stylesheets/prompt.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,9 +15,7 @@ $prompt-hue: govuk-colour('turquoise');
.svg-inline--fa {
position: relative;
display: inline-block;
width: 32px; // height of size 2x
// top: -16px;
// left: -32px;
width: 32px;
top: govuk-spacing(-3);
left: govuk-spacing(-6);
}
Expand Down
2 changes: 1 addition & 1 deletion app/assets/stylesheets/quote.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@

blockquote.quote {
position: relative;
border: 3px solid govuk-colour("black");
border: 3px solid govuk-colour('black');
padding: 20px;
margin: 16px 20px;

Expand Down
9 changes: 9 additions & 0 deletions app/assets/stylesheets/section-intro.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,5 +19,14 @@
background-color: $color_dfe-secondary-blue;
}
}

.blockquote-container {
blockquote.quote {
&:before {
background-color: govuk-colour('light-grey');
}
}
}

}

9 changes: 5 additions & 4 deletions app/views/markup/_two_thirds.html.slim
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
.govuk-grid-column-two-thirds
== left
.govuk-grid-row
.govuk-grid-column-two-thirds
== left

.govuk-grid-column-one-third
== right
.govuk-grid-column-one-third
== right
2 changes: 1 addition & 1 deletion app/views/notes/_form.html.slim
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@

= form_with(model: note, url: user_notes_path) do |form|
.govuk-grid-row
.govuk-grid-column-two-thirds-from-desktop
.govuk-grid-column-three-quarters
.prompt
.govuk-grid-row
.govuk-grid-column-one-quarter
Expand Down
23 changes: 10 additions & 13 deletions app/views/training/pages/section_intro.html.slim
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,18 +6,15 @@

= render 'debug'

.govuk-grid-row
.govuk-grid-column-full
#section-intro-panel
.govuk-grid-row
h1.govuk-heading-xl= content.heading
#section-intro-panel
.govuk-grid-row
.govuk-grid-column-full
h1.govuk-heading-xl= content.heading

.govuk-grid-row
.govuk-grid-column-two-thirds
= m(content.body)
= m(content.body)

.govuk-grid-row
.govuk-grid-column-full
.govuk-button-group
= link_to_previous
= link_to_next
.govuk-grid-row
.govuk-grid-column-full
.govuk-button-group
= link_to_previous
= link_to_next
2 changes: 1 addition & 1 deletion spec/helpers/content_helper_spec.rb
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -125,7 +125,7 @@
end

it 'builds semantic markup' do
expect(html).to eq '<div class="govuk-grid-column-two-thirds"><p class="govuk-body-m">Description of an image</p></div><div class="govuk-grid-column-one-third"><p class="govuk-body-m"><img src="/path/to/image" alt="image title"></p></div>'
expect(html).to eq '<div class="govuk-grid-row"><div class="govuk-grid-column-two-thirds"><p class="govuk-body-m">Description of an image</p></div><div class="govuk-grid-column-one-third"><p class="govuk-body-m"><img src="/path/to/image" alt="image title"></p></div></div>'
end
end
end
Expand Down
Loading