style: update searchbar

This commit is contained in:
Henk Verlinde 2020-12-15 14:09:14 +01:00
parent b66c0a6221
commit 4b691771f3
2 changed files with 32 additions and 0 deletions

View File

@ -141,10 +141,18 @@ body.dark .navbar .btn-link:active {
body.dark .form-control.is-search {
background: $body-overlay-dark;
/*
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%236c757d' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-search'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");
background-repeat: no-repeat;
background-position: right calc(0.375em + 0.1875rem) center;
background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem);
*/
}
body.dark .navbar-form::after {
color: $gray-700;
border: 1px solid $body-bg-dark;
}
body.dark .form-control:focus {

View File

@ -79,6 +79,7 @@
}
.navbar-form {
position: relative;
margin-top: 0.25rem;
}
@ -117,13 +118,36 @@
}
.form-control.is-search {
/*
padding-right: calc(1.5em + 0.75rem);
*/
padding-right: 2.5rem;
background: $gray-100;
border: 0;
/*
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%236c757d' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-search'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");
background-repeat: no-repeat;
background-position: right calc(0.375em + 0.1875rem) center;
background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem);
*/
}
.navbar-form::after {
position: absolute;
top: 0.4625rem;
right: 0.5375rem;
display: flex;
align-items: center;
justify-content: center;
height: 1.5rem;
padding-right: 0.4375rem;
padding-left: 0.4375rem;
font-size: $font-size-base * 0.75;
color: $gray-700;
content: "/";
border: 1px solid $gray-300;
border-radius: 0.25rem;
}
/*! purgecss start ignore */