Add search icon to navbar searchbar

This commit is contained in:
syeopite 2021-04-12 04:24:27 -07:00
parent 40823d5816
commit b1890560e2
No known key found for this signature in database
GPG key ID: 6FA616E5A5294A82
2 changed files with 18 additions and 3 deletions

View file

@ -168,6 +168,18 @@ img.thumbnail {
color: #3E4446;
background: transparent;
font-size: 1.1em;
}
.search-button:hover {
color: #090909;
}
#right-overlap-search-button {
float: right;
position: relative;
bottom: 1.8em;
}
/*
@ -444,12 +456,14 @@ body.dark-theme {
}
.dark-theme .search-button {
border: none;
color: #B0ADA4;
background: transparent;
font-size: 1.1em;
}
.dark-theme .search-button:hover {
color: #CFCBC1;
}
.dark-theme .pure-menu-link:hover, .dark-theme .pure-menu-link:active {
background-color: rgb(34, 36, 38)
}

View file

@ -36,6 +36,7 @@
<form class="pure-form" action="/search" method="get">
<fieldset>
<input type="search" style="width:100%" name="q" placeholder="<%= translate(locale, "search") %>" value="<%= env.get?("search").try {|x| HTML.escape(x.as(String)) } %>">
<button class="search-button" id="right-overlap-search-button"><i class="icon ion-md-search"></i></button>
</fieldset>
</form>
</div>