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> <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"> <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="sites" value="<%- config.url.replace(/^http(s)?:\/\//, '') %>">
<input type="hidden" name="kd" value="-1"> <input type="hidden" name="kd" value="-1">
<input type="hidden" name="kg" value="p"> <input type="hidden" name="kg" value="p">
<input type="hidden" name="kae" value="#000"> <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"> <svg viewBox="0 0 512 512">
<title>Powered by DuckDuckGo</title> <title>Powered by DuckDuckGo</title>
<desc>Search icon</desc> <desc>Search icon</desc>
@ -29,14 +29,14 @@
<label for="mobile-menu-toggle"><a class="menu-button no-underline">&#9776;</a></label> <label for="mobile-menu-toggle"><a class="menu-button no-underline">&#9776;</a></label>
<input id="mobile-menu-toggle" type="checkbox"/> <input id="mobile-menu-toggle" type="checkbox"/>
<ul class="mobile-nav-link"> <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"> <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="sites" value="<%- config.url.replace(/^http(s)?:\/\//, '') %>">
<input type="hidden" name="kd" value="-1"> <input type="hidden" name="kd" value="-1">
<input type="hidden" name="kg" value="p"> <input type="hidden" name="kg" value="p">
<input type="hidden" name="kae" value="#000"> <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"> <svg viewBox="0 0 512 512">
<title>Powered by DuckDuckGo</title> <title>Powered by DuckDuckGo</title>
<desc>Search icon</desc> <desc>Search icon</desc>

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

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

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

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