opensource/rustfs-console
3
0
Fork 0
mirror of https://github.com/rustfs/console.git synced 2026-09-19 01:47:44 +08:00
Code Issues Packages Projects Releases Wiki Activity

style: primary color

Browse Source
This commit is contained in:
overtrue
2024-12-19 22:18:01 +08:00
parent fd01174940
commit c3a6df298b
8 changed files with 57 additions and 26 deletions
Download Patch File Download Diff File Expand all files Collapse all files
components/page/header.vue
+1 -1
View File
@@ -1,5 +1,5 @@
<template>
<div class="p-4 px-6 min-h-16 border-b dark:border-neutral-800 flex justify-between bg-gray-100 dark:bg-neutral-900">
<div class="p-4 sticky top-0 z-10 px-6 h-16 border-b dark:border-neutral-800 flex justify-between bg-gray-100 dark:bg-neutral-900">
<slot name="title"></slot>
<slot name="actions"></slot>
</div>
components/sidebar.vue
+7 -5
View File
@@ -34,9 +34,9 @@ const options = computed(() => {
</script>
<template>
<n-layout-sider bordered collapse-mode="width" :collapsed-width="64" :width="240" :native-scrollbar="false" :collapsed="isCollapsed">
<div class="flex flex-col min-h-screen gap-4">
<div class="border-b dark:border-neutral-800 flex flex-wrap max-h-16 items-center p-4" :class="isCollapsed ? 'justify-center' : 'justify-between'">
<n-layout-sider bordered class="min-h-full" collapse-mode="width" :collapsed-width="64" :width="240" :native-scrollbar="false" :collapsed="isCollapsed">
<div class="flex flex-col h-screen overflow-hidden gap-4 relative">
<div class="border-b dark:border-neutral-800 flex flex-wrap h-16 items-center p-4" :class="isCollapsed ? 'justify-center' : 'justify-between'">
<div>
<n-avatar v-if="isCollapsed" class="text-center text-2xl leading-none">{{ appConfig.name.substring(0, 1) }}</n-avatar>
<h2 v-else class="text-center text-2xl">
@@ -49,13 +49,15 @@ const options = computed(() => {
</div>
</div>
<n-menu :indent="26" :root-indent="12" :collapsed-width="64" :collapsed-icon-size="22" :options="options" default-expand-all class="flex-1" />
<div class="overflow-y-auto flex-1">
<n-menu :indent="26" :root-indent="12" :collapsed-width="64" :collapsed-icon-size="22" :options="options" default-expand-all class="flex-1" />
</div>
<div v-if="isCollapsed" class="w-full flex items-center justify-center py-4">
<Icon name="ri:menu-unfold-fill" class="cursor-pointer text-xl" @click="toggleSidebar" />
</div>
<div class="p-4">
<div class="p-4 sticky bottom-0 left-0 right-0">
<UserDropdown :isCollapsed="isCollapsed" />
</div>
</div>