Skip to content

Commit ec23ff2

Browse files
LightLight
Light
authored and
Light
committed
refactor: 将搜索框是否置顶的功能调整为在主页上设置
调整使搜索框始终检索已有网址
1 parent a09b2c5 commit ec23ff2

7 files changed

Lines changed: 65 additions & 52 deletions

File tree

‎src/css/nav.css‎

Lines changed: 15 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -199,16 +199,6 @@ body.night .search-hot-text ul li a small {
199199
font-size: 12px;
200200
color: #999;
201201
}
202-
.search-engine-tool > span {
203-
float: right;
204-
width: 25px;
205-
height: 15px;
206-
background: url('../images/off_on.png') no-repeat 0px 0px;
207-
cursor: pointer;
208-
}
209-
.search-engine-tool > span.off {
210-
background-position: -30px 0px;
211-
}
212202

213203
.search-engine ul::before {
214204
content: '';
@@ -413,3 +403,18 @@ body.night .xe-comment-entry .no-img {
413403
background-size: 20px;
414404
}
415405
}
406+
407+
input#is-search-top[type=checkbox].iswitch {
408+
width: 30px;
409+
height: 18px;
410+
line-height: 18px;
411+
margin-bottom: 0;
412+
margin-right: 0;
413+
}
414+
input#is-search-top[type=checkbox].iswitch:before {
415+
height: 14px;
416+
width: 14px;
417+
}
418+
input#is-search-top[type=checkbox].iswitch:checked {
419+
padding-left: 14px;
420+
}

‎src/footer.php‎

Lines changed: 24 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -53,11 +53,12 @@ function show_date_time() {
5353
e.preventDefault();
5454
const href = $(this).attr("href");
5555
let pos = $(href).offset().top;
56+
const searchInput = document.querySelector('.search-input');
5657
if (isMobile) {
57-
pos -= <?php echo $this->options->isSearch == '1' && $this->options->isSearchTop == '1' ? 150 : 25; ?>;
58+
pos -= searchInput && window.isSearchTop == '1' ? 150 : 25;
5859
$('.page-container .sidebar-menu').fadeToggle('normal');
5960
} else {
60-
pos -= <?php echo $this->options->isSearch == '1' && $this->options->isSearchTop == '1' ? 100 : 70; ?>;
61+
pos -= searchInput && window.isSearchTop == '1' ? 100 : 70;
6162
}
6263
$("html,body").animate({
6364
scrollTop: pos
@@ -176,6 +177,25 @@ function darkHandler(darkMode, mode, write = false) {
176177
darkList && darkList.classList.remove('open');
177178
})
178179
})
180+
181+
window.isSearchTop = cookie.get('search_top') || '0';
182+
const searchTopBtn = document.getElementById('is-search-top');
183+
if (searchTopBtn) {
184+
searchTopBtn.addEventListener('click', e => {
185+
e.stopPropagation();
186+
const isTop = cookie.get('search_top');
187+
cookie.set('search_top', isTop == '0' ? '1' : '0');
188+
window.isSearchTop = isTop == '0' ? '1' : '0';
189+
const sousuo = document.querySelector('.sousuo .search');
190+
if (sousuo) {
191+
if (window.isSearchTop == '1') {
192+
sousuo.classList.add('is-top');
193+
} else {
194+
sousuo.classList.remove('is-top');
195+
}
196+
}
197+
})
198+
}
179199
})();
180200
</script>
181201
<?php if($this->options->isSearchClean == '1'): ?>
@@ -196,18 +216,14 @@ function darkHandler(darkMode, mode, write = false) {
196216

197217

198218
<style>
199-
<?php if ($this->options->isSearchTop == '1') : ?>
200-
.sousuo .search {
219+
.sousuo .search.is-top {
201220
position: fixed;
202221
}
203-
204-
.search-input {
222+
.sousuo .search.is-top .search-input {
205223
-webkit-box-shadow: 0 0 5px 0 #cccccc94;
206224
box-shadow: 0 0 5px 0 #cccccc94;
207225
}
208226

209-
<?php endif; ?>
210-
211227
.my_mode_switch {
212228
background-image: url("<?php echo THEME_URL ?>/fonts/sun.svg");
213229
}

‎src/functions.php‎

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -258,10 +258,8 @@ function themeConfig($form)
258258
// 搜索功能
259259
$isSearch = new Typecho_Widget_Helper_Form_Element_Radio('isSearch', array('0' => _t('禁用'), '1' => _t('启用')), '1', _t('搜索功能'), _t("是否在主页上启用搜索框"));
260260
$form->addInput($isSearch);
261-
$isSearchTop = new Typecho_Widget_Helper_Form_Element_Radio('isSearchTop', array('0' => _t('禁用'), '1' => _t('启用')), '0', _t('搜索框置顶'), _t('始终将搜索框置顶，即不受页面滚动影响'));
262-
$form->addInput($isSearchTop);
263261
// 搜索框内的清空按钮
264-
$isSearchClean = new Typecho_Widget_Helper_Form_Element_Radio('isSearchClean', array('0' => _t('禁用'), '1' => _t('启用')), '0', _t('搜索框内容清空按钮'), _t('在搜索框内一个显示清空内容的按钮'));
262+
$isSearchClean = new Typecho_Widget_Helper_Form_Element_Radio('isSearchClean', array('0' => _t('禁用'), '1' => _t('启用')), '0', _t('搜索框内容清空按钮'), _t('在搜索框内显示一个清空内容的按钮'));
265263
$form->addInput($isSearchClean);
266264
// 右侧浮动窗
267265
$fk_zmki = new Typecho_Widget_Helper_Form_Element_Radio('fk_zmki', array('0' => _t('禁用'), '1' => _t('启用')), '1', _t('右侧浮动窗'), _t("是否显示右侧浮动窗，包含返回顶部按钮以及手机端的侧栏切换"));

‎src/header.php‎

Lines changed: 21 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -3,25 +3,26 @@
33
define("THEME_URL", '/' . str_replace($this->options->siteUrl, "", $this->options->themeUrl));
44
?>
55
<head>
6-
<meta charset="<?php $this->options->charset(); ?>">
7-
<title><?php $this->archiveTitle(array(
8-
'category' => _t('分类 %s 下的文章'),
9-
'search' => _t('包含关键字 %s 的文章'),
10-
'tag' => _t('标签 %s 下的文章'),
11-
'author' => _t('%s 发布的文章')
12-
), '', ' - '); ?><?php $this->options->title(); ?><?php if ($this->is('index')): ?><?php endif; ?></title>
13-
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
14-
<meta name="copyright" content="Light"/>
15-
<link rel="shortcut icon" href="<?php $this->options->favicon(); ?>">
16-
<link rel="apple-touch-icon" href="<?php $this->options->favicon(); ?>">
17-
<link rel="stylesheet" href="<?php echo THEME_URL ?>/css/fonts/linecons/css/linecons.css">
18-
<link rel="stylesheet" href="<?php echo THEME_URL ?>/css/font-awesome.min.css">
19-
<link rel="stylesheet" href="<?php echo THEME_URL ?>/css/bootstrap.css">
20-
<link rel="stylesheet" href="<?php echo THEME_URL ?>/css/xenon-core.css">
21-
<link rel="stylesheet" href="<?php echo THEME_URL ?>/css/xenon-components.css">
22-
<link rel="stylesheet" href="<?php echo THEME_URL ?>/css/xenon-skins.css">
23-
<link rel="stylesheet" href="<?php echo THEME_URL ?>/css/nav.css">
24-
<script>const themeUrl = "<?php echo THEME_URL ?>";</script>
25-
<script src="<?php echo THEME_URL ?>/js/jquery.min.js"></script>
6+
<meta charset="<?php $this->options->charset(); ?>">
7+
<title><?php $this->archiveTitle(array(
8+
'category' => _t('分类 %s 下的文章'),
9+
'search' => _t('包含关键字 %s 的文章'),
10+
'tag' => _t('标签 %s 下的文章'),
11+
'author' => _t('%s 发布的文章')
12+
), '', ' - '); ?><?php $this->options->title(); ?><?php if ($this->is('index')): ?><?php endif; ?></title>
13+
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
14+
<meta name="copyright" content="Light"/>
15+
<link rel="shortcut icon" href="<?php $this->options->favicon(); ?>">
16+
<link rel="apple-touch-icon" href="<?php $this->options->favicon(); ?>">
17+
<link rel="stylesheet" href="<?php echo THEME_URL ?>/css/fonts/linecons/css/linecons.css">
18+
<link rel="stylesheet" href="<?php echo THEME_URL ?>/css/font-awesome.min.css">
19+
<link rel="stylesheet" href="<?php echo THEME_URL ?>/css/bootstrap.css">
20+
<link rel="stylesheet" href="<?php echo THEME_URL ?>/css/xenon-core.css">
21+
<link rel="stylesheet" href="<?php echo THEME_URL ?>/css/xenon-components.css">
22+
<link rel="stylesheet" href="<?php echo THEME_URL ?>/css/xenon-skins.css">
23+
<link rel="stylesheet" href="<?php echo THEME_URL ?>/css/xenon-forms.css">
24+
<link rel="stylesheet" href="<?php echo THEME_URL ?>/css/nav.css">
25+
<script>const themeUrl = "<?php echo THEME_URL ?>";</script>
26+
<script src="<?php echo THEME_URL ?>/js/jquery.min.js"></script>
2627
<?php $this->header(); ?>
2728
</head>

‎src/images/off_on.png‎

-16 KB
Binary file not shown.

‎src/js/index.js‎

Lines changed: 2 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -3011,7 +3011,6 @@ function search() {
30113011
let savedData = {
30123012
url: 'https://www.baidu.com/s?ie=UTF-8&wd=',
30133013
logo: '/fonts/baidu.svg',
3014-
hotStatus: true,
30153014
};
30163015
const searchData = [
30173016
{
@@ -3190,7 +3189,7 @@ function search() {
31903189

31913190
$('#txt').keyup(function (e) {
31923191
if ($(this).val()) {
3193-
if (e.keyCode == 38 || e.keyCode == 40 || !savedData.hotStatus) {
3192+
if (e.keyCode == 38 || e.keyCode == 40) {
31943193
return;
31953194
}
31963195
getHotkeyword($(this).val());
@@ -3229,7 +3228,7 @@ function search() {
32293228
});
32303229
$('#txt').focus(function () {
32313230
$('.search-box').css('box-show', 'inset 0 1px 2px rgba(27,31,35,.075), 0 0 0 0.2em rgba(3,102,214,.3)');
3232-
if ($(this).val() && savedData.hotStatus) {
3231+
if ($(this).val()) {
32333232
getHotkeyword($(this).val());
32343233
}
32353234
});
@@ -3251,12 +3250,6 @@ function search() {
32513250
$('.search-engine').css('display', 'none');
32523251
}
32533252
);
3254-
$('#hot-btn').click(function () {
3255-
$(this).toggleClass('off');
3256-
savedData.hotStatus = !savedData.hotStatus;
3257-
localStorage.savedData = JSON.stringify(savedData);
3258-
});
3259-
savedData.hotStatus ? $('#hot-btn').removeClass('off') : $('#hot-btn').addClass('off');
32603253

32613254
$('.search-icon').css('background-size', '32px 32px');
32623255
$('.search-icon').css('background-image', `url(${themeUrl + savedData.logo})`);

‎src/search.php‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
<section class="sousuo">
2-
<div class="search">
2+
<div class="search <?php echo isset($_COOKIE['search_top']) && $_COOKIE['search_top'] == '1' ? 'is-top' : ''; ?>">
33
<div class="search-box">
44
<span class="search-icon"
55
style="background: url(<?php echo THEME_URL ?>/fonts/baidu.svg) 0px 0px; opacity: 1;"></span>
@@ -17,7 +17,7 @@
1717
<div class="search-engine" style="display: none;">
1818
<div class="search-engine-head">
1919
<strong class="search-engine-tit">选择您的默认搜索引擎：</strong>
20-
<div class="search-engine-tool">检索已有网址： <span id="hot-btn"></span></div>
20+
<div class="search-engine-tool">搜索框置顶： <input id="is-search-top" type="checkbox" class="iswitch iswitch-secondary" <?php echo isset($_COOKIE['search_top']) && $_COOKIE['search_top'] == '1' ? 'checked' : ''; ?>></div>
2121
</div>
2222
<ul class="search-engine-list search-engine-list_zmki_ul">
2323
</ul>

0 commit comments

Comments
 (0)