| @@ -1,264 +1 @@ | ||
| 1 | - | |
| 2 | -ul { | |
| 3 | - display: initial; /* Revert display to default */ | |
| 4 | - list-style-type: none; /* Remove bullet points */ | |
| 5 | - margin: 0; /* Reset all margins */ | |
| 6 | - padding: 0; /* Reset padding */ | |
| 7 | - unicode-bidi: initial; /* Reset unicode-bidi property */ | |
| 8 | -} | |
| 9 | -.ablocks-block--search-form { | |
| 10 | - margin: 0; | |
| 11 | - | |
| 12 | -} | |
| 13 | - | |
| 14 | -.ablocks-block--search-bar { | |
| 15 | - display: flex; | |
| 16 | - align-items: center; | |
| 17 | - overflow: hidden; | |
| 18 | -} | |
| 19 | -.ablocks-block--search-bar.minimal{ | |
| 20 | - border: 1px solid #DDDDDF; | |
| 21 | - border-radius: 30px; | |
| 22 | -} | |
| 23 | -.ablocks-block--search-form{ | |
| 24 | - width: 100%; | |
| 25 | - display: flex; | |
| 26 | - align-items: center; | |
| 27 | - overflow: hidden; | |
| 28 | -} | |
| 29 | -.ablocks-block--search-bar.minimal .ablocks-block--search-form{ | |
| 30 | - gap: 0px !important; | |
| 31 | -} | |
| 32 | -.ablocks-block--search-form.both{ | |
| 33 | - gap: 16px; | |
| 34 | -} | |
| 35 | -.ablocks-block--search-form.text{ | |
| 36 | - gap: 16px; | |
| 37 | -} | |
| 38 | - | |
| 39 | -.ablocks-block--search-input { | |
| 40 | - width: 100%; | |
| 41 | - font-size: 16px; | |
| 42 | - border-bottom-left-radius: 8px !important; | |
| 43 | - border-bottom-right-radius: 0px !important; | |
| 44 | - border-top-left-radius: 8px !important; | |
| 45 | - border-top-right-radius: 0px !important; | |
| 46 | - margin: 0; | |
| 47 | - border: 1px solid #DDDDDF; | |
| 48 | - outline: none; | |
| 49 | - height: 46px !important; | |
| 50 | - padding: 15px 20px; | |
| 51 | - box-sizing: border-box; | |
| 52 | -} | |
| 53 | -.ablocks-block--search-input.both{ | |
| 54 | - border-radius: 8px !important; | |
| 55 | -} | |
| 56 | -.ablocks-block--search-input.text{ | |
| 57 | - border-radius: 8px !important; | |
| 58 | -} | |
| 59 | -.ablocks-block--search-bar.minimal .ablocks-block--search-input{ | |
| 60 | - border-radius: 0px; | |
| 61 | - border: 0px; | |
| 62 | -} | |
| 63 | - | |
| 64 | -.ablocks-block--search-button { | |
| 65 | - display: flex; | |
| 66 | - align-items: center; | |
| 67 | - gap: 4px; | |
| 68 | - padding: 15px 20px; | |
| 69 | - background-color: #13191B; | |
| 70 | - border: none; | |
| 71 | - color: white; | |
| 72 | - font-size: 16px; | |
| 73 | - font-weight: 500; | |
| 74 | - cursor: pointer; | |
| 75 | - border-bottom-right-radius: 8px; | |
| 76 | - border-bottom-left-radius: 0px; | |
| 77 | - border-top-right-radius: 8px; | |
| 78 | - border-top-left-radius: 0px; | |
| 79 | - height: 46px; | |
| 80 | -} | |
| 81 | -.ablocks-block--search-button.both{ | |
| 82 | - border-radius: 8px; | |
| 83 | -} | |
| 84 | -.ablocks-block--search-button.text{ | |
| 85 | - border-radius: 8px; | |
| 86 | - padding: 15px 22px; | |
| 87 | -} | |
| 88 | -.ablocks-block--search-bar.minimal .ablocks-block--search-button { | |
| 89 | - border: 0px; | |
| 90 | - border-radius: 0px; | |
| 91 | -} | |
| 92 | -.ablocks-block--search-bar.minimal .ablocks-block--search-button.both { | |
| 93 | - padding:15px 14px; | |
| 94 | -} | |
| 95 | - | |
| 96 | -.ablocks-block--search-button:hover { | |
| 97 | - background-color: #218838; | |
| 98 | -} | |
| 99 | - | |
| 100 | -.ablocks-block--search-button > span > svg{ | |
| 101 | - width: 16px; | |
| 102 | -} | |
| 103 | - | |
| 104 | -.ablocks-block--search-button span.button-content { | |
| 105 | - display: flex; | |
| 106 | - gap: 4px; | |
| 107 | - align-items: center; | |
| 108 | - justify-content: center; | |
| 109 | - line-height: 14px; | |
| 110 | -} | |
| 111 | -.ablocks-block--search-button .ablocks-button__text{ | |
| 112 | - line-height: 14px; | |
| 113 | -} | |
| 114 | - | |
| 115 | - | |
| 116 | - | |
| 117 | -.ablocks-block--search-empty-result { | |
| 118 | - display: none !important; | |
| 119 | -} | |
| 120 | - | |
| 121 | -.result-item { | |
| 122 | - padding: 10px; | |
| 123 | - border-bottom: 1px solid #eee; | |
| 124 | - font-size: 18px; | |
| 125 | - color: #333; | |
| 126 | -} | |
| 127 | - | |
| 128 | -.result-item:hover { | |
| 129 | - background-color: #f1f1f1; | |
| 130 | -} | |
| 131 | - | |
| 132 | - | |
| 133 | -/* fullscreen style */ | |
| 134 | -.search-icon { | |
| 135 | - background: none; | |
| 136 | - border: none; | |
| 137 | - cursor: pointer; | |
| 138 | - padding: 10px; | |
| 139 | - position: fixed; | |
| 140 | - top: 20px; | |
| 141 | - right: 20px; | |
| 142 | -} | |
| 143 | - | |
| 144 | -.search-icon svg { | |
| 145 | - width: 24px; | |
| 146 | - height: 24px; | |
| 147 | - color: black; | |
| 148 | -} | |
| 149 | - | |
| 150 | -.full-screen-search { | |
| 151 | - position: fixed; | |
| 152 | - top: 0; | |
| 153 | - left: 0; | |
| 154 | - width: 100vw; | |
| 155 | - height: 100vh; | |
| 156 | - background-color: rgba(0, 0, 0, 0.8); | |
| 157 | - display: flex; | |
| 158 | - flex-direction: row; | |
| 159 | - align-items: center; | |
| 160 | - justify-content: center; | |
| 161 | - z-index: 1000; | |
| 162 | - | |
| 163 | -} | |
| 164 | - | |
| 165 | -.full-screen-search-input { | |
| 166 | - width: 80%; | |
| 167 | - max-width: 600px; | |
| 168 | - padding: 15px; | |
| 169 | - font-size: 20px; | |
| 170 | - border: none; | |
| 171 | - border-radius: 30px; | |
| 172 | -} | |
| 173 | - | |
| 174 | -.search-btn { | |
| 175 | - padding: 10px 20px; | |
| 176 | - background-color: white; | |
| 177 | - border: none; | |
| 178 | - font-size: 16px; | |
| 179 | - cursor: pointer; | |
| 180 | - border-radius: 30px; | |
| 181 | -} | |
| 182 | - | |
| 183 | -.close-btn { | |
| 184 | - position: absolute; | |
| 185 | - top: 25%; | |
| 186 | - right: 25%; | |
| 187 | - background: none; | |
| 188 | - border: none; | |
| 189 | - color: white; | |
| 190 | - font-size: 20px; | |
| 191 | - cursor: pointer; | |
| 192 | -} | |
| 193 | -p.ablocks-block--search-result__list-no-data { | |
| 194 | - padding: 10px; | |
| 195 | - margin: 0px; | |
| 196 | -} | |
| 197 | - | |
| 198 | -.ablocks-block--search-result { | |
| 199 | - width: 100%; | |
| 200 | - position: absolute; | |
| 201 | - display: flex; | |
| 202 | - top: 100%; | |
| 203 | - margin-top: 10px; | |
| 204 | - left: 0; | |
| 205 | - z-index: 1000; | |
| 206 | - background: white; | |
| 207 | - border-radius: 10px; | |
| 208 | - box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1); | |
| 209 | - overflow: hidden; | |
| 210 | - list-style: none; | |
| 211 | - padding: 0; | |
| 212 | - flex-direction: column; | |
| 213 | -} | |
| 214 | - | |
| 215 | -.ablocks-block--search-result .ablocks-block--search-result__list { | |
| 216 | - display: flex; | |
| 217 | - align-items: center; | |
| 218 | - margin: 10px ; | |
| 219 | - transition: background 0.3s ease; | |
| 220 | - cursor: pointer; | |
| 221 | - gap: 24px; | |
| 222 | - padding: 9px; | |
| 223 | -} | |
| 224 | -.ablocks-block--search-result .ablocks-block--search-result__list a{ | |
| 225 | - display: flex; | |
| 226 | - align-items: center; | |
| 227 | - | |
| 228 | -} | |
| 229 | - | |
| 230 | -.ablocks-block--search-result .ablocks-block--search-result__list:hover { | |
| 231 | - background: #F5F5F5; | |
| 232 | - padding: 9px; | |
| 233 | - border-radius: 8px | |
| 234 | -} | |
| 235 | - | |
| 236 | -.ablocks-block--search-result__list img { | |
| 237 | - border-radius: 10px; | |
| 238 | - object-fit: cover; | |
| 239 | - height: auto; | |
| 240 | - width: auto; | |
| 241 | -} | |
| 242 | - | |
| 243 | -.ablocks-block--search-result__list .ablocks-block--search-result__list-title { | |
| 244 | - font-size: 16px; | |
| 245 | - font-style: normal; | |
| 246 | - font-weight: 600; | |
| 247 | - line-height: 24px; | |
| 248 | - text-decoration: none; | |
| 249 | -} | |
| 250 | -.loading-spinner { | |
| 251 | - display: none; | |
| 252 | - text-align: center; | |
| 253 | - padding: 20px; | |
| 254 | -} | |
| 255 | -@keyframes spin { | |
| 256 | - to { | |
| 257 | - transform: rotate(360deg); | |
| 258 | - } | |
| 259 | -} | |
| 260 | - | |
| 261 | -.ablocks-search-block__spin { | |
| 262 | - transform-origin: center; | |
| 263 | - animation: spin 2s linear infinite; | |
| 264 | -} | |
| 1 | +.ablocks-block--search-form{margin:0}.ablocks-block--search-bar,.ablocks-block--search-form{align-items:center;display:flex;overflow:hidden}.ablocks-block--search-form{width:100%}.ablocks-block--search-bar.minimal .ablocks-block--search-form{gap:0!important}.ablocks-block--search-form.both,.ablocks-block--search-form.text{gap:16px}.ablocks-block--search-input{border:1px solid #dddddf;box-sizing:border-box;font-size:16px;height:46px!important;margin:0;outline:none;padding:15px 20px;width:100%}.searchbar-input-open{opacity:1!important;width:100%!important}input[type=text].ablocks-block--search-input-collapse{opacity:0;transition:width .4s cubic-bezier(.4,0,.2,1),opacity .3s;width:0}.ablocks-block--search-input.both,.ablocks-block--search-input.text{border-radius:8px!important}.ablocks-block--search-bar.minimal .ablocks-block--search-input.searchbar-input-left{border:1px solid #dddddf;border-radius:0 30px 30px 0!important}.ablocks-block--search-bar.minimal .ablocks-block--search-input.searchbar-input-right{border:1px solid #dddddf;border-radius:30px 0 0 30px!important}.ablocks-block--search-button{align-items:center;background-color:#13191b;border:none;color:#fff;cursor:pointer;display:flex;font-size:16px;font-weight:500;gap:4px;height:46px;padding:15px 20px}.ablocks-block--search-button .loading-spinner{display:none;text-align:center}.ablocks-block--search-button.both{border-radius:8px}.ablocks-block--search-button.text{border-radius:8px;padding:15px 22px}.ablocks-block--search-bar.minimal .ablocks-block--search-button.searchbar-submit-left{border-radius:30px 0 0 30px}.ablocks-block--search-bar.minimal .ablocks-block--search-button.searchbar-submit-right{border-radius:0 30px 30px 0}.ablocks-block--search-bar.minimal .ablocks-block--search-button.both{padding:15px 14px}.ablocks-block--search-button:hover{background-color:#218838}.ablocks-block--search-button>span>svg{width:16px}.ablocks-block--search-button span.button-content{align-items:center;display:flex;gap:4px;justify-content:center;line-height:14px}.ablocks-block--search-button .ablocks-button__text{line-height:14px}.ablocks-block--search-empty-result{display:none!important}p.ablocks-block--search-result__list-no-data{margin:0;padding:10px}.ablocks-block--search-result{background:#fff;border-radius:10px;box-shadow:0 4px 12px rgba(0,0,0,.1);display:flex;flex-direction:column;left:0;list-style:none;margin-left:0!important;margin-top:10px;overflow:hidden;padding:0;padding-left:0!important;position:absolute;top:100%;width:100%;z-index:1000}.ablocks-block--search-result .ablocks-block--search-result__list{align-items:center;cursor:pointer;display:flex;gap:24px;margin:5px 10px;padding:9px;transition:background .3s ease}.ablocks-block--search-result .ablocks-block--search-result__list a{align-items:center;display:flex}.ablocks-block--search-result .ablocks-block--search-result__list:hover{background:#f5f5f5;border-radius:8px;padding:9px}.ablocks-block--search-result__list .ablocks-block--search-result__list-title{font-size:16px;font-style:normal;font-weight:600;line-height:24px;text-decoration:none}@keyframes aBlocksSpin{to{transform:rotate(1turn)}}.ablocks-search-block__spin{animation:aBlocksSpin 2s linear infinite;transform-origin:center} | |
