wancat/linux-odyssey
1
0 Fork 0
mirror of https://github.com/linux-odyssey/linux-odyssey.git synced 2026-11-06 11:30:13 +08:00
Code Issues Packages Projects Releases Wiki Activity

Add tree chart and drag to scroll function

Browse Source
This commit is contained in:
Chen, Tai-Lin committed 2023-08-22 14:32:15 +08:00
1 parent fb826c2f0e
commit ab3014bf4b
6 files changed
+315 -52
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

app/src/components/HeaderPart.vue
+46 -33
View File
@@ -1,38 +1,51 @@
<script setup></script>
<template>
<div class="inline-block">
<button id="stream" class="p-1">
<font-awesome-icon
:icon="['fas', 'bars-staggered']"
class="text-text-primary"
/>
</button>
<button id="backward" class="p-1">
<font-awesome-icon :icon="['fas', 'arrow-left']" class="text-border" />
</button>
<button>
<p class="text-text-primary inline font-bold p-1">1. Command's Basics</p>
</button>
<p class="text-text-primary inline font-bold p-1">‧</p>
<button>
<p class="text-text-primary inline font-bold p-1">
1. Try Your First Command
</p>
</button>
</div>
<div class="float-right inline-block">
<button id="warning" class="p-1">
<font-awesome-icon
:icon="['fas', 'triangle-exclamation']"
class="text-text-primary"
/>
</button>
<button id="setting" class="p-1">
<font-awesome-icon :icon="['fas', 'gear']" class="text-text-primary" />
</button>
<button id="fullscreen" class="p-1">
<font-awesome-icon :icon="['fas', 'expand']" class="text-text-primary" />
</button>
<div class="h-full flex items-center justify-center mx-3">
<div class="flex items-center gap-3">
<button id="stream" class="flex items-center">
<font-awesome-icon
:icon="['fas', 'bars']"
class="text-text-primary h-5 w-5"
/>
</button>
<button id="backward" class="flex items-center">
<font-awesome-icon
:icon="['fas', 'arrow-left']"
class="text-text-line h-5 w-5"
/>
</button>
<button>
<p class="text-text-primary inline-block font-bold whitespace-nowrap">
1. Command's Basics
</p>
</button>
<p class="text-text-primary inline-block font-bold">●</p>
<button>
<p class="text-text-primary inline-block font-bold whitespace-nowrap">
1. Try Your First Command
</p>
</button>
</div>
<div class="h-full w-full flex gap-3 items-center justify-end">
<button id="warning" class="flex items-center">
<font-awesome-icon
:icon="['fas', 'triangle-exclamation']"
class="text-text-primary h-5 w-5"
/>
</button>
<button id="setting" class="flex items-center">
<font-awesome-icon
:icon="['fas', 'gear']"
class="text-text-primary h-5 w-5"
/>
</button>
<button id="fullscreen" class="flex items-center">
<font-awesome-icon
:icon="['fas', 'expand']"
class="text-text-primary h-5 w-5"
/>
</button>
</div>
</div>
</template>