Commit 206129cf authored by Martin Leblanc's avatar Martin Leblanc Committed by Kevin Paxman
Browse files

additional css for the catalogs search

parent bcd40944
......@@ -5916,6 +5916,59 @@ button[disabled] {
padding-right: 0;
} }
.uw-catalog-search {
margin-left: auto;
margin-right: auto;
max-width: 45rem;
padding: 0 16px;
margin: 0;
}
@media (min-width: 75rem) {
.uw-catalog-search {
padding-left: 0;
padding-right: 0;
} }
.uw-catalog-search .catalog-search-form {
display: grid;
grid-template-columns: auto 3rem;
position: relative;
}
.uw-catalog-search .catalog-search-form .form-text {
border-bottom-right-radius: 0;
border-top-right-radius: 0;
width: 100%;
}
.uw-catalog-search .catalog-search-form .button[aria-label="search"] {
background-image: url("../source/images/icons/search_2-white.svg");
background-color: #757575;
background-position: 50% 50%;
background-repeat: no-repeat;
background-size: 50%;
border: 1px solid #ccc;
border-bottom-left-radius: 0;
border-bottom-right-radius: 3px;
border-top-left-radius: 0;
border-top-right-radius: 3px;
height: 2.47rem;
margin: 0;
max-width: inherit;
padding: 0;
transition: background-color 200ms cubic-bezier(0.4, 0, 1, 1);
vertical-align: top;
white-space: normal;
width: inherit;
}
@media (min-width: 63.1875rem) {
.uw-catalog-search .catalog-search-form .button[aria-label="search"] {
height: 2.46rem;
} }
.uw-catalog-search .catalog-search-form .button[aria-label="search"]:hover,
.uw-catalog-search .catalog-search-form .button[aria-label="search"]:focus {
background-image: url("../source/images/icons/search_2.svg");
background-color: #fff;
background-position: 50% 50%;
}
.uw-colour-bar__cbarorg-default__uw-gold--lvl1 {
background-color: #fffaaa;
}
......
This source diff could not be displayed because it is too large. You can view the blob instead.
......@@ -338,23 +338,6 @@ else if (e.keyCode === 37) {
};
})(jQuery, Drupal);
/**
* @file
* Ckeditor Modal.
*/
(function ($, Drupal) {
if ($.ui && $.ui.dialog) {
orig_allowInteraction = $.ui.dialog.prototype._allowInteraction;
$.ui.dialog.prototype._allowInteraction = function (event) {
if ($(event.target).closest('.cke_dialog').length) {
return true;
}
return orig_allowInteraction.apply(this, arguments);
};
}
})(jQuery, Drupal);
/**
* @file
*/
......@@ -390,6 +373,23 @@ else {
};
})(jQuery);
/**
* @file
* Ckeditor Modal.
*/
(function ($, Drupal) {
if ($.ui && $.ui.dialog) {
orig_allowInteraction = $.ui.dialog.prototype._allowInteraction;
$.ui.dialog.prototype._allowInteraction = function (event) {
if ($(event.target).closest('.cke_dialog').length) {
return true;
}
return orig_allowInteraction.apply(this, arguments);
};
}
})(jQuery, Drupal);
/**
* @file
*/
......
.uw-catalog-search {
@include uw-contained-width(45rem);
margin:0;
.catalog-search-form {
display:grid;
grid-template-columns: auto 3rem;
position: relative;
input {
.form-text {
border-bottom-right-radius: 0;
border-top-right-radius: 0;
width: 100%;
}
}
// the search button icon using the svg background function the svg
.button{
&[aria-label="search"]{
@include svg-background(search_2-white);
background-color:gesso-grayscale(gray-5);
background-position: 50% 50%;
background-repeat:no-repeat;
background-size:50%;
border:1px solid gesso-grayscale(gray-3);
.catalog-search-submit-wrapper {
display: block;
height: 2.3rem;
padding: 0;
position: absolute;
right: 0;
top: -.7rem;
width: 2.35rem;
z-index: 3;
&::after {
content:$fdsu-search-2;
display:block;
font-family: gesso-font-family(iconfont);
font-weight:200;
text-align: center;
border-bottom-left-radius: 0;
border-bottom-right-radius: 3px;
border-top-left-radius: 0;
border-top-right-radius: 3px;
height:2.47rem;
@include large {
height:2.46rem;
}
margin:0;
max-width:inherit;
padding:0;
transition: background-color 200ms cubic-bezier(0.4, 0, 1, 1);
vertical-align: top;
white-space: normal;
width:inherit;
&:hover,
&:focus{
@include svg-background(search_2);
background-color:gesso-grayscale(white);
background-position: 50% 50%;
}
}
}
}
.catalog-search-submit {
background-color: transparent;
border-left: solid 1px #4e4e4e;
text-indent: -9999rem;
}
}
......@@ -5,9 +5,7 @@
<div class="js-form-item form-item js-form-type-textfield form-type-textfield js-form-item-search-input form-item-search-input form-no-label">
<input data-drupal-selector="edit-search-input" type="text" id="edit-search-input" name="search_input" value="" size="60" maxlength="128" placeholder="Search within all catalogs" class="form-text required" required="required" aria-required="true">
</div>
<div class="catalog-search-submit-wrapper">
<input class="catalog-search-submit button js-form-submit form-submit" data-drupal-selector="edit-submit" type="submit" id="edit-submit" name="op" value="">
</div>
<input aria-label="search" class="catalog-search-submit button js-form-submit form-submit" data-drupal-selector="edit-submit" type="submit" id="edit-submit" name="op" value="">
<input autocomplete="off" data-drupal-selector="form-sxccibplaegc-73-lec694bsvanum6b-j-wflacshoi" type="hidden" name="form_build_id" value="form-sxCCiBplaegC_73_LEC694bSvAnuM6B-j-wFlACShOI">
<input data-drupal-selector="edit-catalog-search-all-form-form-token" type="hidden" name="form_token" value="ZwUmrQqVQLNwYel4ZKfXoIqHlDdO3R2L2wIyZNBPVPM">
<input data-drupal-selector="edit-catalog-search-all-form" type="hidden" name="form_id" value="catalog_search_all_form">
......
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 25.4.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 32 32" style="enable-background:new 0 0 32 32;" xml:space="preserve">
<style type="text/css">
.st0{fill:#FFFFFF;}
</style>
<path class="st0" d="M28.1,29.3l-7.2-10.5c4.1-3.2,5.2-9.1,2.5-13.7c-3-5-9.5-6.6-14.5-3.6c-5,3-6.6,9.5-3.6,14.5
c2.7,4.5,8.2,6.3,13,4.4l5.9,11.3c0.2,0.4,0.6,0.5,1,0.3l2.7-1.6C28.2,30.1,28.3,29.7,28.1,29.3L28.1,29.3z M18,16.7
c-3.4,2-7.8,0.9-9.8-2.5s-0.9-7.8,2.5-9.8c3.4-2,7.8-0.9,9.8,2.5S21.4,14.7,18,16.7L18,16.7z"/>
</svg>
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32">
<title>search-2</title>
<path d="M28.067 29.328l-7.159-10.519c4.091-3.24 5.248-9.105 2.49-13.695-2.995-4.986-9.488-6.604-14.474-3.61-4.985 2.996-6.604 9.489-3.609 14.474 2.701 4.496 8.248 6.253 12.967 4.357l5.946 11.299c0.184 0.351 0.613 0.47 0.952 0.267l2.674-1.608c0.34-0.204 0.435-0.638 0.212-0.966zM18.049 16.689c-3.388 2.035-7.8 0.935-9.836-2.453s-0.934-7.8 2.453-9.835c3.387-2.036 7.799-0.935 9.834 2.453s0.936 7.801-2.452 9.835z"></path>
</svg>
Markdown is supported
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