beenull/webvm
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Svelte: Prototype Discord tab

Browse source
This commit is contained in:
Alessandro Pignotti 2024-10-14 07:53:51 +02:00
parent f88f568f7e
commit 5f2fe65fe7
3 changed files with 12 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
src/lib/DiscordTab.svelte Normal file
View file

@ -0,0 +1,8 @@
<script>
import PanelButton from './PanelButton.svelte';
</script>
<h1 class="text-lg font-bold">Discord</h1>
<PanelButton buttonIcon="assets/discord-mark-blue.svg" clickUrl="https://discord.gg/yTNZgySKGa" buttonText="Join us on Discord"/>
<p>Do you have any question about WebVM or CheerpX?</p>
<p>Join our community, we are happy to help!</p>

2
src/lib/PanelButton.svelte
View file

@ -7,4 +7,4 @@
export let buttonIcon; export let buttonIcon;
</script> </script>
<a href={clickUrl} target="_blank" on:click={clickHandler} on:contextmenu={rightClickHandler}><p class="bg-neutral-700 p-2 rounded-md {(clickUrl != null || clickHandler != null) ? "hover:bg-neutral-500 cursor-pointer" : ""}" title={buttonTooltip}><img src={buttonIcon} class="inline w-8"/><span class="ml-1">{buttonText}</span></p></a> <a href={clickUrl} target="_blank" on:click={clickHandler} on:contextmenu={rightClickHandler}><p class="bg-neutral-700 p-2 rounded-md {(clickUrl != null || clickHandler != null) ? "hover:bg-neutral-500 cursor-pointer" : ""}" title={buttonTooltip}><img src={buttonIcon} class="inline w-8 h-8"/><span class="ml-1">{buttonText}</span></p></a>

3
src/lib/SideBar.svelte
View file

@ -3,6 +3,7 @@
import NetworkingTab from './NetworkingTab.svelte'; import NetworkingTab from './NetworkingTab.svelte';
import CpuTab from './CpuTab.svelte'; import CpuTab from './CpuTab.svelte';
import DiskTab from './DiskTab.svelte'; import DiskTab from './DiskTab.svelte';
import DiscordTab from './DiscordTab.svelte';
import { cpuActivity, diskActivity } from './activities.js' import { cpuActivity, diskActivity } from './activities.js'
const icons = [ const icons = [
@ -48,6 +49,8 @@
<CpuTab/> <CpuTab/>
{:else if activeInfo === 'Disk'} {:else if activeInfo === 'Disk'}
<DiskTab/> <DiskTab/>
{:else if activeInfo === 'Discord'}
<DiscordTab/>
{:else} {:else}
<p>{activeInfo}</p> <p>{activeInfo}</p>
{/if} {/if}