feat: refine search styles

This commit is contained in:
Justineo 2021-07-19 17:29:41 +08:00
parent fe6f5376a9
commit 9593a8c559
No known key found for this signature in database
GPG Key ID: B73F0979CF18A0EA
5 changed files with 17 additions and 75 deletions

View File

@ -1,16 +1,20 @@
$primary = #0052cc
// only enable on Retina displays
@media screen and (min-resolution 2dppx)
html
-webkit-font-smoothing antialiased
-moz-osx-font-smoothing grayscale
*
*::before
*::after
box-sizing border-box
:root
--docsearch-primary-color $primary !important
--docsearch-searchbox-shadow inset 0 0 0 2px $primary !important
html
font-weight 400
color #333
@ -35,69 +39,3 @@ a:focus
main
line-height 1.5
menu
margin 0
padding 0
.menu-item
list-style none
line-height 1
.menu-link
display block
position relative
text-decoration none
cursor default
a&
cursor pointer
&::after
content ""
position absolute
bottom 2px
left 50%
width 0
height 2px
transition width 0.2s, left 0.2s
a&:focus::after
a&:hover::after
width 100%
left 0
.algolia-autocomplete
.algolia-docsearch-suggestion--title:last-child
margin-bottom 0
.ds-dropdown-menu
&
& [class^=ds-dataset-]
border-radius 3px
&::before
width 10px
height 10px
top -4px
.ds-suggestion.ds-cursor .algolia-docsearch-suggestion
&.suggestion-layout-simple
&:not(.suggestion-layout-simple) .algolia-docsearch-suggestion--content
background-color #f8f8f8
.algolia-docsearch-suggestion--category-header
font-size 14px
.algolia-docsearch-suggestion--subcategory-column
font-size 12px
overflow hidden
white-space nowrap
text-overflow ellipsis
.algolia-docsearch-suggestion--highlight
color #fff
background-color #111
.algolia-docsearch-suggestion--text .algolia-docsearch-suggestion--highlight
box-shadow inset 0 -2px 0 0 #111

View File

@ -132,14 +132,14 @@ margin-y($top, $bottom = $top)
a:visited
&:not([class^="veui-"])
text-decoration none
color #3998fc
color #0052cc
transition color 0.2s
&:hover
color #3389e3
color #06f
&:active
color #2e7aca
color #0046ad
code
padding 2px 4px
@ -227,6 +227,7 @@ margin-y($top, $bottom = $top)
pre
border 1px solid #eee
border-radius 4px
padding 30px
background-color #f9f9f9
white-space pre

View File

@ -132,6 +132,11 @@ export default {
.veui-menu-tree
overflow auto
::v-deep .DocSearch
margin 0
border-radius 6px
font inherit
h2
display flex
align-items center

View File

@ -39,7 +39,7 @@ module.exports = {
css: false
},
css: ['veui-theme-dls/common.less', '@/assets/styles/global.styl'],
css: ['veui-theme-dls/common.less', '@/assets/styles/global.styl', '@/assets/styles/post.styl'],
plugins: [
{ src: '~plugins/i18n.js' },

View File

@ -25,6 +25,4 @@ export default {<!-- if: ${layout} -->
<!-- /if -->
mixins: [htmlAttrs]
}
</script><!-- /else --><!-- if: ${style} -->
<style lang="stylus" src="@/assets/styles/post.styl" scoped></style><!-- /if -->
</script><!-- /else -->