index.styl 3.2 KB
Newer Older
D
DCloud_LXH 已提交
1 2 3
$svg-color = #b1b2b3
$svg-hover-color = #9b9b9b

4 5 6
@import './styles/ext.styl'
@import './styles/ask.styl'

D
DCloud_LXH 已提交
7
#search-container
D
DCloud_LXH 已提交
8
  position relative
D
DCloud_LXH 已提交
9 10
  overflow auto
  position fixed
D
DCloud_LXH 已提交
11 12
  width 100%
  height 100%
D
DCloud_LXH 已提交
13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81
  left 0
  top 0
  z-index 200
  background-color $search-container-color

  .sub-navbar, .result-wrap
    width 80%
    max-width 960px
    margin 0 auto

    .search-wrap
      width 100%
      display inline-block
      vertical-align middle
      position relative

    .input-wrap
      margin-top 24px
      position relative
      display flex
      align-items center
      box-sizing border-box

      .search-input-btn
        display flex
        flex-direction column
        justify-content center
        padding 0
        font-size 0
        background-color #fff

        button
          width 40px
          font-family inherit
          font-size 100%
          margin 0
          outline 0
          background-color transparent
          padding 0
          border-width 0
          vertical-align middle
          cursor pointer

          svg
            fill $svg-color

            &:hover
              fill $svg-hover-color

      .search-input
        width 100%
        height 56px
        font-size 16px
        border none
        box-sizing border-box
        outline none
        padding 1px 10px
        border-radius 4px

      .search-input-btn
        height 56px

      .search-back__btn
        display block !important
        font-size 17px
        color #576b95
        line-height 24px
        padding 10px 16px
        white-space nowrap
D
DCloud_LXH 已提交
82 83
        /* position absolute
        right -65px */
D
DCloud_LXH 已提交
84 85 86 87 88 89 90 91 92 93 94 95

    .search-category
      .navbar
        border none

      .main-navbar
        box-shadow none

      .main-navbar-links
        width 100%
        padding 0

D
DCloud_LXH 已提交
96 97 98 99
        @media (max-width 630px)
          &
            white-space normal !important

D
DCloud_LXH 已提交
100
        .main-navbar-item
D
DCloud_LXH 已提交
101 102 103 104 105 106 107
          @media (max-width 1070px)
            &
              padding 0 2%

          @media (max-width 900px)
            &
              padding 0 1%
D
DCloud_LXH 已提交
108 109 110 111

  .result-number
    display flex
    justify-content center
D
DCloud_LXH 已提交
112
    align-items center
D
DCloud_LXH 已提交
113
    padding-top 20px
D
DCloud_LXH 已提交
114
    font-size 20px
115 116 117 118
    
    .uni-loading
      width 27px
      height 27px
D
DCloud_LXH 已提交
119

D
DCloud_LXH 已提交
120 121 122 123 124
    .DocSearch-Logo
      font-size 16px
      vertical-align middle
      display inline-block

D
DCloud_LXH 已提交
125 126 127 128 129 130 131 132 133
  .search-result
    box-sizing border-box

    .result-wrap
      ul
        list-style none
        margin 0
        padding 0

D
DCloud_LXH 已提交
134 135 136 137 138
  .algolia-logo
    display flex
    justify-content center
    padding 10px 0 20px

139 140 141 142 143 144 145 146 147 148
  .search-more
    display block
    text-align center
    padding 10px 0
    color inherit
    cursor pointer

    &:hover
      color $accentColor

D
DCloud_LXH 已提交
149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169
@media (max-width $MQMobile)
  #search-container
    .search-navbar-header>.main-navbar
      display none !important

    .search-navbar>.navbar, .search-category>.navbar
      line-height 3rem
      height auto
      position static !important

    .sub-navbar, .result-wrap
      width 100% !important

    .input-wrap
      padding-left 5px
      margin-top 5px !important

      .search-input, .search-input-btn
        height 32px !important

    .search-result
D
DCloud_LXH 已提交
170 171 172
      padding 0 10px

    .search-result-aside
173
      display none