Editor tabs/footer rewrite
mellobacon committed
Nov 25, 2022 at 01:43 UTC
36ac91e97157dcdce12d163a6314ba841481553a
1 file changed
+40
-10
src/components/Footer/Footer.svelte
+40
-10
@@ -15,8 +15,34 @@
15
let langdata = {lang: l.name, tags: l.extensions}
16
langs = [...langs, langdata];
17
}
18
-
18
let showlangs = false;
19
+
20
+ const tools = [
21
+ {name: "Notifications", content: "notifications"}
22
+ ]
23
+
24
+ async function spawnTerminal() {
25
+ let userpath = await homeDir();
26
+ if ($filetree.length > 0) {
27
+ userpath = $filetree[0].path;
28
+ }
29
+ // opens terminal externally for the time being
30
+ invoke("open_terminal", {path: userpath});
31
+ }
32
+</script>
33
+
34
+<script lang="ts" context="module">
35
+ import { writable } from "svelte/store";
36
+ export let showpanel = writable(false);
37
+ let show = false;
38
+
39
+ export let tool = writable({name: "", content: null});
40
+
41
+ export function togglePanel(x) {
42
+ show = !show;
43
+ showpanel.set(show);
44
+ tool.set({name: x.name, content: x.content});
45
+ }
46
</script>
47
48
<div id="footer">
@@ -26,19 +52,23 @@
52
</div>
53
</div>
54
<div id="tools">
29
- <span class="terminal-button tool" on:click={async() => {
30
- let userpath = await homeDir();
31
- if ($filetree.length > 0) {
32
- userpath = $filetree[0].path;
33
- }
34
- // opens terminal externally for the time being
35
- invoke("open_terminal", {path: userpath});
36
- }}><Terminal /> <span class="toolname">Terminal</span></span>
55
+ <!-- svelte-ignore a11y-click-events-have-key-events -->
56
+ <span class="tool" on:click={spawnTerminal}>
57
+ <Terminal />
58
+ <span class="toolname">Terminal</span>
59
+ </span>
60
+ {#each tools as tool}
61
+ <span class="tool">
62
+ <!-- svelte-ignore a11y-click-events-have-key-events -->
63
+ <span class="toolname" on:click={() => {togglePanel(tool)}}>{tool.name}</span>
64
+ </span>
65
+ {/each}
66
</div>
67
{#if $isfile}
68
<div id="codeinfo">
69
<span title="End of Line Sequence">{$linefeed}</span>
70
<span>{$line_info.line} : {$line_info.col}</span>
71
+ <!-- svelte-ignore a11y-click-events-have-key-events -->
72
<span on:click={
73
() => {showlangs = true;}
74
} id="language">{$file_language}</span>
@@ -54,9 +84,9 @@
84
z-index: 8000;
85
width: 100%;
86
display: flex;
57
- height: 1.4rem;
87
align-items: center;
88
border-top: 1px solid #393939;
89
+ font-size: 0.9rem;
90
}
91
#info {
92
display: flex;