Commit 222b3de0 authored by Martin Leblanc's avatar Martin Leblanc Committed by Kevin Paxman
Browse files

ISTWCMS-5061:css changes to the autocomplete and adjustments to details in view filters

parent 195c8a5d
......@@ -2107,7 +2107,7 @@ textarea {
.uw-site-container .webform-submission-form .form-actions {
display: flex;
gap: 1rem;
margin: 2rem 0; }
margin: 0.25rem 0; }
.uw-site-container .webform-submission-form .form-actions .button {
background-color: #757575;
background-image: none;
......@@ -2393,7 +2393,8 @@ svg:not(:root) {
pointer-events: none; }
.webform-has-field-prefix .form-text,
.webform-has-field-suffix .form-text {
.webform-has-field-suffix .form-text,
.captcha .form-text {
width: auto !important; }
.bef-toggle {
......@@ -2419,6 +2420,22 @@ input[size="60"] {
max-width: 100%;
width: 100%; }
/* stylelint-disable */
.js input.form-autocomplete {
background-position: 99.5% center; }
/* stylelint-enable */
.ui-autocomplete .ui-menu-item .ui-menu-item-wrapper,
.ui-autocomplete .ui-menu-item a {
color: #000 !important;
font-family: Typ1451-Medium,-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Oxygen-Sans", Ubuntu, Cantarell, "Fira Sans", Droid Sans, sans-serif !important;
text-decoration: none; }
.ui-autocomplete .ui-menu-item .ui-menu-item-wrapper:hover, .ui-autocomplete .ui-menu-item .ui-menu-item-wrapper:focus, .ui-autocomplete .ui-menu-item .ui-menu-item-wrapper:active,
.ui-autocomplete .ui-menu-item a:hover,
.ui-autocomplete .ui-menu-item a:focus,
.ui-autocomplete .ui-menu-item a:active {
background: #fffaaa; }
.breadcrumb__title, .readmore-link__accessibility-description {
clip: rect(1px, 1px, 1px, 1px);
height: 1px;
......@@ -5302,7 +5319,7 @@ button {
border: 1px solid #bfbfbf;
border-bottom: 1px solid #000;
border-radius: inherit;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
box-shadow: none;
margin: 1.5rem 0;
transition: box-shadow 200ms cubic-bezier(0.4, 0, 0.2, 1);
width: 100%;
......@@ -5312,10 +5329,10 @@ button {
color: #000; }
.uw-details:hover,
.seven-details:hover {
box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23); }
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); }
.uw-details:focus-within,
.seven-details:focus-within {
box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23); }
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); }
.uw-details:first-child,
.seven-details:first-child {
margin-top: 0; }
......@@ -5398,7 +5415,7 @@ button {
padding: 1rem; }
.seven-details__wrapper .uw-input,
.seven-details__wrapper .form-text {
width: 100% !important; }
width: 100%; }
.sliding-popup-bottom,
.sliding-popup-top {
......@@ -9491,7 +9508,7 @@ html:not(.js) .uw-tabcontent[role="tabpanel"][hidden] {
font-size: 14.22224px;
font-weight: 200;
letter-spacing: inherit;
padding-left: 16px; }
padding-left: 0.25rem; }
.view-filters form .uw-input,
.view-filters form .form-text,
.view-filters form select {
......@@ -9503,7 +9520,7 @@ html:not(.js) .uw-tabcontent[role="tabpanel"][hidden] {
@media (min-width: 63.1875rem) {
.view-filters .uw-input,
.view-filters .form-text {
width: 100% !important; }
width: 100%; }
.view-filters .views-exposed-form {
margin: 0 !important;
padding: 0 !important; } }
......
This source diff could not be displayed because it is too large. You can view the blob instead.
......@@ -218,11 +218,12 @@ textarea {
}
}
}
.webform-submission-form{
.form-actions{
display:flex;
gap:1rem;
margin:2rem 0;
margin:0.25rem 0;
.button{
@include button();
height:inherit;
......
......@@ -40,6 +40,7 @@ $uw-input-padding: 0.46667rem;
padding: $uw-input-padding;
transition: border-color;
width: 100%;
&:focus {
border: 1px solid $uw-input-border-color-focus !important;
box-shadow: inset 0 1px 3px rgba(0,0,0,.06), 0 0 5px rgba(104,104,104,.7);
......@@ -52,8 +53,10 @@ $uw-input-padding: 0.46667rem;
// make the input after prefix be inline
}
.webform-has-field-prefix,
.webform-has-field-suffix{
.webform-has-field-suffix,
.captcha {
.form-text{
width:auto !important;
}
......@@ -82,3 +85,33 @@ input[size="60"] {
max-width: 100%;
width: 100%;
}
// Autoomplete
/* stylelint-disable */
.js {
input {
&.form-autocomplete {
background-position: 99.5% center;
}
}
}
/* stylelint-enable */// Autocomplete ul li a.
.ui-autocomplete {
.ui-menu-item{
.ui-menu-item-wrapper,
a{
color:$uw-black !important;
font-family:$uw-input-font-family !important;
text-decoration:none;
&:hover,
&:focus,
&:active{
background:gesso-brand('org-default', uw-gold, lvl1);
}
}
}
}
......@@ -17,7 +17,7 @@ $details-font-family: gesso-font-family(primary);
border: 1px solid #bfbfbf;
border-bottom: 1px solid $card-accent-border-color;
border-radius: inherit;
box-shadow: gesso-box-shadow(1);
box-shadow: gesso-box-shadow(0);
margin: rem(gesso-spacing(md)) 0;
transition: box-shadow gesso-duration(short) gesso-easing(ease-in-out);
width:100%;
......@@ -25,10 +25,10 @@ $details-font-family: gesso-font-family(primary);
color: gesso-brand(org-default,uw-black,'primary');
}
&:hover {
box-shadow: gesso-box-shadow(3);
box-shadow: gesso-box-shadow(1);
}
&:focus-within {
box-shadow: gesso-box-shadow(3);
box-shadow: gesso-box-shadow(1);
}
&:first-child{
margin-top: 0;
......@@ -126,6 +126,6 @@ $details-font-family: gesso-font-family(primary);
padding: 1rem;
.uw-input,
.form-text{
width:100% !important;
width:100%;
}
}
......@@ -32,7 +32,7 @@
font-size:gesso-font-size(-1);
font-weight:200;
letter-spacing:inherit;
padding-left:gesso-spacing(sm);
padding-left:0.25rem;
}
.uw-input,
.form-text,
......@@ -47,7 +47,7 @@
@include large {
.uw-input,
.form-text {
width: 100% !important;
width: 100%;
}
.views-exposed-form {
margin: 0 !important;
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment