简单美化了下沙拉查词

2021-03-25 21:23:55 +08:00
 nexmoe

沙拉查词->查词面板->自定义查词面板样式

.menuBar {
    background-color: #fff;
    border-bottom: 1px solid #eee;
    padding: 8px;
}
.menuBar-Btn_Icon,.menuBar-Btn_Icon-fav {
    fill: #222;
}
.mtaBox-TextArea-Wrap,
.mtaBox-DrawerBtn,
.waveformBox.saladict-external,
.dictItemHead-Logo,
.menuBar-SearchBox_Wrap,
.menuBar-Btn[title="查单词"] {
    display: none;
}
.dictItem {
    padding: 0 10px;
}
.dictItem:first-child {
    padding-top: 10px;
}
.dictItem-Body {
    padding: 0 3px;
}
.dictItemHead {
    background: #eee;
    border-radius: 6px;
    padding: 6px;
    height: auto;
}
.dictPanel-Root {
    box-shadow: rgba(0,0,0,0.2) 0 7px 21px 2px;
}
5405 次点击
所在节点    分享创造
29 条回复
sephinh
2021-03-26 18:43:27 +08:00
漂亮,支持
hei1000
2021-03-26 20:05:54 +08:00
之前没注意,原来还可以自定义
hei1000
2021-03-26 21:48:52 +08:00
@hei1000 #22 补帖,加了这个配置,工具栏点击图标查询窗口不见了
ThinkTwive
2021-03-26 23:59:47 +08:00
@hei1000 改了下楼主的配置 保留下搜索框
`css
.menuBar-SearchBox_Wrap input{
color:black;
},
.menuBar-Btn[title="查单词"] {
display: true;
}
`
hei1000
2021-03-27 11:50:46 +08:00
@ThinkTwive #24 Thanks.
suibianzai
2021-03-29 09:29:39 +08:00
@ThinkTwive
请问如何保留搜索框?我加了这段还是没有搜索框,能否贴一下又搜索框的完整代码呀?感谢
Conte
2021-03-29 10:13:31 +08:00
@suibianzai #26

结合楼主和楼上的补个有搜索框的完整版:
```

.menuBar {
background-color: #fff;
border-bottom: 1px solid #eee;
padding: 8px;
}
.menuBar-Btn_Icon,.menuBar-Btn_Icon-fav {
fill: #222;
}
.mtaBox-TextArea-Wrap,
.mtaBox-DrawerBtn,
.waveformBox.saladict-external,
.dictItemHead-Logo {
display: none;
}
.menuBar-SearchBox_Wrap input{
color:black;
background: #eee;
},
.menuBar-Btn[title="查单词"] {
display: true;
}
.dictItem {
padding: 0 10px;
}
.dictItem:first-child {
padding-top: 10px;
}
.dictItem-Body {
padding: 0 3px;
}
.dictItemHead {
background: #eee;
border-radius: 6px;
padding: 6px;
height: auto;
}
.dictPanel-Root {
box-shadow: rgba(0,0,0,0.2) 0 7px 21px 2px;
}

```
suibianzai
2021-03-29 14:05:00 +08:00
@Conte 谢谢~
Seyee
2022-06-21 14:47:43 +08:00
楼上样式的历史记录按钮看不清,我也补充修改了一下,优化了一下输入框样式,不喜欢输入框宽度一直变,所以写死了,不想要的可以去掉最后一部分。

.menuBar {
background-color: #fff;
border-bottom: 1px solid #eee;
padding: 8px;
}
.menuBar-Btn_Icon,.menuBar-Btn_Icon-fav {
fill: #222;
}
.mtaBox-TextArea-Wrap,
.mtaBox-DrawerBtn,
.waveformBox.saladict-external,
.dictItemHead-Logo {
display: none;
}
.menuBar-SearchBox_Wrap input{
color:black;
background: #eee;
padding: 5px;
border-radius:6px;
},
.menuBar-Btn[title="查单词"] {
display: true;
}
.dictItem {
padding: 0 10px;
}
.dictItem:first-child {
padding-top: 10px;
}
.dictItem-Body {
padding: 0 3px;
}
.dictItemHead {
background: #eee;
border-radius: 6px;
padding: 6px;
height: auto;
}
.dictPanel-Root {
box-shadow: rgba(0,0,0,0.2) 0 7px 21px 2px;
}
.menuBar-Btn_Icon-history{
fill: #333;
}
.menuBar-Btn:hover{
background:transparent;
}
.menuBar-SearchBox_Wrap, .menuBar-SearchBox_Wrap.isExpand{
width: 100px;
flex: none;
}

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/765188

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX