// Import screen reader classes from Seedlet. @import "../../../seedlet/assets/sass/base/accessibility"; .search-results { .site-main > * { padding: var(--global--spacing-vertical) 0; } .search-form { padding-bottom: 0; margin-bottom: var(--global--spacing-vertical); } .entry-title { font-size: var(--heading--font-size-h2); } .entry-header { margin-bottom: 0; } } .search-form { border-bottom: var(--form--border-width) solid var(--form--border-color); flex-direction: row-reverse; & > label { margin-right: 0; padding-left: 30px; position: relative; &:before { content: ""; position: absolute; top: 0; left: 0; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' id='search-icon' class='search-icon' viewBox='0 0 24 24' width='24' height='24'%3E%3Cpath d='M13.5 6C10.5 6 8 8.5 8 11.5c0 1.1.3 2.1.9 3l-3.4 3 1 1.1 3.4-2.9c1 .9 2.2 1.4 3.6 1.4 3 0 5.5-2.5 5.5-5.5C19 8.5 16.5 6 13.5 6zm0 9.5c-2.2 0-4-1.8-4-4s1.8-4 4-4 4 1.8 4 4-1.8 4-4 4z'%3E%3C/path%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: center center; width: 24px; height: 100%; } } input[type="search"] { border: none; padding-top: var(--button--padding-vertical); padding-bottom: var(--button--padding-vertical); font-size: var(--global--font-size-sm); color: var(--entry-header--color); } input[type="submit"] { background: none; color: var(--entry-header--color); @extend .screen-reader-text; } }