// search elements .search{ .input-group { position: relative; border-radius: 4rem; overflow: hidden; padding: 0; margin: 0; .appear { right: 0; position: absolute; height: 100%; padding: 0.3rem 1rem; } } .input-group * { margin: 0; } .button{ border-color: $primary-color; } .appear{ display:none; } input{ &:active{ border-color: $primary-color; background-color: $input-background-focus; } &:focus,&:focus-within{ border-color: $primary-color; background-color: $input-background; } &:not(:placeholder-shown) { border:none; background-color: $input-background-focus; position: relative; padding-right: $global-padding * 9; + .appear { display: block; background-color: scale-color($input-background-focus, $lightness: -20%); z-index: 2; &:hover { color: $white; background-color: $primary-color; } } } } .hollow { border-color: $primary-color; color: $primary-color; &::after { } &::placeholder { color: scale-color($primary-color, $lightness: -20%); } &:hover { background-color: scale-color($primary-color, $lightness: 95%); } &:active { background-color: scale-color($primary-color, $lightness: 85%); } } } //search block size in content article,.omekas-entry-content { .search{ @include xy-grid(); .input-group { @include breakpoint(small){ @include xy-cell (12); margin-left: auto; margin-right: auto; } @include breakpoint(medium){ @include xy-cell (6); margin-left: auto; margin-right: auto; } @include breakpoint(large){ @include xy-cell (4); margin-left: auto; margin-right: auto; } } } } // contact form 7 // [type='text'], [type='password'], [type='date'], [type='datetime'], [type='datetime-local'], [type='month'], [type='week'], [type='email'], [type='number'], [type='search'], [type='tel'], [type='time'], [type='url'], [type='color'], textarea { border: none; }