Files
notifications-admin/app/assets/stylesheets/components/textbox.scss
Chris Hill-Scott abdabe4571 Fix extra tracking on numeric inputs
Since we moved to using textboxes from GOV.UK Frontend the old class
wasn’t appearing in the page.
2020-09-08 12:02:03 +01:00

77 lines
1.3 KiB
SCSS

.textbox-highlight {
$tag-background: rgba($light-blue, 0.6);
&-wrapper {
position: relative;
}
&-textbox {
resize: none;
z-index: 20;
background: none;
}
&-textbox,
&-background,
&-foreground,
&-mask {
font-size: 19px;
display: block;
box-sizing: border-box;
position: relative;
margin: 0;
padding: 4px;
overflow: hidden;
line-height: 1.6;
}
&-background {
position: absolute;
top: 0;
left: 0;
pointer-events: none;
color: transparent;
white-space: pre-wrap;
overflow-wrap: break-word;
word-wrap: break-word;
border: 2px solid transparent;
padding-bottom: govuk-spacing(3);
z-index: 10;
.placeholder,
.placeholder-conditional {
color: transparent;
}
}
}
.textbox-help-link {
margin: 10px 0 0 0;
}
.textbox-right-aligned {
text-align: right;
}
.extra-tracking .govuk-input {
@include core-19($tabular-numbers: true);
padding-left: 5px;
letter-spacing: 0.04em;
}
.textbox-colour-preview {
@include media(desktop) {
width: 38px;
height: 38px;
margin-left: 5px;
border-radius: 50%;
box-shadow: inset 0 0 0 1px rgba($black, 0.2);
display: inline-block;
vertical-align: top;
transition: background 0.3s ease-out;
}
}