curben
/
blog
mirror of https://gitlab.com/curben/blog
1
0
Fork 0
Code Issues Releases Wiki Activity

fix(search): consistent class name style

This commit is contained in:
MDLeom 2020-03-20 05:37:09 +00:00
parent 2284440a7d
commit 1cccb619a0
No known key found for this signature in database
GPG Key ID: 5D9DB57A25D34EE3
3 changed files with 15 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
themes/chameleon/layout/_partial/header.ejs
View File

@ -5,14 +5,14 @@
<a class="main-nav-link" href="<%- url_for(theme.menu[i]) %>"><%= i %></a>
<% } %>
<div class="searchContainer">
<div class="search-container">
<form id="searchForm" method="post" action="https://duckduckgo.com/" target="_blank" rel="noopener external nofollow noreferrer">
<input type="text" name="q" class="searchBox" id="searchTxt" placeholder="Search..." title="Powered by DuckDuckGo">
<input type="text" name="q" class="search-box" placeholder="Search..." title="Powered by DuckDuckGo">
<input type="hidden" name="sites" value="<%- config.url.replace(/^http(s)?:\/\//, '') %>">
<input type="hidden" name="kd" value="-1">
<input type="hidden" name="kg" value="p">
<input type="hidden" name="kae" value="#000">
<a class="searchBtn no-underline" id="searchClick">
<a class="search-button no-underline" id="search-click">
<svg viewBox="0 0 512 512">
<title>Powered by DuckDuckGo</title>
<desc>Search icon</desc>
@ -29,14 +29,14 @@
<label for="mobile-menu-toggle"><a class="menu-button no-underline">&#9776;</a></label>
<input id="mobile-menu-toggle" type="checkbox"/>
<ul class="mobile-nav-link">
<div class="searchContainer">
<div class="search-container">
<form id="searchFormMob" method="post" action="https://duckduckgo.com/" target="_blank" rel="noopener external nofollow noreferrer">
<input type="text" name="q" class="searchBox" id="searchTxtMob" placeholder="Search..." title="Powered by DuckDuckGo">
<input type="text" name="q" class="search-box" placeholder="Search..." title="Powered by DuckDuckGo">
<input type="hidden" name="sites" value="<%- config.url.replace(/^http(s)?:\/\//, '') %>">
<input type="hidden" name="kd" value="-1">
<input type="hidden" name="kg" value="p">
<input type="hidden" name="kae" value="#000">
<a class="searchBtn no-underline" id="searchClickMob">
<a class="search-button no-underline" id="search-click-mobile">
<svg viewBox="0 0 512 512">
<title>Powered by DuckDuckGo</title>
<desc>Search icon</desc>

14
themes/chameleon/source/css/chameleon.css
View File

@ -648,7 +648,7 @@ td {
}
/* search bar */
.searchContainer {
.search-container {
border-radius: 5px;
width: 10em;
background: var(--alt-bg-color);
@ -660,13 +660,13 @@ td {
}
/* inline-block to position them in same line */
.searchBox,
.searchBtn{
.search-box,
.search-button{
display:inline-block;
}
/* hide the border and fill the height to parent's */
.searchBox {
.search-box {
border: 0;
border-radius: 5px;
height:1.8em;
@ -678,19 +678,19 @@ td {
/*
* Override sanitize/forms
* to prevent conflict with
* .searchBox padding-left
* .search-box padding-left
*/
input {
padding: 0;
}
/* highlight the text box when focused */
.searchBox:focus {
.search-box:focus {
border: 1px solid var(--link-underline);
}
/* align the button to center */
.searchBtn {
.search-button {
width: 10%;
position: absolute;
top: 45%;

4
themes/chameleon/source/js/chameleon.js
View File

@ -1,9 +1,9 @@
// Search button function
document.getElementById('searchClick').addEventListener('click', () => {
document.getElementById('search-click').addEventListener('click', () => {
searchForm.submit()
}, false)
document.getElementById('searchClickMob').addEventListener('click', () => {
document.getElementById('search-click-mobile').addEventListener('click', () => {
searchFormMob.submit()
}, false)