hexo-theme-butterfly/source/css/_search/local-search.styl
Jerry 8199e25215 feat: 重構本地搜索
feat: Algolia 搜索,點擊文章內容也會跳轉到相應頁面
fix: 修復 fullpage loading 顯示滾動條的 bug close #1235
fix: 修復 safari 下,搜索內容被系統搜索框遮擋的 bug
improvement: 手機 safari 橫屏時,網頁全屏幕顯示
improvement: 當沒有開啟 beautify 時, hr 顯示默認的樣式
2023-03-28 20:40:43 +08:00

74 lines
1.5 KiB
Stylus

#local-search
.search-dialog
.local-search-box
margin: 0 auto
max-width: 100%
width: 100%
input
padding: 5px 14px
width: 100%
outline: none
border: 2px solid $search-color
border-radius: 40px
background: var(--search-bg)
color: var(--search-input-color)
-webkit-appearance: none
.search-wrap
display: none
.local-search-hit-item
position: relative
padding-left: 24px
line-height: 1.7
&:hover
&:before
border-color: var(--pseudo-hover)
&:before
$w = .5em
position: absolute
top: .45em
left: 0
width: w = $w
height: h = w
border: 3px solid $search-color
border-radius: w
background: transparent
content: ''
line-height: h
transition: all .2s ease-in-out
a
display: block
color: var(--search-a-color)
&:hover
color: $search-color
.search-result-title
font-weight: 600
.search-result
margin: 0 0 8px
word-break: break-word
.search-result-list
overflow-y: overlay
margin: 0 -20px
padding: 0 22px
max-height: calc(80vh - 200px)
+maxWidth768()
max-height: calc(var(--search-height) - 220px) !important
.no-result
& + #local-search-stats-wrap
display: none
.search-keyword
background: transparent
color: $search-keyword-highlight
font-weight: bold