index.css

body{margin:0}.App{text-align:center;overflow:hidden;height:100vh;display:flex;flex-direction:column}.top{height:20px;background:rgba(0,0,0,.8)}.titleWrapper{background-color:#f2f2f2;border-bottom:1px solid rgba(219,219,219,1);overflow:hidden}.pageTip{font-size:12px;color:#a4a4a4;margin:0 16px 12px;text-align:left}.mainTitle{text-align:center;font-size:20px;margin-top:20px;margin-bottom:6px}.subTitle{font-size:16px;color:#1d1d1f;margin:0 16px 10px}.main{background:#fff;flex:1;overflow:hidden;padding-top:1px}.listBox{display:flex;height:100%;overflow:hidden}.brands{flex:1;overflow:auto;background:#f7f7f7}.models{flex:2;overflow:auto;padding-right:20px;padding-top:10px;padding-left:20px}.brandItem{font-size:17px;padding:16px 10px;font-weight:600;border-left:3px solid transparent}.pos{background:white;color:#0071e3;border-left-color:#0071e3}.modelsItem{position:relative;text-align:left;border-radius:8px;padding:12px 7px 12px 20px;margin-bottom:14px;box-shadow:0 0 6px #c8c8c899}.modelsIcon{position:absolute;right:20px;top:26px}.brandTip{text-align:left;font-size:12px;margin-bottom:10px}.tip{font-size:12px;color:#0071e3;margin-top:8px}.footergrep{background:#f5f5f7;height:18px}.footer{height:30px;background:#f5f5f7 url(logo.png) no-repeat center center;background-size:contain}.shadow{box-shadow:0 0 6px #c8c8c8cc}.searchPage{position:absolute;left:0;top:0;width:100vw;height:100vh;overflow:hidden;background:white;text-align:left}.searchBar{display:flex;align-items:center;height:48px;background-color:#f2f2f2;padding:0 16px}.search{border:1px solid #e9e9e9;border-radius:14px;height:28px;display:flex;align-items:center;background:white;flex:1}.searchIco{margin-top:5px;width:20px;height:20px;margin-right:6px;background-repeat:no-repeat;background-image:url(data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2018%2025%22%20fill%3D%22rgb%28134%2C134%2C139%29%22%20style%3D%22%22%3E%20%3Ctitle%3Emagnifyingglass_reduced%401x%3C%2Ftitle%3E%20%3Cg%20transform%3D%22translate%280%2C%20-2.75%29%22%3E%20%3Crect%20width%3D%2218%22%20height%3D%2225%22%20fill%3D%22none%22%2F%3E%20%3Cpath%20d%3D%22M17.512%2C20.113l-4.786-4.788a7.068%2C7.068%2C0%2C1%2C0-.777.778l4.785%2C4.788a.55.55%2C0%2C1%2C0%2C.777-.777ZM1.427%2C10.75A5.946%2C5.946%2C0%2C1%2C1%2C7.373%2C16.7%2C5.957%2C5.957%2C0%2C0%2C1%2C1.427%2C10.75Z%22%2F%3E%20%3C%2Fg%3E%20%3C%2Fsvg%3E)}.searchInput{border:none;outline:none;margin-left:10px;padding-left:10px;line-height:24px;font-size:14px;flex:1}.searchDefault{padding:16px;font-size:14px}.searchHis{margin-bottom:6px}.hisTitle{margin-bottom:6px;overflow:hidden}.hisList{overflow:hidden}.hisItem{display:inline-block;padding:0 10px;line-height:24px;background:#f2f2f2;border-radius:10px;margin-right:10px;font-size:12px;color:#979797;margin-bottom:8px}.searchResult{font-size:14px}.searchResultItem{padding:0 16px;min-height:35px;line-height:35px;border-bottom:1px solid #f7f7f7;overflow:hidden}.resultArea{height:calc(100% - 48px);overflow-y:auto}.floating-button {
  position: fixed;
  width: 150px;
  height: 40px;
  top: 30px; /* 距离顶部的距离 */
  left: 20px; /* 距离左侧的距离 */
  cursor: pointer;
  box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1); /* 添加一点阴影效果 */
  background-image: url('https://domain.cards/api/badge/mi.zc.wiki'); /* 使用图片作为按钮背景 */
  background-size: cover; /* 让图片充满整个按钮 */
}