05bdb5e2 by Jeff Balicki

search

Signed-off-by: Jeff <jeff@gotenzing.com>
1 parent 8bdb6906
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
<?php
/**
* The template for displaying search results pages
*
* @package Understrap
*/
// Exit if accessed directly.
defined( 'ABSPATH' ) || exit;
get_header();
$container = get_theme_mod( 'understrap_container_type' );
?>
<div class="wrapper" id="search-wrapper">
<div class="<?php echo esc_attr( $container ); ?> container" id="content" tabindex="-1">
<h1 class="sh1"><?php _e("Search results for:", 'msf'); ?></h1>
<?php //get_search_form() ?>
<?php echo do_shortcode('[searchandfilter slug="what-are-you-looking-for-today"]'); ?>
<?php //echo do_shortcode('[searchandfilter id="21964"]'); ?>
<button class="btn btn-primary filter" data-bs-toggle="collapse" data-bs-target="#search-sidebar" role="button" aria-expanded="false" aria-controls="search-sidebar" >
<?php _e("SORT AND FILTER", 'msf'); ?>
</button>
<div class="search-wrapper row">
<div class="col-sm-12 col-md-3 widget-area collapse" id="search-sidebar">
<?php echo do_shortcode('[searchandfilter slug="search"]'); ?>
<button class="btn btn-primary filter apply-filters" data-bs-toggle="collapse" data-bs-target="#search-sidebar" role="button" aria-expanded="false" aria-controls="search-sidebar" >
<?php _e("APPLY FILTERS", 'msf'); ?>
</button>
</div>
<main class="col-sm-12 col-md-9 content-area site-main search-result" id="main">
<?php if ( have_posts() ) :
global $wp_query;
?>
<header class="page-header">
<h3 class="page-title">
<?php
printf(
/* translators: %s: query term */
esc_html__( 'SHOWING: %s', 'understrap' ),
'<span>' .$wp_query->found_posts. '</span>'
);
?>
</h3>
</header><!-- .page-header -->
<?php /* Start the Loop */ ?>
<?php
while ( have_posts() ) :
the_post();
/*
* Run the loop for the search to output the results.
* If you want to overload this in a child theme then include a file
* called content-search.php and that will be used instead.
*/
get_template_part( 'loop-templates/content', 'search' );
endwhile;
?>
<?php else : ?>
<?php get_template_part( 'loop-templates/content', 'none' ); ?>
<?php endif; ?>
</main><!-- #main -->
<!-- The pagination component -->
</div>
<!-- The pagination component -->
<?php understrap_pagination(); ?>
</div><!-- #content -->
</div><!-- #search-wrapper -->
<?php
get_footer();
<?php
/**
* The template for displaying search forms
*
* @package Understrap
*/
// Exit if accessed directly.
defined( 'ABSPATH' ) || exit;
$bootstrap_version = get_theme_mod( 'understrap_bootstrap_version', 'bootstrap4' );
$uid = wp_unique_id( 's-' ); // The search form specific unique ID for the input.
$aria_label = '';
if ( isset( $args['aria_label'] ) && ! empty( $args['aria_label'] ) ) {
$aria_label = 'aria-label="' . esc_attr( $args['aria_label'] ) . '"';
}
?>
<div class="side-menu input-group">
<?php echo do_shortcode('[searchandfilter slug="what-are-you-looking-for-today"]'); ?>
</div>
<!-- <form role="search" class="search-form" method="get" action="<?php echo esc_url( home_url( '/' ) ); ?>" <?php echo $aria_label; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped -- Escaped above. ?>>
<label class="screen-reader-text" for="<?php echo $uid; ?>"><?php echo esc_html_x( 'Search for:', 'label', 'understrap' ); ?></label>
<div class="input-group">
<input type="hidden" class="field search-field form-control" id="<?php echo $uid; ?>" name="s" value="<?php the_search_query(); ?>" placeholder="<?php echo esc_attr_x( 'Search &hellip;', 'placeholder', 'understrap' ); ?>">
<input type="search" class="field search-field form-control" name="_sf_s" value="<?php echo $_GET['_sf_s']; ?>" placeholder="<?php echo esc_attr_x( 'Search &hellip;', 'placeholder', 'understrap' ); ?>">
<?php if ( 'bootstrap5' === $bootstrap_version ) : ?>
<input type="submit" class="submit search-submit btn btn-primary" name="submit" value="<?php echo esc_attr_x( 'OK', 'submit button', 'understrap' ); ?>">
<?php else : ?>
<span class="input-group-append">
<input type="submit" class="submit search-submit btn btn-primary" name="submit" value="<?php echo esc_attr_x( 'OK', 'submit button', 'understrap' ); ?>">
</span>
<?php endif; ?>
</div>
</form> -->
<?php
......@@ -5,4 +5,9 @@ body{
@import "menu";
@import "header";
@import "search";
@import "custom_select";
@import "forms";
@import "elements";
@import "front_page";
......
.select {
&:after {
content:'';
display: block;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16.175' height='9.808' viewBox='0 0 16.175 9.808'%3E%3Cpath id='Path_1396' data-name='Path 1396' d='M19.409 190.005c.561-.568 1.11-1.13 1.667-1.686q2-2 4.01-4a.9.9 0 0 1 1.329 0c.254.261.515.516.772.774a.881.881 0 0 1-.005 1.318q-1.8 1.8-3.605 3.606-1.748 1.75-3.495 3.5a.975.975 0 0 1-.654.312.931.931 0 0 1-.719-.31q-1.349-1.354-2.7-2.706-1.836-1.838-3.674-3.675c-.25-.25-.5-.5-.75-.75A.876.876 0 0 1 11.6 185.1l.766-.766a.9.9 0 0 1 1.348 0l3.252 3.24 2.355 2.345C19.339 189.941 19.363 189.962 19.409 190.005Z' transform='translate(-11.305 -184.028)'/%3E%3C/svg%3E");
background-size: contain;
background-repeat: no-repeat;
width: 1rem;
height: 0.5rem;
position: absolute;
right: 0;
}
&:hover {
&:after {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16.175' height='9.808' viewBox='0 0 16.175 9.808'%3E%3Cpath id='Path_1396' data-name='Path 1396' d='M19.409 190.005c.561-.568 1.11-1.13 1.667-1.686q2-2 4.01-4a.9.9 0 0 1 1.329 0c.254.261.515.516.772.774a.881.881 0 0 1-.005 1.318q-1.8 1.8-3.605 3.606-1.748 1.75-3.495 3.5a.975.975 0 0 1-.654.312.931.931 0 0 1-.719-.31q-1.349-1.354-2.7-2.706-1.836-1.838-3.674-3.675c-.25-.25-.5-.5-.75-.75A.876.876 0 0 1 11.6 185.1l.766-.766a.9.9 0 0 1 1.348 0l3.252 3.24 2.355 2.345C19.339 189.941 19.363 189.962 19.409 190.005Z' transform='translate(-11.305 -184.028)' fill='%23699'/%3E%3C/svg%3E");
background-size: contain;
background-repeat: no-repeat;
}
}
}
// Learn about this solution to creating custom select styles:
// @link https://moderncss.dev/custom-select-styles-with-pure-css/
select {
// A reset of styles, including removing the default dropdown arrow
appearance: none;
background-color: transparent;
border: none;
margin: 0;
width: 100%;
font-family: inherit;
font-size: inherit;
cursor: inherit;
line-height: inherit;
color:#4D4D4D;
font-family: "PT Sans",sans-serif;
font-size: 1rem;
// Stack above custom arrow
z-index: 1;
// Remove dropdown arrow in IE10 & IE11
// @link https://www.filamentgroup.com/lab/select-css.html
&::-ms-expand {
display: none;
}
// Remove focus outline, will add on alternate element
outline: none;
}
.select {
display: grid;
grid-template-areas: "select";
align-items: center;
position: relative;
select,
&::after {
grid-area: select;
}
select {
border: 0 !important;
}
min-width: 15ch;
max-width: 30ch;
padding: 0.506rem;
font-size: 1rem;
cursor: pointer;
line-height: 1.1;
// Optional styles
// remove for transparency
background-color: #fff;
border:1px solid #BEBEBE;
}
// Interim solution until :focus-within has better support
select:focus + .focus {
position: absolute;
top: -1px;
left: -1px;
right: -1px;
bottom: -1px;
border: 2px solid var(--select-focus);
border-radius: inherit;
}
select[multiple] {
padding-right: 0;
}
\ No newline at end of file
body {
font-family: "PT Sans",sans-serif;
}
* {
font-family: "PT Sans",sans-serif;
-webkit-font-smoothing: antialiased;
}
a.skip-link {
display: none;
left:0;
opacity: 0;
&:focus {
opacity: 1;
}
}
.fr-only {
display: none !important;
}
html:lang(fr-FR) {
.en-only {
display: none !important;
}
.fr-only {
display: inline-block !important;
}
}
......@@ -45,7 +45,7 @@
padding-left: 0px;
}
.searchandfilter h4{
font-size: 45px;
font-size: 45px !important;
line-height: 53px;
text-align: center;
font-weight: lighter;
......