Begins implementation of new search form.
This commit is contained in:
mateuswetah
parent
5ecbddeee1
commit
bfc1eab9f2
|
|
@ -0,0 +1,24 @@
|
|||
function onTainacanSearchSubmit($event) {
|
||||
|
||||
if (document['tainacan-search-form']) {
|
||||
|
||||
if (document['tainacan-search-form'].archive && defined ( 'TAINACAN_VERSION' )) {
|
||||
switch (document['tainacan-search-form'].archive.value) {
|
||||
case 'tainacan-items':
|
||||
document['tainacan-search-form'].action = tainacan_plugin.theme_items_list_url + (document['tainacan-search-form'].s ? '?search=' + document['tainacan-search-form'].s.value : '');
|
||||
break;
|
||||
case 'tainacan-collections':
|
||||
document['tainacan-search-form'].action = tainacan_plugin.theme_collection_list_url + (document['tainacan-search-form'].s ? '?s=' + document['tainacan-search-form'].s.value : '');
|
||||
break;
|
||||
case 'posts':
|
||||
default:
|
||||
document['tainacan-search-form'].action = '/' + (document['tainacan-search-form'].s ? '?s=' + document['tainacan-search-form'].s.value : '');
|
||||
}
|
||||
} else {
|
||||
document['tainacan-search-form'].action = '/' + (document['tainacan-search-form'].s ? '?s=' + document['tainacan-search-form'].s.value : '');
|
||||
}
|
||||
|
||||
$event.preventDefault();
|
||||
}
|
||||
return true;
|
||||
}
|
||||
|
|
@ -866,7 +866,7 @@
|
|||
h4,
|
||||
label {
|
||||
color: #454647;
|
||||
font-size: 0.875rem;
|
||||
font-size: 0.85rem;
|
||||
font-weight: 500;
|
||||
padding-right: 0.875rem;
|
||||
width: 100%;
|
||||
|
|
|
|||
|
|
@ -263,16 +263,25 @@ nav{
|
|||
}
|
||||
}
|
||||
}
|
||||
.tainacan-search-form {
|
||||
.form-control {
|
||||
height: 27px;
|
||||
font-size: 0.875rem;
|
||||
font-weight: 400;
|
||||
color: #898d8f;
|
||||
@keyframes searchFormAppear {
|
||||
from {
|
||||
max-height: 0px;
|
||||
max-height: 0vh;
|
||||
opacity: 0;
|
||||
width: 32px;
|
||||
right: 0px;
|
||||
}
|
||||
to {
|
||||
opacity: 1.0;
|
||||
max-height: 400px;
|
||||
max-height: 100vh;
|
||||
width: 260px;
|
||||
right: -4px;
|
||||
}
|
||||
}
|
||||
.tainacan-form-dropdown {
|
||||
#dropdownMenuLink {
|
||||
padding-right: 0.25rem !important;
|
||||
&::after {
|
||||
content: none;
|
||||
}
|
||||
|
|
@ -282,26 +291,64 @@ nav{
|
|||
.tainacan-icon-close { display: none; }
|
||||
}
|
||||
> .dropdown-menu {
|
||||
top: calc(100% + 2px);
|
||||
right: 0;
|
||||
width: 204px;
|
||||
height: 27px;
|
||||
top: 0;
|
||||
right: -4px;
|
||||
width: 260px;
|
||||
height: auto;
|
||||
padding: 0;
|
||||
left: inherit;
|
||||
overflow: hidden;
|
||||
|
||||
.input-group {
|
||||
border: 0;
|
||||
background: white;
|
||||
padding: 0rem;
|
||||
align-items: center;
|
||||
height: 2.75rem;
|
||||
}
|
||||
.form-control {
|
||||
height: 100%;
|
||||
border-radius: 0;
|
||||
font-size: 0.875rem;
|
||||
font-weight: 400;
|
||||
color: #898d8f;
|
||||
padding-right: 2rem;
|
||||
|
||||
&:focus {
|
||||
color: #454647;
|
||||
box-shadow: none;
|
||||
border: 1px solid #555758 !important;
|
||||
}
|
||||
}
|
||||
.search-controls {
|
||||
background: #f2f2f2;
|
||||
border-bottom: 1px solid #dee2e6;
|
||||
border-left: 1px solid #dee2e6;
|
||||
border-right: 1px solid #dee2e6;
|
||||
padding: 0.75rem 0.875rem 0.125rem 0.875rem;
|
||||
font-size: 0.75rem;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
label {
|
||||
white-space: nowrap;
|
||||
display: flex;
|
||||
input {
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
&.show {
|
||||
animation: searchFormAppear 0.4s ease;
|
||||
}
|
||||
}
|
||||
|
||||
&.show {
|
||||
.input-group-append { display: none !important; }
|
||||
.tainacan-icon-search { display: none; }
|
||||
.tainacan-icon-close { display: block !important; }
|
||||
.tainacan-icon-close {
|
||||
position: relative;
|
||||
z-index: 999999;
|
||||
display: block !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
.dropdown-item:hover {
|
||||
|
|
@ -316,7 +363,9 @@ nav{
|
|||
|
||||
> li{
|
||||
&.menu-item {
|
||||
padding-left: 42px;
|
||||
@media screen and (min-width: 769px){
|
||||
padding-left: 42px;
|
||||
}
|
||||
|
||||
a {
|
||||
font-size: 0.875rem;
|
||||
|
|
@ -358,6 +407,7 @@ nav{
|
|||
@media only screen and (max-width: 1024px) {
|
||||
padding-right: 4.1666667%;
|
||||
padding-right: 4.1666667vw;
|
||||
padding-left: 0;
|
||||
}
|
||||
@media only screen and (max-width: 768px) {
|
||||
padding-right: 0;
|
||||
|
|
@ -383,8 +433,8 @@ nav{
|
|||
}
|
||||
@media only screen and (max-width: 768px) {
|
||||
position: absolute;
|
||||
top: 42px;
|
||||
right: 0;
|
||||
top: 48px;
|
||||
right: -24px;
|
||||
border: 1px solid #dbdbdb;
|
||||
background-color: #fff;
|
||||
z-index: 3;
|
||||
|
|
@ -471,9 +521,7 @@ nav{
|
|||
margin-right: 32px !important;
|
||||
}
|
||||
|
||||
.tainacan-icon-menu,
|
||||
.tainacan-icon-close {
|
||||
margin-top: -4px;
|
||||
.tainacan-icon {
|
||||
color: #01295C !important;
|
||||
}
|
||||
|
||||
|
|
@ -493,69 +541,6 @@ nav{
|
|||
border-bottom: 1px solid #ededed !important;
|
||||
}
|
||||
|
||||
.tainacan-search-form {
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
position: relative;
|
||||
|
||||
.input-group {
|
||||
transition: all 0.35s, border-radius 0s;
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
cursor: pointer;
|
||||
background-color: #fff;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
overflow: hidden;
|
||||
border: 1px solid transparent;
|
||||
//box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset;
|
||||
//border-radius: 25px;
|
||||
//border: 1px solid #ccc;
|
||||
.form-control {
|
||||
//margin-left: -25px;
|
||||
border:none;
|
||||
background: transparent;
|
||||
box-shadow: none;
|
||||
display:block;
|
||||
padding: 1rem 2rem;
|
||||
padding-left: 1rem;
|
||||
&::-webkit-input-placeholder {
|
||||
display: none;
|
||||
}
|
||||
&:-moz-placeholder {
|
||||
/* Firefox 18- */
|
||||
display: none;
|
||||
}
|
||||
&:-ms-input-placeholder {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
&:hover, &.hover {
|
||||
width: 350px;
|
||||
//border-radius: 25px 25px 25px 25px;
|
||||
border: 1px solid #ccc;
|
||||
}
|
||||
.form-control-feedback {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
display: block;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
text-align: center;
|
||||
font-size: 1.1875rem;
|
||||
|
||||
&:before {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%,-50%);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.page-header {
|
||||
height: 200px;
|
||||
|
|
|
|||
|
|
@ -191,12 +191,9 @@ add_action( 'admin_head', 'tainacan_customize_editor_css');
|
|||
* @param object $query The main WordPress query.
|
||||
*/
|
||||
function tainacan_include_items_in_search_results( $query ) {
|
||||
|
||||
if ( get_theme_mod( 'tainacan_search_include_items', false ) ) {
|
||||
if ( $query->is_main_query() && $query->is_search() && ! is_admin() ) {
|
||||
$collections_post_types = \Tainacan\Repositories\Repository::get_collections_db_identifiers();
|
||||
$query->set( 'post_type', array_merge( ['post'], $collections_post_types ) );
|
||||
}
|
||||
if ( $query->is_main_query() && $query->is_search() && ! is_admin()) {
|
||||
$collections_post_types = \Tainacan\Repositories\Repository::get_collections_db_identifiers();
|
||||
$query->set( 'post_type', array_merge( ['post'], $collections_post_types ) );
|
||||
}
|
||||
}
|
||||
add_action( 'pre_get_posts', 'tainacan_include_items_in_search_results' );
|
||||
|
|
|
|||
|
|
@ -58,6 +58,7 @@ if ( ! function_exists( 'tainacan_enqueues' ) ) {
|
|||
wp_register_script( 'tainacan_tainacanJS', get_template_directory_uri() . '/assets/js/js.js', '', TAINACAN_INTERFACE_VERSION, true );
|
||||
wp_enqueue_script( 'tainacan_tainacanJS' );
|
||||
|
||||
wp_enqueue_script( 'tainacan_searchBarRedirect', get_template_directory_uri() . '/assets/js/search-bar-redirect.js', [] , TAINACAN_INTERFACE_VERSION, false );
|
||||
wp_enqueue_script( 'tainacan_copyLink', get_template_directory_uri() . '/assets/js/copy-link.js', [] , TAINACAN_INTERFACE_VERSION, false );
|
||||
wp_localize_script( 'tainacan_copyLink', 'tainacan_copyLinkVars', array(
|
||||
'linkCopied' => __( 'Copied! Link sent to the transfer area.', 'tainacan-interface' )
|
||||
|
|
|
|||
|
|
@ -19,9 +19,7 @@
|
|||
<?php if ( has_nav_menu( 'navMenubelowHeader' ) ) : ?>
|
||||
<nav class="navbar navbar-expand-md navbar-light px-0 menu-belowheader" role="navigation">
|
||||
<div class="container-fluid max-large px-0 margin-one-column">
|
||||
<!-- Brand and toggle get grouped for better mobile display -->
|
||||
<!-- <a class="navbar-brand d-md-none" href="#"></a> -->
|
||||
<button class="navbar-toggler text-heavy-metal border-0 px-2 pt-2 collapsed" type="button" data-toggle="collapse" data-target="#menubelowHeader" aria-controls="menubelowHeader" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<button class="navbar-toggler text-heavy-metal border-0 p-2 collapsed" type="button" data-toggle="collapse" data-target="#menubelowHeader" aria-controls="menubelowHeader" aria-expanded="false" aria-label="<?php _e('Open navigation menu', 'tainacan-interface') ?>">
|
||||
<span class="tainacan-icon tainacan-icon-menu"></span>
|
||||
<span class="tainacan-icon tainacan-icon-close"></span>
|
||||
</button>
|
||||
|
|
@ -43,19 +41,11 @@
|
|||
<div class="btn-group" style="padding: 0.6rem 0rem;">
|
||||
|
||||
<?php if (!get_theme_mod('tainacan_hide_search_input', false)) : ?>
|
||||
<form class="form-horizontal my-2 my-md-0 tainacan-search-form d-none d-md-block" [formGroup]="searchForm" role="form" (keyup.enter)="onSubmit()" action="<?php echo esc_url( home_url( '/' ) ); ?>">
|
||||
<div class="input-group">
|
||||
<input type="text" name="s" placeholder="<?php esc_attr_e( 'Search', 'tainacan-interface' ); ?>" class="form-control" formControlName="searchText" size="50">
|
||||
<span class="text-midnight-blue input-group-btn icon form-control-feedback">
|
||||
<i class="tainacan-icon tainacan-icon-search"></i>
|
||||
</span>
|
||||
</div>
|
||||
</form>
|
||||
<div class="dropdown tainacan-form-dropdown d-md-none">
|
||||
<a class="btn btn-link text-midnight-blue px-1 dropdown-toggle" href="#" role="button" id="dropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
||||
<div class="dropdown tainacan-form-dropdown">
|
||||
<button class="btn btn-link text-midnight-blue px-1 dropdown-toggle" type="button" role="button" id="dropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
||||
<i class="tainacan-icon tainacan-icon-search"></i>
|
||||
<i class="tainacan-icon tainacan-icon-close"></i>
|
||||
</a>
|
||||
</button>
|
||||
<div class="dropdown-menu" aria-labelledby="dropdownMenuLink">
|
||||
<?php get_search_form(); ?>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,10 +1,44 @@
|
|||
<form role="search" method="get" class="search-form" action="<?php echo esc_url( home_url( '/' ) ); ?>">
|
||||
<div class="input-group border">
|
||||
<input class="form-control py-2 border-0" type="search" name="s" placeholder="<?php esc_attr_e( 'Search', 'tainacan-interface' ); ?>" id="tainacan-search">
|
||||
<form role="search" method="post" name="tainacan-search-form" class="search-form" onsubmit="return onTainacanSearchSubmit()">
|
||||
<div class="input-group">
|
||||
<input class="form-control py-2" type="search" name="s" placeholder="<?php esc_attr_e( 'Search', 'tainacan-interface' ); ?>" id="tainacan-search">
|
||||
<span class="input-group-append d-none d-md-block">
|
||||
<button class="btn btn-outline-secondary border-0 border bg-white" type="submit">
|
||||
<button class="btn btn-outline-secondary bg-white" type="submit">
|
||||
<i class="tainacan-icon tainacan-icon-search" style="line-height: inherit;"></i>
|
||||
</button>
|
||||
</span>
|
||||
</div>
|
||||
<?php if ( defined ( 'TAINACAN_VERSION' ) ) : ?>
|
||||
<div class="search-controls">
|
||||
|
||||
<label for="search-on-posts">
|
||||
<input
|
||||
type="radio"
|
||||
value="posts"
|
||||
name="archive"
|
||||
checked="checked"
|
||||
id="search-on-posts">
|
||||
<?php _e( 'Site posts', 'tainacan-interface' ); ?>
|
||||
</label>
|
||||
|
||||
<label for="search-on-items">
|
||||
<input
|
||||
type="radio"
|
||||
value="tainacan-items"
|
||||
name="archive"
|
||||
formaction="/items"
|
||||
id="search-on-items">
|
||||
<?php _e( 'Archive items', 'tainacan-interface' ); ?>
|
||||
</label>
|
||||
|
||||
<label for="search-on-collections">
|
||||
<input
|
||||
type="radio"
|
||||
value="tainacan-collections"
|
||||
name="archive"
|
||||
formaction="/collections"
|
||||
id="search-on-collections">
|
||||
<?php _e( 'Archive collections', 'tainacan-interface' ); ?>
|
||||
</label>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
</form>
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
Loading…
Reference in New Issue