Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

DOM 树中区分不同弹出搜索菜单 #4575

Closed
Zuoqiu-Yingyi opened this issue Apr 11, 2022 · 6 comments
Closed

DOM 树中区分不同弹出搜索菜单 #4575

Zuoqiu-Yingyi opened this issue Apr 11, 2022 · 6 comments
Assignees
Milestone

Comments

@Zuoqiu-Yingyi
Copy link
Contributor

在什么情况下你需要该特性? In what scenarios do you need this function?

目前 / 菜单, [[ 菜单, {{ 菜单与 : 菜单的 CSS 选择器完全相同, 均为 #layouts div.b3-menu.b3-list.b3-list--background, 导致在主题开发中无法分别进行优化, 比如

  • / 菜单内容长度固定, 可以使用 column-count: 4; 属性分为四列显示, 便于选择
  • [[ 菜单与 {{ 菜单查询结果可能长度非常长, 需要较宽的宽度一列显示

描述可能的最优解决方案 Describe the optimal solution

使用不同的 id 区分不同搜索菜单面板的容器

描述候选的解决方案 Describe the candidate solution

使用不同的 class 区分不同搜索菜单面板的容器

其他信息 Other information

@Vanessa219 Vanessa219 self-assigned this Apr 11, 2022
@Vanessa219 Vanessa219 added this to the 2.0.0 milestone Apr 11, 2022
@Vanessa219
Copy link
Member

为 / 菜单添加 hint--menu,表情目前带有 emojis,其余使用现状

@Zuoqiu-Yingyi
Copy link
Contributor Author

为 / 菜单添加 hint--menu,表情目前带有 emojis,其余使用现状

在文档中的 emojis 选择菜单的 DOM 结构如下所示, 将 / 菜单分多栏时 emojis 选择菜单也会分栏, 所以文档内的 emojis 选择菜单可能还是需要一个选择器😂

<div class="b3-menu b3-list b3-list--background hint--menu">
    <div class="emojis"></div>
</div>

@Vanessa219
Copy link
Member

这个结构下面的内容为 emojis,和列表是不一样的。应该不用区分了吧?

@Zuoqiu-Yingyi
Copy link
Contributor Author

这个结构下面的内容为 emojis,和列表是不一样的。应该不用区分了吧?

像这种在 .emojis 上层的样式是没法通过 .emojis 选择器取消的~

.b3-menu.b3-list.b3-list--background.hint--menu {
    column-count: 4;
}

@Vanessa219
Copy link
Member

加这个试试

.b3-menu.b3-list.b3-list--background.hint--menu .emojis {
    column-span: all;
}

@Zuoqiu-Yingyi
Copy link
Contributor Author

加这个试试

.b3-menu.b3-list.b3-list--background.hint--menu .emojis {
    column-span: all;
}

感谢, 忘了还有这个方案 ( ´・ω・)ノ❤

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants