Files
notifications-admin/app/assets/stylesheets/app.scss
Chris Hill-Scott a1607ef6fa Fix font-size when Chrome autofills inputs
For some reason Chrome decides that using its own font declaration is
preferable to keeping the input looking as it would without autofill.

This overrides that with our bigger, better font.
2020-08-28 10:31:44 +01:00

260 lines
3.5 KiB
SCSS

// Extra CSS overlaying elements
.form-control-1-1 {
width: 100%;
}
.form-control-5em {
width: 100%;
@include media(tablet) {
width: 5em;
}
}
.column-main {
.heading-large,
> .heading-medium {
margin: govuk-spacing(3) 0 govuk-spacing(4) 0;
word-wrap: break-word;
&.top-gutter-0 {
margin-top: 0;
}
}
}
.highlight {
font-family: monospace;
overflow-x: scroll;
padding: 10px 0 10px 10px;
}
.inline {
.block-label {
@include media(tablet) {
float: none;
display: inline-block;
}
}
}
td {
vertical-align: top;
}
.heading-xlarge {
margin-bottom: 20px;
}
.heading-medium {
margin-top: govuk-spacing(6);
}
.form-label {
margin-bottom: 5px;
&.heading-small {
@include bold-19();
}
}
.hint {
color: $secondary-text-colour;
.form-label + & {
display: block;
margin-top: -5px;
margin-bottom: 5px;
}
}
.list-bullet {
.list-bullet {
list-style: circle;
}
}
details summary {
text-decoration: underline;
margin-bottom: govuk-spacing(3);
}
.spreadsheet {
margin-bottom: -1 * govuk-spacing(6);
.table {
margin-bottom: 0;
}
th,
.table-field-index {
background: $grey-4;
font-weight: bold;
text-align: center;
}
th, td {
padding-left: 10px;
padding-right: 10px;
border: 1px solid $border-colour;
}
td {
border-top: 0;
// 194 is the width of the table * 1/3.5, so the overflow cuts off
// at 3.5 columns wide.
// 11 accounts for the padding of the table cell
min-width: 194px - 11px;
&:first-child {
min-width: auto;
}
}
.fullscreen-fixed-table {
z-index: 1000;
.table-field-heading-first {
background: $grey-4;
}
}
}
.body-copy-table {
table {
th,
td {
@include core-19;
word-wrap: break-word;
}
thead {
th {
@include bold-19;
}
}
}
}
.tabular-numbers {
@include core-19($tabular-numbers: true);
}
summary::-moz-details-marker {
display: none;
}
summary::-ms-details-marker {
display: none;
}
summary::-o-details-marker {
display: none;
}
summary::details-marker {
display: none;
}
summary::-webkit-details-marker {
display: none;
}
details .arrow {
font-size: 16px;
}
.block-label-hint {
@include core-16;
margin-top: 5px;
}
.multiple-choice input:disabled+label {
opacity: 1;
color: $secondary-text-colour;
cursor: default;
}
.heading-inline {
display: inline-block;
}
.bordered-text-box {
padding: 5px;
outline: 2px solid $black;
max-width: 100%;
}
.nowrap {
white-space: nowrap;
}
.heading-upcoming-jobs {
margin-top: govuk-spacing(3);
}
@keyframes live-pulse {
0% {
background: $red;
box-shadow: inset 0 0 0 2px $red, inset 0 0 0 4px $white;
}
40% {
background: $red;
box-shadow: inset 0 0 0 2px $red, inset 0 0 0 4px $white;
}
50% {
background: $white;
box-shadow: inset 0 0 0 2px $red, inset 0 0 0 2px $white;
}
100% {
background: $white;
box-shadow: inset 0 0 0 2px $red, inset 0 0 0 4px $white;
}
}
.live-broadcast {
color: $red;
font-weight: bold;
position: relative;
display: inline-block;
&:before {
content: "";
display: block;
float: right;
margin-top: 1px;
margin-left: 5px;
border: none;
background: $red;
width: 19px;
height: 19px;
border-radius: 50%;
animation: live-pulse 1.5s infinite;
//box-shadow: inset 0 0 0 2px $red, inset 0 0 0 5px $white;
}
}
input:-webkit-autofill::first-line {
@include core-19;
}