Inpage-Search (Geschäftssuche)
CODE
×
HTML
<div class='inpage-search-gs'> <input type=text value='' class='search-1' id='search-1' placeholder='Suchbegriff oder Nummer wie z.B. 2010.RRGR.34' onKeyPress='return checkSubmit(event)'> <div class='search-icon'></div> </div>
CSS
div.search-icon { background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iRWJlbmVfMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeD0iMHB4IiB5PSIwcHgiDQoJIHZpZXdCb3g9IjAgMCAzNjggMzY4IiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCAzNjggMzY4OyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+DQo8cGF0aCBkPSJNMjk2LjcsMjcyLjRMMjM2LjMsMjEyYzI0LjgtMzQuOCwyMS42LTgzLjMtOS41LTExNC41Yy0zNC44LTM0LjgtOTEuMi0zNC44LTEyNS45LDBzLTM0LjgsOTEuMiwwLDEyNS45DQoJYzMxLjIsMzEuMiw3OS43LDM0LjMsMTE0LjUsOS41bDYwLjQsNjAuNGM1LjgsNS44LDE1LjIsNS44LDIxLDBDMzAyLjUsMjg3LjYsMzAyLjUsMjc4LjIsMjk2LjcsMjcyLjR6IE0xMjEuOCwyMDIuNA0KCWMtMjMuMi0yMy4yLTIzLjItNjAuOCwwLTg0czYwLjgtMjMuMiw4NCwwczIzLjIsNjAuOCwwLDg0UzE0NSwyMjUuNiwxMjEuOCwyMDIuNHoiLz4NCjwvc3ZnPg=='); background-repeat: no-repeat; background-attachment: scroll; background-position: center center; background-size: auto; height: 32px; width: 32px; right: 24px; top: 16px; position:absolute; -webkit-transition: all 150ms ease-in-out; transition: all 150ms ease-in-out; } input[type=text].search-1 { text-overflow:ellipsis; margin-left: 12px; width: calc(100% - 24px) !important; margin-top: 12px !important; margin-bottom: 12px !important; padding-right: 44px !important; background-color: var(--white); height: 42px !important; border:none; opacity: 0.9; padding-left: 15px; } @media screen and (max-width: 767px) { input[type=text].search-1 { } }
JS
Inpage-Search (Geschäftssuche)
Erstellt: 19.08.2021 - 14:18 Uhr
Letzte Änderung: 14.10.2021 - 21:22 Uhr
×