mirror of
https://github.com/GSA/notifications-admin.git
synced 2026-08-26 01:04:00 -04:00
It’s uneven ever since we upgraded the toolkit. Guess it’s probably allowing space for an arrow image. But I don’t like the arrow image because it looks like it’s pointing at the ‘or sign in’ link. So this commit overrides the button’s default spacing.
107 lines
1.6 KiB
SCSS
107 lines
1.6 KiB
SCSS
.product-page {
|
|
|
|
&-intro {
|
|
|
|
margin: -10px 0 $gutter * 1.5 0;
|
|
padding: 0 0 $gutter * 2 0;
|
|
background: $govuk-blue;
|
|
color: $white;
|
|
|
|
&-wrapper {
|
|
|
|
@extend %site-width-container;
|
|
|
|
@include media(desktop) {
|
|
|
|
background-image: file-url('product/proposition-illustration.png');
|
|
background-size: 320px;
|
|
background-repeat: no-repeat;
|
|
background-position: right -6px top 85px;
|
|
|
|
@include ie-lte(8) {
|
|
background-image: none;
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
h1 {
|
|
@include bold-48;
|
|
margin: 20px 0 $gutter 0;
|
|
}
|
|
|
|
p {
|
|
@include core-24;
|
|
margin: $gutter-half 0 $gutter;
|
|
}
|
|
|
|
.button-container {
|
|
line-height: 45px;
|
|
}
|
|
|
|
.button {
|
|
|
|
@include box-shadow(0 2px 0 darken($govuk-blue, 15%));
|
|
background: $white;
|
|
margin-right: 15px;
|
|
padding-right: 1.25em;
|
|
|
|
&:link,
|
|
&:visited,
|
|
&:hover {
|
|
color: $govuk-blue;
|
|
}
|
|
|
|
&:hover {
|
|
background: $light-blue-25;
|
|
outline: none;
|
|
}
|
|
|
|
}
|
|
|
|
a {
|
|
|
|
&:link,
|
|
&:visited {
|
|
color: $white;
|
|
}
|
|
|
|
&:hover,
|
|
&:active {
|
|
color: $light-blue-25;
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
&-section {
|
|
|
|
@extend %site-width-container;
|
|
margin-bottom: $gutter-half;
|
|
|
|
h2 {
|
|
@include bold-27;
|
|
margin: 0 0 $gutter;
|
|
}
|
|
|
|
.with-keyline {
|
|
border-top: 1px solid $border-colour;
|
|
padding: $gutter * 1.5 0 0 0;
|
|
}
|
|
|
|
img {
|
|
width: 100%;
|
|
margin: 0 0 $gutter * 1.5 0;
|
|
}
|
|
|
|
}
|
|
|
|
&-big-number {
|
|
@include bold-48($tabular-numbers: true);
|
|
margin: 0 0 0 0;
|
|
}
|
|
|
|
}
|