continuing work on pagination

This commit is contained in:
Jonas Heinrich 2020-04-21 18:11:36 +02:00
parent c657879840
commit 0ecd2e5efc
5 changed files with 169 additions and 133 deletions

133
kit/css/search.css Normal file
View file

@ -0,0 +1,133 @@
.tx-indexedsearch .tx-indexedsearch-searchbox form fieldset .tx-indexedsearch-form {
display: inline-block;
vertical-align: bottom;
}
.tx-indexedsearch .tx-indexedsearch-searchbox form fieldset .tx-indexedsearch-form label {
display: block;
}
.tx-indexedsearch .tx-indexedsearch-searchbox form fieldset .tx-indexedsearch-form input {
width: 100%;
max-width: 400px;
padding: 12px;
border: none;
line-height: 1.3;
background-color: #eeeeee;
}
.tx-indexedsearch .tx-indexedsearch-searchbox form fieldset .tx-indexedsearch-form input:focus {
outline: 0 none;
}
.tx-indexedsearch .tx-indexedsearch-searchbox form fieldset .tx-indexedsearch-search-submit {
display: inline-block;
}
.tx-indexedsearch .tx-indexedsearch-searchbox form fieldset .tx-indexedsearch-search-submit button {
max-width: 200px;
padding: 15px 20px;
border: none;
color: #eeeeee;
font-size: 16px;
font-weight: 400;
line-height: 1.3;
text-decoration: none;
text-transform: uppercase;
vertical-align: bottom;
border-radius: 0;
outline: none;
user-select: none;
transition: background-color .2s;
}
@media screen and (max-width: 1280px) {
.tx-indexedsearch .tx-indexedsearch-searchbox form fieldset .tx-indexedsearch-search-submit button {
padding: 12px 20px;
}
}
@media screen and (max-width: 560px) {
.tx-indexedsearch .tx-indexedsearch-searchbox form fieldset .tx-indexedsearch-search-submit button {
margin: 15px 0;
}
}
.tx-indexedsearch .tx-indexedsearch-searchbox form fieldset .tx-indexedsearch-search-submit button:hover {
text-decoration: none;
background-color: #333333;
}
.tx-indexedsearch .tx-indexedsearch-browsebox {
margin-top: 15px;
}
.tx-indexedsearch .tx-indexedsearch-browsebox > * + * {
margin-top: 30px;
}
.tx-indexedsearch .tx-indexedsearch-browsebox ul {
display: block;
margin-top: 0;
}
.tx-indexedsearch .tx-indexedsearch-browsebox ul li {
display: inline-block;
padding-left: 0;
margin-right: 20px;
}
.tx-indexedsearch .tx-indexedsearch-browsebox ul li:last-child {
margin-right: 0;
}
.tx-indexedsearch .tx-indexedsearch-browsebox ul li::before {
display: none;
}
.tx-indexedsearch .tx-indexedsearch-browsebox ul li a, .tx-indexedsearch .tx-indexedsearch-browsebox ul li span {
padding: 10px 15px;
color: #eeeeee;
background-color: #333333;
transition: background-color .3s;
}
.tx-indexedsearch .tx-indexedsearch-res {
padding: 30px 0;
}
.tx-indexedsearch .tx-indexedsearch-res .tx-indexedsearch-title a {
transition: color .3s;
}
.tx-indexedsearch .tx-indexedsearch-res .tx-indexedsearch-description strong {
font-weight: 400;
background-color: rgba(0, 153, 130, 0.1);
}
.tx-indexedsearch .tx-indexedsearch-res .link-more {
display: inline-block;
margin-top: 10px;
text-decoration: none;
}
.tx-indexedsearch .tx-indexedsearch-res .link-more span {
transition: color .3s;
}
.tx-indexedsearch .tx-indexedsearch-res .link-more span::after {
content: url(img/arrow-right-grey.svg);
position: absolute;
width: 17px;
margin-left: 10px;
transition: transform .3s;
}
.tx-indexedsearch .tx-indexedsearch-res .link-more span:hover::after {
transform: translateX(3px);
}
h2.screen-reader-text {
display: none;
}

View file

@ -194,7 +194,7 @@ function kit_customize_css()
background-color: <?php echo get_theme_mod('theme_color', '#009982'); ?>; background-color: <?php echo get_theme_mod('theme_color', '#009982'); ?>;
} }
.tx-indexedsearch .tx-indexedsearch-browsebox ul li.tx-indexedsearch-browselist-currentPage a { .tx-indexedsearch .tx-indexedsearch-browsebox ul li.current a {
background-color: <?php echo get_theme_mod('theme_color', '#009982'); ?>; background-color: <?php echo get_theme_mod('theme_color', '#009982'); ?>;
} }
@ -251,3 +251,11 @@ function kit_customize_css()
<?php <?php
} }
add_action( 'wp_head', 'kit_customize_css'); add_action( 'wp_head', 'kit_customize_css');
function kit_modify_posts_per_page( $query ) {
if ( $query->is_search() ) {
$query->set( 'posts_per_page', '10' );
}
}
add_action( 'pre_get_posts', 'kit_modify_posts_per_page' );

View file

@ -18,6 +18,7 @@
<link rel="stylesheet" type="text/css" href="<?php bloginfo('stylesheet_directory');?>/css/header.css" media="all"> <link rel="stylesheet" type="text/css" href="<?php bloginfo('stylesheet_directory');?>/css/header.css" media="all">
<link rel="stylesheet" type="text/css" href="<?php bloginfo('stylesheet_directory');?>/css/menu.css" media="all"> <link rel="stylesheet" type="text/css" href="<?php bloginfo('stylesheet_directory');?>/css/menu.css" media="all">
<link rel="stylesheet" type="text/css" href="<?php bloginfo('stylesheet_directory');?>/css/footer.css" media="all"> <link rel="stylesheet" type="text/css" href="<?php bloginfo('stylesheet_directory');?>/css/footer.css" media="all">
<link rel="stylesheet" type="text/css" href="<?php bloginfo('stylesheet_directory');?>/css/search.css" media="all">
<script src="<?php bloginfo('stylesheet_directory');?>/js/jquery-3.js" type="text/javascript"></script> <script src="<?php bloginfo('stylesheet_directory');?>/js/jquery-3.js" type="text/javascript"></script>
<script src="<?php bloginfo('stylesheet_directory');?>/js/js.js" type="text/javascript" async="async"></script> <script src="<?php bloginfo('stylesheet_directory');?>/js/js.js" type="text/javascript" async="async"></script>

View file

@ -72,11 +72,32 @@ get_header();
</div> </div>
<?php endwhile; ?> <?php endwhile; ?>
<div class="tx-indexedsearch-browsebox">
<?php the_posts_pagination( array(
'mid_size' => 2,
'prev_text' => __( '< Zurück', 'textdomain' ),
'next_text' => __( 'Nächste >', 'textdomain' ),
'type' => 'list',
'before_page_number' => 'Seite ',
) ); ?>
</div>
<div class="tx-indexedsearch-browsebox">
<ul class="tx-indexedsearch-browsebox"><li class="tx-indexedsearch-browselist-currentPage"><strong><a href="#" onclick="document.getElementById('tx_indexedsearch_pointer').value='0';document.getElementById('tx_indexedsearch').submit();return false;">Seite 1</a></strong></li><li><a href="#" onclick="document.getElementById('tx_indexedsearch_pointer').value='1';document.getElementById('tx_indexedsearch').submit();return false;">Seite 2</a></li><li><a href="#" onclick="document.getElementById('tx_indexedsearch_pointer').value='1';document.getElementById('tx_indexedsearch').submit();return false;">Nächste &gt;</a></li></ul> <!-- <ul class="tx-indexedsearch-browsebox">
</div> <li class="tx-indexedsearch-browselist-currentPage">
<strong>
<a href="#" onclick="document.getElementById('tx_indexedsearch_pointer').value='0';document.getElementById('tx_indexedsearch').submit();return false;">Seite 1</a>
</strong>
</li>
<li>
<a href="#" onclick="document.getElementById('tx_indexedsearch_pointer').value='1';document.getElementById('tx_indexedsearch').submit();return false;">Seite 2</a>
</li>
<li>
<a href="#" onclick="document.getElementById('tx_indexedsearch_pointer').value='1';document.getElementById('tx_indexedsearch').submit();return false;">Nächste &gt;</a>
</li>
</ul> -->
</div> </div>
@ -88,6 +109,8 @@ get_header();
</section> </section>
</main> </main>
<?php <?php

View file

@ -4739,133 +4739,4 @@ article > p:last-child {
width: 100%; width: 100%;
} }
.tx-indexedsearch .tx-indexedsearch-searchbox form fieldset .tx-indexedsearch-form {
display: inline-block;
vertical-align: bottom;
}
.tx-indexedsearch .tx-indexedsearch-searchbox form fieldset .tx-indexedsearch-form label {
display: block;
}
.tx-indexedsearch .tx-indexedsearch-searchbox form fieldset .tx-indexedsearch-form input {
width: 100%;
max-width: 400px;
padding: 12px;
border: none;
line-height: 1.3;
background-color: #eeeeee;
}
.tx-indexedsearch .tx-indexedsearch-searchbox form fieldset .tx-indexedsearch-form input:focus {
outline: 0 none;
}
.tx-indexedsearch .tx-indexedsearch-searchbox form fieldset .tx-indexedsearch-search-submit {
display: inline-block;
}
.tx-indexedsearch .tx-indexedsearch-searchbox form fieldset .tx-indexedsearch-search-submit button {
max-width: 200px;
padding: 15px 20px;
border: none;
color: #eeeeee;
font-size: 16px;
font-weight: 400;
line-height: 1.3;
text-decoration: none;
text-transform: uppercase;
vertical-align: bottom;
border-radius: 0;
outline: none;
user-select: none;
transition: background-color .2s;
}
@media screen and (max-width: 1280px) {
.tx-indexedsearch .tx-indexedsearch-searchbox form fieldset .tx-indexedsearch-search-submit button {
padding: 12px 20px;
}
}
@media screen and (max-width: 560px) {
.tx-indexedsearch .tx-indexedsearch-searchbox form fieldset .tx-indexedsearch-search-submit button {
margin: 15px 0;
}
}
.tx-indexedsearch .tx-indexedsearch-searchbox form fieldset .tx-indexedsearch-search-submit button:hover {
text-decoration: none;
background-color: #333333;
}
.tx-indexedsearch .tx-indexedsearch-browsebox {
margin-top: 15px;
}
.tx-indexedsearch .tx-indexedsearch-browsebox > * + * {
margin-top: 30px;
}
.tx-indexedsearch .tx-indexedsearch-browsebox ul {
display: block;
margin-top: 0;
}
.tx-indexedsearch .tx-indexedsearch-browsebox ul li {
display: inline-block;
padding-left: 0;
margin-right: 20px;
}
.tx-indexedsearch .tx-indexedsearch-browsebox ul li:last-child {
margin-right: 0;
}
.tx-indexedsearch .tx-indexedsearch-browsebox ul li::before {
display: none;
}
.tx-indexedsearch .tx-indexedsearch-browsebox ul li a {
padding: 10px 15px;
color: #eeeeee;
background-color: #333333;
transition: background-color .3s;
}
.tx-indexedsearch .tx-indexedsearch-res {
padding: 30px 0;
}
.tx-indexedsearch .tx-indexedsearch-res .tx-indexedsearch-title a {
transition: color .3s;
}
.tx-indexedsearch .tx-indexedsearch-res .tx-indexedsearch-description strong {
font-weight: 400;
background-color: rgba(0, 153, 130, 0.1);
}
.tx-indexedsearch .tx-indexedsearch-res .link-more {
display: inline-block;
margin-top: 10px;
text-decoration: none;
}
.tx-indexedsearch .tx-indexedsearch-res .link-more span {
transition: color .3s;
}
.tx-indexedsearch .tx-indexedsearch-res .link-more span::after {
content: url(img/arrow-right-grey.svg);
position: absolute;
width: 17px;
margin-left: 10px;
transition: transform .3s;
}
.tx-indexedsearch .tx-indexedsearch-res .link-more span:hover::after {
transform: translateX(3px);
}
/*# sourceMappingURL=main.css.map */ /*# sourceMappingURL=main.css.map */