Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
前端资源
Vue Devtools
提交
668f11bf
V
Vue Devtools
项目概览
前端资源
/
Vue Devtools
通知
1
Star
0
Fork
0
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
0
列表
看板
标记
里程碑
合并请求
0
DevOps
流水线
流水线任务
计划
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
V
Vue Devtools
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
0
Issue
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
DevOps
DevOps
流水线
流水线任务
计划
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
流水线任务
提交
Issue看板
前往新版Gitcode,体验更适合开发者的 AI 搜索 >>
提交
668f11bf
编写于
9月 26, 2022
作者:
G
Guillaume Chau
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
feat: more visible collapse/expand pane buttons
上级
b12fac25
变更
1
隐藏空白更改
内联
并排
Showing
1 changed file
with
28 addition
and
12 deletion
+28
-12
packages/app-frontend/src/features/layout/SplitPane.vue
packages/app-frontend/src/features/layout/SplitPane.vue
+28
-12
未找到文件。
packages/app-frontend/src/features/layout/SplitPane.vue
浏览文件 @
668f11bf
...
...
@@ -202,11 +202,20 @@ export default defineComponent({
'left-0 right-0 bottom-0 flex-col': orientation === 'portrait',
}"
>
<VueButton
:icon-left=
"orientation === 'landscape' ? 'arrow_left': 'arrow_drop_up'"
class=
"block icon-button flat pointer-events-auto opacity-40 hover:opacity-100"
<button
v-tooltip=
"rightCollapsed ? `Expand $
{orientation === 'landscape' ? 'Right' : 'Bottom'} pane` : `Collapse ${orientation === 'landscape' ? 'Left' : 'Top'} pane`"
class="bg-white dark:bg-gray-900 border border-gray-200 dark:border-gray-700 flex items-center justify-center w-2.5 h-6 rounded overflow-hidden pointer-events-auto opacity-70 hover:opacity-100"
:class="{
'rounded-r-none border-r-0': orientation === 'landscape',
'rounded-b-none border-b-0': orientation === 'portrait',
}"
@click="collapseLeft()"
/>
>
<VueIcon
:icon=
"orientation === 'landscape' ? 'arrow_left': 'arrow_drop_up'"
class=
"flex-none w-5 h-5"
/>
</button>
</div>
</div>
<div
...
...
@@ -225,11 +234,20 @@ export default defineComponent({
'left-0 right-0 top-0 flex-col': orientation === 'portrait',
}"
>
<VueButton
:icon-left=
"orientation === 'landscape' ? 'arrow_right': 'arrow_drop_down'"
class=
"block icon-button flat pointer-events-auto opacity-40 hover:opacity-100"
<button
v-tooltip=
"leftCollapsed ? `Expand $
{orientation === 'landscape' ? 'Left' : 'Top'} pane` : `Collapse ${orientation === 'landscape' ? 'Right' : 'Bottom'} pane`"
class="bg-white dark:bg-gray-900 border border-gray-200 dark:border-gray-700 flex items-center justify-center w-2.5 h-6 rounded overflow-hidden pointer-events-auto opacity-70 hover:opacity-100"
:class="{
'rounded-l-none border-l-0': orientation === 'landscape',
'rounded-t-none border-t-0': orientation === 'portrait',
}"
@click="collapseRight()"
/>
>
<VueIcon
:icon=
"orientation === 'landscape' ? 'arrow_right': 'arrow_drop_down'"
class=
"flex-none w-5 h-5"
/>
</button>
</div>
<slot
...
...
@@ -282,11 +300,9 @@ export default defineComponent({
}
.collapse-btn {
.icon-button {
@apply w-2.5 h-6 rounded-sm !important;
button {
.portrait & {
@apply w-6 h-2.5
!important
;
@apply w-6 h-2.5;
}
}
}
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录