Skip to content
This repository has been archived by the owner on Feb 17, 2022. It is now read-only.

Commit

Permalink
Remove float from form-group
Browse files Browse the repository at this point in the history
Merging alphagov/govuk_elements#487 to fix form group float causing heading padding to disappear
  • Loading branch information
matteason committed Jul 6, 2017
1 parent 4301627 commit 0d5e268
Showing 1 changed file with 24 additions and 15 deletions.
39 changes: 24 additions & 15 deletions app/assets/template/stylesheets/elements/_forms.scss
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,7 @@
// 4. Form hints
// 5. Form controls
// 6. Form control widths
// 7. Browser accessibility fixes

// 1. Helpers
// ==========================================================================
Expand All @@ -35,14 +36,14 @@ textarea {
// 2. Form wrappers
// ==========================================================================

// Form section is used to wrap .form-group and has twice its margin
.form-section {
.form-section,
.form-group {
@extend %contain-floats;
@include box-sizing(border-box);
}

float: left;
width: 100%;

// Form section is used to wrap .form-group and has twice its margin
.form-section {
margin-bottom: $gutter;

@include media(tablet) {
Expand All @@ -52,12 +53,6 @@ textarea {

// Form group is used to wrap label and input pairs
.form-group {
@extend %contain-floats;
@include box-sizing(border-box);

float: left;
width: 100%;

margin-bottom: $gutter-half;

@include media(tablet) {
Expand Down Expand Up @@ -102,9 +97,8 @@ textarea {

// Used for the 'or' in between block label options
.form-block {
@extend %contain-floats;
float: left;
width: 100%;
clear: left;

margin-top: -5px;
margin-bottom: 5px;
Expand Down Expand Up @@ -162,11 +156,16 @@ textarea {
// scss-lint:disable QualifyingElement
input.form-control,
textarea.form-control {
// Remove inner shadow
// Disable inner shadow and remove rounded corners
-webkit-appearance: none;
// Remove rounded corners
border-radius: 0;
}

textarea.form-control {
// Disable opacity and background image for Firefox
opacity: 1;
background-image: none;
}
// scss-lint:enable QualifyingElement


Expand Down Expand Up @@ -223,3 +222,13 @@ textarea.form-control {
width: 12.5%;
}
}

// 7. Browser accessibility fixes
// ==========================================================================

option:active,
option:checked,
select:focus::-ms-value {
color: $white;
background-color: $govuk-blue;
}

0 comments on commit 0d5e268

Please sign in to comment.