mirror of
https://ghproxy.net/https://github.com/AlxMedia/blogcards.git
synced 2025-08-26 05:49:02 +08:00
Add search button to header
This commit is contained in:
parent
e212251318
commit
2af7f0c614
8 changed files with 158 additions and 102 deletions
3
dark.css
3
dark.css
|
@ -44,6 +44,9 @@ body:where(.dark) .themeform.searchform div:after { color: rgba(255,255,255,0.4)
|
|||
body:where(.dark) .social-links .social-tooltip:hover:after { background: #fff; color: #000; }
|
||||
body:where(.dark) .social-links .social-tooltip:hover:before { border-color: #fff transparent; }
|
||||
|
||||
body:where(.dark) .toggle-search .svg-icon { fill: #fff; }
|
||||
body:where(.dark) .toggle-search:focus #svg-search { fill: rgba(255,255,255,0.5); }
|
||||
|
||||
body:where(.dark) #footer { background: rgba(255,255,255,0.08); box-shadow: inset 0 1px 0 rgba(255,255,255,0.06); }
|
||||
|
||||
body:where(.dark) .slick-featured,
|
||||
|
|
|
@ -149,6 +149,7 @@ body.boxed #header { max-width: '.esc_attr( get_theme_mod('container-width') ).'
|
|||
// gradient left
|
||||
if ( get_theme_mod('gradient-left','#be1e1e') != '#be1e1e' ) {
|
||||
$styles .= '
|
||||
.search-expand,
|
||||
#theme-toggle-btn:before,
|
||||
.author-bio .bio-avatar:after,
|
||||
.commentlist li.bypostauthor > .comment-body:after,
|
||||
|
@ -161,6 +162,7 @@ body.boxed #header { max-width: '.esc_attr( get_theme_mod('container-width') ).'
|
|||
// gradient right
|
||||
if ( get_theme_mod('gradient-right','#ff0000') != '#ff0000' ) {
|
||||
$styles .= '
|
||||
.search-expand,
|
||||
#theme-toggle-btn:before,
|
||||
.author-bio .bio-avatar:after,
|
||||
.commentlist li.bypostauthor > .comment-body:after,
|
||||
|
|
|
@ -173,6 +173,15 @@ Kirki::add_field( 'blogcards_theme', array(
|
|||
'tags' => esc_html__( 'Related by tags', 'blogcards' ),
|
||||
),
|
||||
) );
|
||||
// Header: Search
|
||||
Kirki::add_field( 'blogcards_theme', array(
|
||||
'type' => 'switch',
|
||||
'settings' => 'header-search',
|
||||
'label' => esc_html__( 'Header Search', 'blogcards' ),
|
||||
'description' => esc_html__( 'Search button in header', 'blogcards' ),
|
||||
'section' => 'header',
|
||||
'default' => 'on',
|
||||
) );
|
||||
// Footer: Widget Columns
|
||||
Kirki::add_field( 'blogcards_theme', array(
|
||||
'type' => 'radio-image',
|
||||
|
|
43
header.php
43
header.php
|
@ -36,17 +36,40 @@
|
|||
<p class="site-description"><?php bloginfo( 'description' ); ?></p>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php if ( has_nav_menu('header') ): ?>
|
||||
<div id="wrap-nav-header" class="wrap-nav">
|
||||
<?php \Blogcards\Nav::nav_menu(array('theme_location'=>'header','menu_id' => 'nav-header','fallback_cb'=> false)); ?>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
<div class="header-right">
|
||||
|
||||
<?php if ( has_nav_menu('mobile') ): ?>
|
||||
<div id="wrap-nav-mobile" class="wrap-nav">
|
||||
<?php \Blogcards\Nav::nav_menu(array('theme_location'=>'mobile','menu_id' => 'nav-mobile','fallback_cb'=> false)); ?>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
<?php if ( has_nav_menu('header') ): ?>
|
||||
<div id="wrap-nav-header" class="wrap-nav">
|
||||
<?php \Blogcards\Nav::nav_menu(array('theme_location'=>'header','menu_id' => 'nav-header','fallback_cb'=> false)); ?>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php if ( has_nav_menu('mobile') ): ?>
|
||||
<div id="wrap-nav-mobile" class="wrap-nav">
|
||||
<?php \Blogcards\Nav::nav_menu(array('theme_location'=>'mobile','menu_id' => 'nav-mobile','fallback_cb'=> false)); ?>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php if ( get_theme_mod( 'header-search', 'on' ) == 'on' ): ?>
|
||||
<div class="header-search">
|
||||
<button class="toggle-search">
|
||||
<svg class="svg-icon" id="svg-search" aria-hidden="true" role="img" focusable="false" xmlns="http://www.w3.org/2000/svg" width="23" height="23" viewBox="0 0 23 23"><path d="M38.710696,48.0601792 L43,52.3494831 L41.3494831,54 L37.0601792,49.710696 C35.2632422,51.1481185 32.9839107,52.0076499 30.5038249,52.0076499 C24.7027226,52.0076499 20,47.3049272 20,41.5038249 C20,35.7027226 24.7027226,31 30.5038249,31 C36.3049272,31 41.0076499,35.7027226 41.0076499,41.5038249 C41.0076499,43.9839107 40.1481185,46.2632422 38.710696,48.0601792 Z M36.3875844,47.1716785 C37.8030221,45.7026647 38.6734666,43.7048964 38.6734666,41.5038249 C38.6734666,36.9918565 35.0157934,33.3341833 30.5038249,33.3341833 C25.9918565,33.3341833 22.3341833,36.9918565 22.3341833,41.5038249 C22.3341833,46.0157934 25.9918565,49.6734666 30.5038249,49.6734666 C32.7048964,49.6734666 34.7026647,48.8030221 36.1716785,47.3875844 C36.2023931,47.347638 36.2360451,47.3092237 36.2726343,47.2726343 C36.3092237,47.2360451 36.347638,47.2023931 36.3875844,47.1716785 Z" transform="translate(-20 -31)"></path></svg>
|
||||
</button>
|
||||
<div class="search-expand search-trap-focus">
|
||||
<div class="wrapper-inner">
|
||||
<div class="search-expand-inner">
|
||||
<?php get_search_form(); ?>
|
||||
<button class="toggle-search" data-target=".search-trap-focus">
|
||||
<svg class="svg-icon" id="svg-close" aria-hidden="true" role="img" focusable="false" xmlns="http://www.w3.org/2000/svg" width="23" height="23" viewBox="0 0 16 16"><polygon fill="" fill-rule="evenodd" points="6.852 7.649 .399 1.195 1.445 .149 7.899 6.602 14.352 .149 15.399 1.195 8.945 7.649 15.399 14.102 14.352 15.149 7.899 8.695 1.445 15.149 .399 14.102"></polygon></svg>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="header-search-overlay"></div>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
|
|
|
@ -14,8 +14,7 @@ jQuery(document).ready(function($) {
|
|||
/* Toggle header search
|
||||
/* ------------------------------------ */
|
||||
$('.toggle-search').on('click', function() {
|
||||
$('.toggle-search').toggleClass('active');
|
||||
$('.search-expand').fadeToggle(250);
|
||||
$('body').toggleClass('header-search-active');
|
||||
setTimeout(function(){
|
||||
$('.search-expand input').focus();
|
||||
}, 300);
|
||||
|
@ -27,22 +26,7 @@ jQuery(document).ready(function($) {
|
|||
$('html, body').animate({scrollTop:0},'slow');
|
||||
return false;
|
||||
});
|
||||
|
||||
/* Parallax single post featured image
|
||||
/* ------------------------------------ */
|
||||
$(window).scroll(function () {
|
||||
$(".main-header-single").css("background-position","center " + ($(this).scrollTop() / 20 + 50) + "%");
|
||||
});
|
||||
|
||||
$(window).scroll(function() {
|
||||
var scroll = $(window).scrollTop();
|
||||
if (scroll >= 60) {
|
||||
$('body').addClass("header-scrolled");
|
||||
} else {
|
||||
$('body').removeClass("header-scrolled");
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
/* Tabs widget
|
||||
/* ------------------------------------ */
|
||||
(function() {
|
||||
|
|
|
@ -2,7 +2,7 @@
|
|||
msgid ""
|
||||
msgstr ""
|
||||
"Project-Id-Version: Blogcards\n"
|
||||
"POT-Creation-Date: 2024-04-16 17:57+0200\n"
|
||||
"POT-Creation-Date: 2024-04-18 16:37+0200\n"
|
||||
"PO-Revision-Date: 2018-09-21 21:27+0100\n"
|
||||
"Last-Translator: \n"
|
||||
"Language-Team: \n"
|
||||
|
@ -247,287 +247,295 @@ msgid "Related by tags"
|
|||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:180
|
||||
msgid "Footer Widget Columns"
|
||||
msgid "Header Search"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:181
|
||||
msgid "Search button in header"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:189
|
||||
msgid "Footer Widget Columns"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:190
|
||||
msgid "Select columns to enable footer widgets. Recommended number: 3"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:196
|
||||
#: functions/theme-options.php:205
|
||||
msgid "Footer Social Links"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:197
|
||||
#: functions/theme-options.php:206
|
||||
msgid "Social link icon buttons"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:205
|
||||
#: functions/theme-options.php:214
|
||||
msgid "Footer Logo"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:206
|
||||
#: functions/theme-options.php:215
|
||||
msgid "Upload your custom logo image"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:214
|
||||
#: functions/theme-options.php:223
|
||||
msgid "Footer Copyright"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:215
|
||||
#: functions/theme-options.php:224
|
||||
msgid "Replace the footer copyright text"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:223
|
||||
#: functions/theme-options.php:232
|
||||
msgid "Footer Credit"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:224
|
||||
#: functions/theme-options.php:233
|
||||
msgid "Footer credit text"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:231
|
||||
#: functions/theme-options.php:240
|
||||
msgid "Create Social Links"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:232
|
||||
#: functions/theme-options.php:241
|
||||
msgid "Create and organize your social links"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:234
|
||||
#: functions/theme-options.php:243
|
||||
msgid "Font Awesome names:"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:234 functions/theme-options.php:251
|
||||
#: functions/theme-options.php:243 functions/theme-options.php:260
|
||||
msgid "View All"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:237
|
||||
#: functions/theme-options.php:246
|
||||
msgid "social link"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:244
|
||||
#: functions/theme-options.php:253
|
||||
msgid "Title"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:245
|
||||
#: functions/theme-options.php:254
|
||||
msgid "Ex: Facebook"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:250
|
||||
#: functions/theme-options.php:259
|
||||
msgid "Icon Name"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:251
|
||||
#: functions/theme-options.php:260
|
||||
msgid "Font Awesome icons. Ex: fa-facebook "
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:256
|
||||
#: functions/theme-options.php:265
|
||||
msgid "Link"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:257
|
||||
#: functions/theme-options.php:266
|
||||
msgid "Enter the full url for your icon button"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:262
|
||||
#: functions/theme-options.php:271
|
||||
msgid "Icon Color"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:263
|
||||
#: functions/theme-options.php:272
|
||||
msgid "Set a unique color for your icon (optional)"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:268
|
||||
#: functions/theme-options.php:277
|
||||
msgid "Open in new window"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:277
|
||||
#: functions/theme-options.php:286
|
||||
msgid "Dynamic Styles"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:278
|
||||
#: functions/theme-options.php:287
|
||||
msgid "Turn on to use the styling options below"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:286
|
||||
#: functions/theme-options.php:295
|
||||
msgid "Font"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:287
|
||||
#: functions/theme-options.php:296
|
||||
msgid "Select font for the theme"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:291
|
||||
#: functions/theme-options.php:300
|
||||
msgid "Titillium Web, Latin-Ext"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:292
|
||||
#: functions/theme-options.php:301
|
||||
msgid "Droid Serif, Latin"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:293
|
||||
#: functions/theme-options.php:302
|
||||
msgid "Source Sans Pro, Latin-Ext"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:294
|
||||
#: functions/theme-options.php:303
|
||||
msgid "Lato, Latin"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:295
|
||||
#: functions/theme-options.php:304
|
||||
msgid "Raleway, Latin"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:296
|
||||
#: functions/theme-options.php:305
|
||||
msgid "Inter, Latin"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:297
|
||||
#: functions/theme-options.php:306
|
||||
msgid "Ubuntu, Latin-Ext"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:298
|
||||
#: functions/theme-options.php:307
|
||||
msgid "Ubuntu, Latin / Cyrillic-Ext"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:299
|
||||
#: functions/theme-options.php:308
|
||||
msgid "Roboto, Latin-Ext"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:300
|
||||
#: functions/theme-options.php:309
|
||||
msgid "Roboto, Latin / Cyrillic-Ext"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:301
|
||||
#: functions/theme-options.php:310
|
||||
msgid "Roboto Condensed, Latin-Ext"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:302
|
||||
#: functions/theme-options.php:311
|
||||
msgid "Roboto Condensed, Latin / Cyrillic-Ext"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:303
|
||||
#: functions/theme-options.php:312
|
||||
msgid "Roboto Slab, Latin-Ext"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:304
|
||||
#: functions/theme-options.php:313
|
||||
msgid "Roboto Slab, Latin / Cyrillic-Ext"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:305
|
||||
#: functions/theme-options.php:314
|
||||
msgid "Playfair Display, Latin-Ext"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:306
|
||||
#: functions/theme-options.php:315
|
||||
msgid "Playfair Display, Latin / Cyrillic"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:307
|
||||
#: functions/theme-options.php:316
|
||||
msgid "Open Sans, Latin-Ext"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:308
|
||||
#: functions/theme-options.php:317
|
||||
msgid "Open Sans, Latin / Cyrillic-Ext"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:309
|
||||
#: functions/theme-options.php:318
|
||||
msgid "PT Serif, Latin-Ext"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:310
|
||||
#: functions/theme-options.php:319
|
||||
msgid "PT Serif, Latin / Cyrillic-Ext"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:311
|
||||
#: functions/theme-options.php:320
|
||||
msgid "Arial"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:312
|
||||
#: functions/theme-options.php:321
|
||||
msgid "Georgia"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:313
|
||||
#: functions/theme-options.php:322
|
||||
msgid "Verdana"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:314
|
||||
#: functions/theme-options.php:323
|
||||
msgid "Tahoma"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:321
|
||||
#: functions/theme-options.php:330
|
||||
msgid "Website Max-width"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:322
|
||||
#: functions/theme-options.php:331
|
||||
msgid "Max-width of the container"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:335
|
||||
#: functions/theme-options.php:344
|
||||
msgid "Content Max-width"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:336
|
||||
#: functions/theme-options.php:345
|
||||
msgid "Max-width of the content on posts and pages"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:349
|
||||
#: functions/theme-options.php:358
|
||||
msgid "Header Logo Image Max-height"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:350
|
||||
#: functions/theme-options.php:359
|
||||
msgid ""
|
||||
"Your logo image should have the double height of this to be high resolution"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:363
|
||||
#: functions/theme-options.php:372
|
||||
msgid "Dark Theme"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:364
|
||||
#: functions/theme-options.php:373
|
||||
msgid "Use dark instead of light base"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:372
|
||||
#: functions/theme-options.php:381
|
||||
msgid "Light/Dark Theme Toggle"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:373
|
||||
#: functions/theme-options.php:382
|
||||
msgid "Do not use with dark theme enabled"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:381
|
||||
#: functions/theme-options.php:390
|
||||
msgid "Invert Dark Logo Color"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:382
|
||||
#: functions/theme-options.php:391
|
||||
msgid "Change color for the logo in dark mode"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:390
|
||||
#: functions/theme-options.php:399
|
||||
msgid "Alternate Featured Image Side"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:391
|
||||
#: functions/theme-options.php:400
|
||||
msgid "Make each even entry image show on left side instead of right"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:399
|
||||
#: functions/theme-options.php:408
|
||||
msgid "Border Radius Design"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:400
|
||||
#: functions/theme-options.php:409
|
||||
msgid "Set to 0 for default radiuses"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:413
|
||||
#: functions/theme-options.php:422
|
||||
msgid "Gradient Left"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:421
|
||||
#: functions/theme-options.php:430
|
||||
msgid "Gradient Right"
|
||||
msgstr ""
|
||||
|
||||
#: functions/theme-options.php:429
|
||||
#: functions/theme-options.php:438
|
||||
msgid "Theme Color (Dark Mode)"
|
||||
msgstr ""
|
||||
|
||||
|
|
|
@ -29,7 +29,7 @@
|
|||
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 719px) {
|
||||
@media only screen and (max-width: 719px) {
|
||||
.blog-card { min-height: auto; }
|
||||
.blog-card-inner { display: block; }
|
||||
.blog-card-right { width: 100%; aspect-ratio: 16/9; }
|
||||
|
@ -70,6 +70,11 @@
|
|||
.site-title { padding: 4px 0; margin: 0; width: 100%; float: none; line-height: 50px; border-bottom: 1px solid rgba(0,0,0,0.06); }
|
||||
.site-title a { text-align: center; }
|
||||
.site-description { display: none; }
|
||||
.header-right,
|
||||
.header-right #wrap-nav-header { float: none; }
|
||||
.header-right { position: relative; }
|
||||
.header-search { float: none; position: absolute; left: 0; top: 0; margin: 10px 0 0 20px; }
|
||||
.search-expand { padding-top: 28px; padding-bottom: 28px; }
|
||||
.site-header { margin-top: 0; margin-bottom: 20px; }
|
||||
.social-links .social-tooltip:hover:after,
|
||||
.social-links .social-tooltip:hover:before { display: none; }
|
||||
|
@ -90,6 +95,8 @@
|
|||
.wrapper-inner { padding-left: 0; padding-right: 0; }
|
||||
#header { margin-bottom: 0; }
|
||||
.site-header { margin-bottom: 0; }
|
||||
.search-expand { padding: 30px 20px; }
|
||||
.search-expand .themeform.searchform input { font-size: 17px; }
|
||||
#theme-toggle { left: -10px; bottom: 10px; }
|
||||
|
||||
.featured-card-title { min-height: 68px; max-height: 68px; overflow: hidden; }
|
||||
|
|
24
style.css
24
style.css
|
@ -453,7 +453,7 @@ body { background: #f6f7fa; }
|
|||
.slick-posts-nav .slick-prev:before { color: rgba(0,0,0,0.5); font-family: "Font Awesome 6 Free"; font-weight: 900; content: "\f053"; }
|
||||
.slick-posts-nav .slick-next:before { color: rgba(0,0,0,0.5); font-family: "Font Awesome 6 Free"; font-weight: 900; content: "\f054"; }
|
||||
|
||||
.slick-featured .slick-posts { display: none; }
|
||||
.slick-posts { display: none; }
|
||||
.slick-featured .slick-dotted.slick-slider { margin-bottom: 0; }
|
||||
.slick-featured .slick-dots { bottom: -50px; box-sizing: border-box; }
|
||||
.slick-featured .slick-dots li { margin: 0 3px; }
|
||||
|
@ -563,6 +563,26 @@ body.dark #theme-toggle-btn:before { border-color: #fff; top: 2px; left: 2px; }
|
|||
.site-header img { }
|
||||
.site-image { display: block; margin: 0 auto; max-height: 400px; }
|
||||
|
||||
.header-right { float: right; }
|
||||
.header-right #wrap-nav-header { float: left; }
|
||||
.header-search { float: right; margin: 20px 0 0 30px; }
|
||||
.toggle-search { background: transparent; outline: none; border: 0; text-align: center; cursor: pointer; margin: 0; padding: 0; display: block; }
|
||||
.search-expand { background-image: linear-gradient(90deg, #be1e1e 0%, #ff0000 100%); display: none; position: fixed; top: 0; left: 0; right: 0; width: auto; padding: 37px 0; z-index: 10; }
|
||||
.search-expand-inner { position: relative; }
|
||||
.search-expand .themeform.searchform input { background: transparent!important; color: rgba(255,255,255,0.75); width: 100%; font-size: 20px; border: 0!important; padding-left: 40px!important; }
|
||||
.search-expand .themeform.searchform input:focus { color: #fff; outline: none!important; }
|
||||
.search-expand .themeform.searchform div:after { color: #fff; font-size: 24px; top: 10px; left: 0; }
|
||||
.toggle-search .svg-icon { fill: #000; }
|
||||
.toggle-search:focus #svg-search { fill: rgba(0,0,0,0.5); }
|
||||
.toggle-search #svg-close { fill: #fff; }
|
||||
.toggle-search:focus #svg-close { fill: rgba(255,255,255,0.75); }
|
||||
|
||||
body.header-search-active .header-search-overlay { position: fixed; background: rgba(0,0,0,0.4); top: 0; left: 0; right: 0; bottom: 0; }
|
||||
body.header-search-active .search-expand { display: block; }
|
||||
body.header-search-active.admin-bar .search-expand { top: var(--wp-admin--admin-bar--height); }
|
||||
body.header-search-active .search-expand-inner .searchform { margin-right: 40px; }
|
||||
body.header-search-active .search-expand-inner .toggle-search { position: absolute; right: 0; top: 12px; }
|
||||
|
||||
|
||||
/* ------------------------------------------------------------------------- *
|
||||
* Section: Navigation
|
||||
|
@ -643,7 +663,7 @@ body.dark #theme-toggle-btn:before { border-color: #fff; top: 2px; left: 2px; }
|
|||
|
||||
.nav-menu.mobile { padding: 0; }
|
||||
.nav-menu.mobile button:focus { outline: none; }
|
||||
.nav-menu.mobile > button { padding: 6px 20px; float: right; }
|
||||
.nav-menu.mobile > button { padding: 12px 20px; float: right; }
|
||||
.nav-menu.mobile button .svg-icon { transition: all 250ms; }
|
||||
.nav-menu.mobile button.active .svg-icon { transform: rotate(180deg); }
|
||||
.nav-menu.mobile ul { border: 0; }
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue