vuepress-plugin-md-power 1.0.0-rc.100 → 1.0.0-rc.101
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/client/components/FileTreeItem.vue +30 -16
- package/lib/node/index.js +790 -646
- package/package.json +4 -4
|
@@ -10,7 +10,10 @@ const props = defineProps<{
|
|
|
10
10
|
const active = ref(!!props.expanded)
|
|
11
11
|
const el = ref<HTMLElement>()
|
|
12
12
|
|
|
13
|
-
function toggle() {
|
|
13
|
+
function toggle(e: HTMLElementEventMap['click']) {
|
|
14
|
+
const target = e.target as HTMLElement
|
|
15
|
+
if (target.matches('.comment'))
|
|
16
|
+
return
|
|
14
17
|
active.value = !active.value
|
|
15
18
|
}
|
|
16
19
|
|
|
@@ -18,14 +21,20 @@ onMounted(() => {
|
|
|
18
21
|
if (!el.value || props.type !== 'folder')
|
|
19
22
|
return
|
|
20
23
|
|
|
21
|
-
el.value.querySelector('.tree-node.folder')?.addEventListener(
|
|
24
|
+
el.value.querySelector('.tree-node.folder')?.addEventListener(
|
|
25
|
+
'click',
|
|
26
|
+
toggle as EventListener,
|
|
27
|
+
)
|
|
22
28
|
})
|
|
23
29
|
|
|
24
30
|
onUnmounted(() => {
|
|
25
31
|
if (!el.value || props.type !== 'folder')
|
|
26
32
|
return
|
|
27
33
|
|
|
28
|
-
el.value.querySelector('.tree-node.folder')?.removeEventListener(
|
|
34
|
+
el.value.querySelector('.tree-node.folder')?.removeEventListener(
|
|
35
|
+
'click',
|
|
36
|
+
toggle as EventListener,
|
|
37
|
+
)
|
|
29
38
|
})
|
|
30
39
|
</script>
|
|
31
40
|
|
|
@@ -114,6 +123,7 @@ onUnmounted(() => {
|
|
|
114
123
|
width: 10px;
|
|
115
124
|
height: 10px;
|
|
116
125
|
color: var(--vp-c-text-3);
|
|
126
|
+
cursor: pointer;
|
|
117
127
|
content: "";
|
|
118
128
|
background-color: currentcolor;
|
|
119
129
|
-webkit-mask: var(--icon) no-repeat;
|
|
@@ -124,9 +134,19 @@ onUnmounted(() => {
|
|
|
124
134
|
}
|
|
125
135
|
|
|
126
136
|
.file-tree-item .tree-node .name.focus {
|
|
137
|
+
position: relative;
|
|
138
|
+
padding: 0 4px;
|
|
139
|
+
margin: 0 -4px;
|
|
127
140
|
font-weight: bold;
|
|
128
|
-
color: var(--vp-c-
|
|
129
|
-
|
|
141
|
+
color: var(--vp-c-bg);
|
|
142
|
+
background-color: var(--vp-c-brand-2);
|
|
143
|
+
border-radius: 4px;
|
|
144
|
+
transition: color var(--t-color), background-color var(--t-color);
|
|
145
|
+
}
|
|
146
|
+
|
|
147
|
+
.file-tree-item .tree-node .name.focus:hover {
|
|
148
|
+
color: var(--vp-c-bg);
|
|
149
|
+
background-color: var(--vp-c-brand-1);
|
|
130
150
|
}
|
|
131
151
|
|
|
132
152
|
.file-tree-item .tree-node .comment {
|
|
@@ -136,19 +156,13 @@ onUnmounted(() => {
|
|
|
136
156
|
transition: color var(--t-color);
|
|
137
157
|
}
|
|
138
158
|
|
|
139
|
-
.file-tree-item .tree-node [class*="
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
color: var(--vp-c-text-2);
|
|
144
|
-
background-color: currentcolor;
|
|
145
|
-
-webkit-mask: var(--icon) no-repeat;
|
|
146
|
-
mask: var(--icon) no-repeat;
|
|
147
|
-
-webkit-mask-size: 100% 100%;
|
|
148
|
-
mask-size: 100% 100%;
|
|
159
|
+
.file-tree-item .tree-node [class*="vpi-"] {
|
|
160
|
+
width: 1.2em;
|
|
161
|
+
height: 1.2em;
|
|
162
|
+
margin: 0;
|
|
149
163
|
}
|
|
150
164
|
|
|
151
|
-
.file-tree-item .tree-node.folder [class*="
|
|
165
|
+
.file-tree-item .tree-node.folder [class*="vpi-"] {
|
|
152
166
|
cursor: pointer;
|
|
153
167
|
}
|
|
154
168
|
|