ページナビをいい感じに装飾
WordPressのアーカイブにおけるページナビゲーションをスマホも含めていい感じにする
@charset "utf-8";
.page_navi{
margin: 0;
text-align: center;
li{
list-style: none;
display: inline-block;
&.current{
padding: 5px 10px;
border: 1px solid #ccc;
font-size: rem-calc(12);
}
a{
display: block;
padding: 5px 10px;
background-color: $vapor;
font-size: rem-calc(12);
&:hover{
background-color: #000;
color: #fff;
}
}
&.first{
display: none;
}
&.last{
display: none;
}
}
}
@media #{$medium-up} {
.page_navi{
li{
&.current{
padding: 10px 20px;
}
a{
padding: 10px 20px;
}
}
}
}
<?php if ( class_exists( 'WP_SiteManager_page_navi' ) ) { WP_SiteManager_page_navi::page_navi('items=5'); } ?>