* Use eslint and stylelint, fix all errors * Remove jshint, jsbeautify * Use Object.keys directly since that is available in all major browsers * Fixes for eslint, stylelint errors * stylelint is not included in grunt test yet because jquery.uls.mobile.css has so many !important and need to figure out whether they are really needed
128 lines
2.5 KiB
CSS
128 lines
2.5 KiB
CSS
.uls-trigger {
|
|
background: url( ../images/icon-language.png ) no-repeat left center;
|
|
/* @embed */
|
|
background-image: linear-gradient( transparent, transparent ), url( ../images/icon-language.svg );
|
|
padding-left: 30px;
|
|
}
|
|
|
|
.uls-menu {
|
|
position: absolute;
|
|
z-index: 1000;
|
|
display: none;
|
|
margin-top: 1px;
|
|
background-color: #fff;
|
|
border: 1px solid #ccc;
|
|
border-color: rgba( 0, 0, 0, 0.2 );
|
|
-webkit-box-shadow: 0 5px 10px rgba( 0, 0, 0, 0.2 );
|
|
-moz-box-shadow: 0 5px 10px rgba( 0, 0, 0, 0.2 );
|
|
box-shadow: 0 5px 10px rgba( 0, 0, 0, 0.2 );
|
|
-webkit-background-clip: padding-box;
|
|
-moz-background-clip: padding;
|
|
background-clip: padding-box;
|
|
}
|
|
|
|
.uls-wide {
|
|
min-width: 715px;
|
|
width: 45%;
|
|
}
|
|
|
|
.uls-medium {
|
|
min-width: 360px;
|
|
width: 30%;
|
|
}
|
|
|
|
/* Override the grid */
|
|
.uls-medium.grid .row {
|
|
min-width: 300px;
|
|
}
|
|
|
|
.uls-narrow {
|
|
min-width: 180px;
|
|
width: 20%;
|
|
}
|
|
|
|
/* Override the grid */
|
|
.uls-narrow.grid .row {
|
|
min-width: 150px;
|
|
}
|
|
|
|
.uls-search {
|
|
background-color: #fff;
|
|
padding: 5px 16px;
|
|
border-bottom: 1px solid #ddd;
|
|
}
|
|
|
|
.grid .uls-search {
|
|
padding-left: 0;
|
|
}
|
|
|
|
/* Make space for magnifying class on the front */
|
|
.uls-search-wrapper {
|
|
position: relative;
|
|
padding-left: 44px;
|
|
margin-right: 5px;
|
|
height: 32px;
|
|
}
|
|
|
|
.uls-search-label {
|
|
background: url( ../images/search.png ) no-repeat center center;
|
|
/* @embed */
|
|
background-image: linear-gradient( transparent, transparent ), url( ../images/search.svg );
|
|
background-size: 20px;
|
|
height: 32px;
|
|
width: 44px;
|
|
display: block;
|
|
position: absolute;
|
|
left: 0;
|
|
opacity: 0.8;
|
|
}
|
|
|
|
.uls-search-input-wrapper {
|
|
position: relative;
|
|
}
|
|
|
|
/* There are two input boxes. This class applies to both of them */
|
|
.uls-filterinput {
|
|
font-size: 16px;
|
|
height: 32px;
|
|
width: 100%;
|
|
/* For the custom clear (X) icon */
|
|
padding: 6px 25px 6px 0;
|
|
outline: 0;
|
|
border: 0;
|
|
display: block;
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
}
|
|
|
|
/* This is the actual input */
|
|
.uls-languagefilter {
|
|
background-color: transparent;
|
|
border: 0;
|
|
color: #222;
|
|
}
|
|
|
|
/* This is the shadow input box showing completion suggestions */
|
|
.uls-filtersuggestion {
|
|
background-color: #fff;
|
|
color: #777;
|
|
}
|
|
|
|
.uls-languagefilter-clear {
|
|
background: url( ../images/clear.png ) no-repeat left center;
|
|
/* @embed */
|
|
background-image: linear-gradient( transparent, transparent ), url( ../images/clear.svg );
|
|
background-size: 15px;
|
|
cursor: pointer;
|
|
height: 15px;
|
|
width: 15px;
|
|
|
|
/* Vertical margins: (32 - 15) / 2 */
|
|
margin: 8.5px 5px;
|
|
position: absolute;
|
|
right: 0;
|
|
/* Make it appear above the input boxes */
|
|
z-index: 1;
|
|
}
|