[css] “转换为”二级菜单上移至一级菜单

2.0 版本效果

每行 6 个按钮：

CSS 片段

/* “转换为”二级菜单上移至一级菜单 2.0 CSS片段 */
.b3-menu__items > button[data-id="turnInto"]:first-of-type {
    padding: 0;
}
.b3-menu__items > button[data-id="turnInto"]:first-of-type:is(.b3-menu__item--show, .b3-menu__item--current) {
    background-color: inherit;
}
.b3-menu__items > button[data-id="turnInto"]:first-of-type .b3-menu__submenu {
    display: block;
    display: contents;
}
.b3-menu__items > button[data-id="turnInto"]:first-of-type .b3-menu__items {
    display: grid;
    grid-template-columns: repeat(6, 1fr); /* 每行6个等宽列 */
    gap: 4px; /* 按钮间距 */
    width: 100%;
    padding: 0 0 2px 0;
}
.b3-menu__items > button[data-id="turnInto"]:first-of-type .b3-menu__item {
    justify-content: center;
    min-width: unset;
    align-items: center;
    padding: 8px 4px; /* 按钮内边距 */
}
.b3-menu__items > button[data-id="turnInto"]:first-of-type .b3-menu__item .b3-menu__icon {
    margin: 0;
}
.b3-menu__items > button[data-id="turnInto"]:first-of-type > :is(.b3-menu__icon, .b3-menu__label),
.b3-menu__items > button[data-id="turnInto"]:first-of-type .b3-menu__items :is(.b3-menu__label, .b3-menu__accelerator) {
    display: none;
}

1.0 版本效果

CSS 片段

/* “转换为”二级菜单上移至一级菜单 1.0 CSS片段 */
.b3-menu__items > button[data-id="turnInto"]:first-of-type {
    height: 30px;
    padding: 0;
}
.b3-menu__items > button[data-id="turnInto"]:first-of-type:is(.b3-menu__item--show, .b3-menu__item--current) {
    background-color: inherit;
}
.b3-menu__items > button[data-id="turnInto"]:first-of-type .b3-menu__submenu {
    display: block;
    display: contents;
}
.b3-menu__items > button[data-id="turnInto"]:first-of-type .b3-menu__items {
    display: flex;
    flex-direction: row;
    width: 100%;
    padding: 0;
}
.b3-menu__items > button[data-id="turnInto"]:first-of-type .b3-menu__item {
    justify-content: center;
    min-width: unset;
}
.b3-menu__items > button[data-id="turnInto"]:first-of-type .b3-menu__item .b3-menu__icon {
    margin: 0;
}
.b3-menu__items > button[data-id="turnInto"]:first-of-type > :is(.b3-menu__icon, .b3-menu__label),
.b3-menu__items > button[data-id="turnInto"]:first-of-type .b3-menu__items :is(.b3-menu__label, .b3-menu__accelerator) {
    display: none;
}