disabled some dropdown buttons
mellbacon committed
Apr 29, 2023 at 16:05 UTC
77d694c33b452a37e181a35163a57d779c28d41a
2 files changed
+26
-18
src/lib/Header.svelte
+17
-17
@@ -9,7 +9,7 @@
9
{name: "Open File...", shortcut: "Ctrl + O", action: () => {console.log("click")}},
10
{name: "Save File", shortcut: "Ctrl + S", action: () => {console.log("click")}},
11
{name: "Save File As...", shortcut: "Ctrl + Shift + S", action: () => {console.log("click")}},
12
- {name: "Close Tab", shortcut: "", action: () => {console.log("click")}},
12
+ {name: "Close Tab", disabled: true, shortcut: "", action: () => {console.log("click")}},
13
]},
14
{menuname: "Edit", children: [
15
{name: "Undo", shortcut: "Ctrl + Z", action: () => {console.log("click")}},
@@ -17,38 +17,38 @@
17
{name: "Cut", shortcut: "Ctrl + X", action: () => {console.log("click")}},
18
{name: "Copy", shortcut: "Ctrl + C", action: () => {console.log("click")}},
19
{name: "Paste", shortcut: "Ctrl + V", action: () => {console.log("click")}},
20
- {name: "Paste From History...", shortcut: "Ctrl + Shift + V", action: () => {console.log("click")}},
20
+ {name: "Paste From History...", disabled: true, shortcut: "Ctrl + Shift + V", action: () => {console.log("click")}},
21
{name: "Delete", shortcut: "Delete", action: () => {console.log("click")}},
22
- {name: "Find", shortcut: "Ctrl + F", action: () => {console.log("click")}},
23
- {name: "Replace", shortcut: "Ctrl + H", action: () => {console.log("click")}},
22
+ {name: "Find", disabled: true, shortcut: "Ctrl + F", action: () => {console.log("click")}},
23
+ {name: "Replace", disabled: true, shortcut: "Ctrl + H", action: () => {console.log("click")}},
24
]},
25
{menuname: "View", children: [
26
- {name: "Command Pallete", shortcut: "Ctrl + Shift + P", action: () => {console.log("click")}},
26
+ {name: "Command Pallete", disabled: true, shortcut: "Ctrl + Shift + P", action: () => {console.log("click")}},
27
{name: "Zoom In", shortcut: "Ctrl +", action: () => {console.log("click")}},
28
{name: "Zoom Out", shortcut: "Ctrl -", action: () => {console.log("click")}},
29
{name: "Reset Zoom", shortcut: "", action: () => {console.log("click")}},
30
{name: "Fullscreen", shortcut: "F11", action: () => {console.log("click")}},
31
]},
32
{menuname: "Run", children: [
33
- {name: "Run File", shortcut: "F5", action: () => {console.log("click")}},
34
- {name: "Debug File", shortcut: "Ctrl + F5", action: () => {console.log("click")}},
35
- {name: "Stop File", shortcut: "Shift + F5", action: () => {console.log("click")}},
36
- {name: "Open Configurations", shortcut: "", action: () => {console.log("click")}},
33
+ {name: "Run File", disabled: true, shortcut: "F5", action: () => {console.log("click")}},
34
+ {name: "Debug File", disabled: true, shortcut: "Ctrl + F5", action: () => {console.log("click")}},
35
+ {name: "Stop File", disabled: true, shortcut: "Shift + F5", action: () => {console.log("click")}},
36
+ {name: "Open Configurations", disabled: true, shortcut: "", action: () => {console.log("click")}},
37
]},
38
{menuname: "Window", children: [
39
- {name: "New Window", shortcut: "Ctrl + Shift + N", action: () => {console.log("click")}},
39
+ {name: "New Window", disabled: true, shortcut: "Ctrl + Shift + N", action: () => {console.log("click")}},
40
{name: "Minimize Window", shortcut: "", action: () => {console.log("click")}},
41
{name: "Maximize Window", shortcut: "", action: () => {console.log("click")}},
42
{name: "Close Window", shortcut: "Alt + F4", action: () => {console.log("click")}},
43
]},
44
{menuname: "Help", children: [
45
- {name: "Send Feedback", shortcut: "", action: () => {console.log("click")}},
46
- {name: "Contact Support", shortcut: "", action: () => {console.log("click")}},
47
- {name: "Report Issue", shortcut: "", action: () => {console.log("click")}},
48
- {name: "Documentation", shortcut: "", action: () => {console.log("click")}},
49
- {name: "Show Release Notes", shortcut: "", action: () => {console.log("click")}},
50
- {name: "Check for Updates", shortcut: "", action: () => {console.log("click")}},
51
- {name: "About", shortcut: "", action: () => {console.log("click")}},
45
+ {name: "Send Feedback", disabled: true, shortcut: "", action: () => {console.log("click")}},
46
+ {name: "Contact Support", disabled: true, shortcut: "", action: () => {console.log("click")}},
47
+ {name: "Report Issue", disabled: true, shortcut: "", action: () => {console.log("click")}},
48
+ {name: "Documentation", disabled: true, shortcut: "", action: () => {console.log("click")}},
49
+ {name: "Show Release Notes", disabled: true, shortcut: "", action: () => {console.log("click")}},
50
+ {name: "Check for Updates", disabled: true, shortcut: "", action: () => {console.log("click")}},
51
+ {name: "About", disabled: true, shortcut: "", action: () => {console.log("click")}},
52
{name: "Toggle Developer Tools", shortcut: "Ctrl + Shift + I", action: () => {console.log("click")}},
53
]},
54
];
src/lib/utility/Dropdown.svelte
+9
-1
@@ -35,7 +35,11 @@
35
<div bind:this={dropdownList} class="dropdown-list">
36
{#each menu.children as child}
37
<!-- svelte-ignore a11y-click-events-have-key-events -->
38
- <div class="dropdown-item" on:click={child.action}>
38
+ <div class="dropdown-item" class:disabled={child.disabled} on:click={() => {
39
+ if (!child.disabled) {
40
+ child.action();
41
+ }
42
+ }}>
43
<span class="item-name">
44
{child.name}
45
</span>
@@ -88,4 +92,8 @@
92
color: #8c8c8c;
93
margin-left: 20px;
94
}
95
+ .disabled {
96
+ color: #6b6b6b;
97
+ cursor: not-allowed;
98
+ }
99
</style>
\ No newline at end of file