refactor: move style files to "styles" folder
fix: adjust light/dark theme in windows
This commit is contained in:
parent
7eebb02656
commit
5750170f5e
|
@ -5,8 +5,8 @@ Tiny RDM is a modern lightweight cross-platform Redis desktop manager available
|
||||||
![](screenshots/light_en.png)
|
![](screenshots/light_en.png)
|
||||||
|
|
||||||
## Feature
|
## Feature
|
||||||
* Built on Webview, no embedded browsers (Thanks to Wails).
|
* Built on Webview, no embedded browsers (Thanks to [Wails](https://github.com/wailsapp/wails)).
|
||||||
* More elegant UI and visualized layout (Thanks to Naive UI).
|
* More elegant UI and visualized layout (Thanks to [Naive UI](https://github.com/tusen-ai/naive-ui)).
|
||||||
* Multi-language support (Click here to contribute and support more languages).
|
* Multi-language support (Click here to contribute and support more languages).
|
||||||
* Convenient data viewing and editing.
|
* Convenient data viewing and editing.
|
||||||
* More features under continuous development...
|
* More features under continuous development...
|
||||||
|
|
|
@ -6,8 +6,8 @@ Tiny RDM是一个现代化轻量级的跨平台Redis桌面客户端,支持Mac
|
||||||
|
|
||||||
## 功能特性
|
## 功能特性
|
||||||
|
|
||||||
* 基于Webview,无内嵌浏览器(感谢Wails)
|
* 基于Webview,无内嵌浏览器(感谢[Wails](https://github.com/wailsapp/wails))
|
||||||
* 更精美的界面和直观的结构布局(感谢Naive UI)
|
* 更精美的界面和直观的结构布局(感谢[Naive UI](https://github.com/tusen-ai/naive-ui))
|
||||||
* 多国语言支持(点我贡献和完善多国语言支持)
|
* 多国语言支持(点我贡献和完善多国语言支持)
|
||||||
* 便捷的数据查看和编辑修改
|
* 便捷的数据查看和编辑修改
|
||||||
* 更多功能持续开发中…
|
* 更多功能持续开发中…
|
||||||
|
|
|
@ -21,7 +21,7 @@ func NewPreferences() *PreferencesStorage {
|
||||||
func (p *PreferencesStorage) DefaultPreferences() map[string]any {
|
func (p *PreferencesStorage) DefaultPreferences() map[string]any {
|
||||||
return map[string]any{
|
return map[string]any{
|
||||||
"general": map[string]any{
|
"general": map[string]any{
|
||||||
"language": "en",
|
"language": "auto",
|
||||||
"font": "",
|
"font": "",
|
||||||
"font_size": 14,
|
"font_size": 14,
|
||||||
"use_sys_proxy": false,
|
"use_sys_proxy": false,
|
||||||
|
|
|
@ -4,7 +4,7 @@
|
||||||
<meta charset='UTF-8' />
|
<meta charset='UTF-8' />
|
||||||
<meta content='width=device-width, initial-scale=1.0' name='viewport' />
|
<meta content='width=device-width, initial-scale=1.0' name='viewport' />
|
||||||
<title>Tiny RDM</title>
|
<title>Tiny RDM</title>
|
||||||
<!-- <link href="./src/style.scss" rel="stylesheet">-->
|
<!-- <link href="./src/styles/style.scss" rel="stylesheet">-->
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div id='app'></div>
|
<div id='app'></div>
|
||||||
|
|
|
@ -17,6 +17,7 @@ import useConnectionStore from './stores/connections.js'
|
||||||
import { useI18n } from 'vue-i18n'
|
import { useI18n } from 'vue-i18n'
|
||||||
import { darkTheme, lightTheme, useOsTheme } from 'naive-ui'
|
import { darkTheme, lightTheme, useOsTheme } from 'naive-ui'
|
||||||
import KeyFilterDialog from './components/dialogs/KeyFilterDialog.vue'
|
import KeyFilterDialog from './components/dialogs/KeyFilterDialog.vue'
|
||||||
|
import { WindowSetDarkTheme, WindowSetLightTheme } from '../wailsjs/runtime/runtime.js'
|
||||||
|
|
||||||
hljs.registerLanguage('json', json)
|
hljs.registerLanguage('json', json)
|
||||||
hljs.registerLanguage('plaintext', plaintext)
|
hljs.registerLanguage('plaintext', plaintext)
|
||||||
|
@ -66,11 +67,14 @@ const osTheme = useOsTheme()
|
||||||
const theme = computed(() => {
|
const theme = computed(() => {
|
||||||
if (prefStore.general.theme === 'auto') {
|
if (prefStore.general.theme === 'auto') {
|
||||||
if (osTheme.value === 'dark') {
|
if (osTheme.value === 'dark') {
|
||||||
|
WindowSetDarkTheme()
|
||||||
return darkTheme
|
return darkTheme
|
||||||
}
|
}
|
||||||
} else if (prefStore.general.theme === 'dark') {
|
} else if (prefStore.general.theme === 'dark') {
|
||||||
|
WindowSetDarkTheme()
|
||||||
return darkTheme
|
return darkTheme
|
||||||
}
|
}
|
||||||
|
WindowSetLightTheme()
|
||||||
return lightTheme
|
return lightTheme
|
||||||
})
|
})
|
||||||
</script>
|
</script>
|
||||||
|
|
|
@ -103,7 +103,7 @@ const dragging = computed(() => {
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- log page -->
|
<!-- log page -->
|
||||||
<div v-if="tabStore.nav === 'log'" class="flex-box-h flex-item-expand">
|
<div v-show="tabStore.nav === 'log'" class="flex-box-h flex-item-expand">
|
||||||
<keep-alive>
|
<keep-alive>
|
||||||
<content-log-pane class="flex-item-expand" />
|
<content-log-pane class="flex-item-expand" />
|
||||||
</keep-alive>
|
</keep-alive>
|
||||||
|
|
|
@ -35,7 +35,7 @@ const loadHistory = () => {
|
||||||
connectionStore
|
connectionStore
|
||||||
.getCmdHistory()
|
.getCmdHistory()
|
||||||
.then((list) => {
|
.then((list) => {
|
||||||
data.history = list
|
data.history = list || []
|
||||||
})
|
})
|
||||||
.finally(() => {
|
.finally(() => {
|
||||||
data.loading = false
|
data.loading = false
|
||||||
|
|
|
@ -63,6 +63,7 @@ const onClose = () => {
|
||||||
:close-on-esc="false"
|
:close-on-esc="false"
|
||||||
:mask-closable="false"
|
:mask-closable="false"
|
||||||
:show-icon="false"
|
:show-icon="false"
|
||||||
|
:auto-focus="false"
|
||||||
:title="$t('preferences')"
|
:title="$t('preferences')"
|
||||||
preset="dialog"
|
preset="dialog"
|
||||||
transform-origin="center"
|
transform-origin="center"
|
||||||
|
|
|
@ -25,7 +25,7 @@ const onUpdate = (val) => {
|
||||||
val = reject(val, { key: '' })
|
val = reject(val, { key: '' })
|
||||||
emit(
|
emit(
|
||||||
'update:value',
|
'update:value',
|
||||||
flatMap(val, (item) => [item.key, item.value])
|
flatMap(val, (item) => [item.key, item.value]),
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -68,10 +68,6 @@ const preferencesOptions = computed(() => {
|
||||||
key: 'help',
|
key: 'help',
|
||||||
icon: renderIcon(Help),
|
icon: renderIcon(Help),
|
||||||
},
|
},
|
||||||
{
|
|
||||||
label: i18n.t('about'),
|
|
||||||
key: 'about',
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
label: i18n.t('check_update'),
|
label: i18n.t('check_update'),
|
||||||
key: 'update',
|
key: 'update',
|
||||||
|
|
|
@ -7,6 +7,7 @@
|
||||||
"warning": "Warning",
|
"warning": "Warning",
|
||||||
"save": "Save",
|
"save": "Save",
|
||||||
"none": "None",
|
"none": "None",
|
||||||
|
"default": "Default",
|
||||||
"new_conn": "Add New Connection",
|
"new_conn": "Add New Connection",
|
||||||
"new_group": "Add New Group",
|
"new_group": "Add New Group",
|
||||||
"rename_group": "Rename Group",
|
"rename_group": "Rename Group",
|
||||||
|
@ -135,7 +136,6 @@
|
||||||
"server": "Server",
|
"server": "Server",
|
||||||
"browser": "Browser",
|
"browser": "Browser",
|
||||||
"log": "Log",
|
"log": "Log",
|
||||||
"about": "About",
|
|
||||||
"help": "Help",
|
"help": "Help",
|
||||||
"check_update": "Check for Updates...",
|
"check_update": "Check for Updates...",
|
||||||
"auto_refresh": "Auto Refresh",
|
"auto_refresh": "Auto Refresh",
|
||||||
|
|
|
@ -7,6 +7,7 @@
|
||||||
"warning": "警告",
|
"warning": "警告",
|
||||||
"save": "保存",
|
"save": "保存",
|
||||||
"none": "无",
|
"none": "无",
|
||||||
|
"default": "默认",
|
||||||
"new_conn": "添加新连接",
|
"new_conn": "添加新连接",
|
||||||
"new_group": "添加新分组",
|
"new_group": "添加新分组",
|
||||||
"rename_group": "重命名分组",
|
"rename_group": "重命名分组",
|
||||||
|
@ -137,7 +138,6 @@
|
||||||
"server": "服务器",
|
"server": "服务器",
|
||||||
"browser": "浏览器",
|
"browser": "浏览器",
|
||||||
"log": "日志",
|
"log": "日志",
|
||||||
"about": "关于",
|
|
||||||
"help": "帮助",
|
"help": "帮助",
|
||||||
"check_update": "检查更新...",
|
"check_update": "检查更新...",
|
||||||
"auto_refresh": "自动刷新",
|
"auto_refresh": "自动刷新",
|
||||||
|
|
|
@ -3,7 +3,7 @@ import { createApp } from 'vue'
|
||||||
import { createI18n } from 'vue-i18n'
|
import { createI18n } from 'vue-i18n'
|
||||||
import App from './App.vue'
|
import App from './App.vue'
|
||||||
import { lang } from './langs'
|
import { lang } from './langs'
|
||||||
import './style.scss'
|
import './styles/style.scss'
|
||||||
import dayjs from 'dayjs'
|
import dayjs from 'dayjs'
|
||||||
import duration from 'dayjs/plugin/duration'
|
import duration from 'dayjs/plugin/duration'
|
||||||
import relativeTime from 'dayjs/plugin/relativeTime'
|
import relativeTime from 'dayjs/plugin/relativeTime'
|
||||||
|
@ -21,7 +21,7 @@ app.use(
|
||||||
messages: {
|
messages: {
|
||||||
...lang,
|
...lang,
|
||||||
},
|
},
|
||||||
})
|
}),
|
||||||
)
|
)
|
||||||
app.use(createPinia())
|
app.use(createPinia())
|
||||||
app.mount('#app')
|
app.mount('#app')
|
||||||
|
|
|
@ -96,7 +96,7 @@ const usePreferencesStore = defineStore('preferences', {
|
||||||
}))
|
}))
|
||||||
option.splice(0, 0, {
|
option.splice(0, 0, {
|
||||||
value: '',
|
value: '',
|
||||||
label: i18n.t('none'),
|
label: i18n.t('default'),
|
||||||
path: '',
|
path: '',
|
||||||
})
|
})
|
||||||
return option
|
return option
|
||||||
|
|
|
@ -28,7 +28,7 @@ body {
|
||||||
font-style: normal;
|
font-style: normal;
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
src: local(""),
|
src: local(""),
|
||||||
url("assets/fonts/nunito-v16-latin-regular.woff2") format("woff2");
|
url("../assets/fonts/nunito-v16-latin-regular.woff2") format("woff2");
|
||||||
}
|
}
|
||||||
|
|
||||||
#app {
|
#app {
|
|
@ -5,6 +5,7 @@ import { NaiveUiResolver } from 'unplugin-vue-components/resolvers'
|
||||||
import Components from 'unplugin-vue-components/vite'
|
import Components from 'unplugin-vue-components/vite'
|
||||||
import { defineConfig } from 'vite'
|
import { defineConfig } from 'vite'
|
||||||
|
|
||||||
|
const rootPath = new URL('.', import.meta.url).pathname
|
||||||
// https://vitejs.dev/config/
|
// https://vitejs.dev/config/
|
||||||
export default defineConfig({
|
export default defineConfig({
|
||||||
plugins: [
|
plugins: [
|
||||||
|
@ -21,4 +22,9 @@ export default defineConfig({
|
||||||
}),
|
}),
|
||||||
Icons(),
|
Icons(),
|
||||||
],
|
],
|
||||||
|
resolve: {
|
||||||
|
alias: {
|
||||||
|
'@': rootPath + 'src',
|
||||||
|
},
|
||||||
|
},
|
||||||
})
|
})
|
||||||
|
|
18
main.go
18
main.go
|
@ -4,21 +4,33 @@ import (
|
||||||
"context"
|
"context"
|
||||||
"embed"
|
"embed"
|
||||||
"github.com/wailsapp/wails/v2"
|
"github.com/wailsapp/wails/v2"
|
||||||
|
"github.com/wailsapp/wails/v2/pkg/menu"
|
||||||
"github.com/wailsapp/wails/v2/pkg/options"
|
"github.com/wailsapp/wails/v2/pkg/options"
|
||||||
"github.com/wailsapp/wails/v2/pkg/options/assetserver"
|
"github.com/wailsapp/wails/v2/pkg/options/assetserver"
|
||||||
"github.com/wailsapp/wails/v2/pkg/options/mac"
|
"github.com/wailsapp/wails/v2/pkg/options/mac"
|
||||||
|
"runtime"
|
||||||
"tinyrdm/backend/services"
|
"tinyrdm/backend/services"
|
||||||
)
|
)
|
||||||
|
|
||||||
//go:embed all:frontend/dist
|
//go:embed all:frontend/dist
|
||||||
var assets embed.FS
|
var assets embed.FS
|
||||||
|
|
||||||
|
//go:embed build/appicon.png
|
||||||
|
var icon []byte
|
||||||
|
|
||||||
func main() {
|
func main() {
|
||||||
// Create an instance of the app structure
|
// Create an instance of the app structure
|
||||||
app := NewApp()
|
app := NewApp()
|
||||||
connSvc := services.Connection()
|
connSvc := services.Connection()
|
||||||
prefSvc := services.Preferences()
|
prefSvc := services.Preferences()
|
||||||
|
|
||||||
|
// menu
|
||||||
|
appMenu := menu.NewMenu()
|
||||||
|
if runtime.GOOS == "darwin" {
|
||||||
|
appMenu.Append(menu.AppMenu())
|
||||||
|
appMenu.Append(menu.EditMenu())
|
||||||
|
}
|
||||||
|
|
||||||
// Create application with options
|
// Create application with options
|
||||||
err := wails.Run(&options.App{
|
err := wails.Run(&options.App{
|
||||||
Title: "Tiny RDM",
|
Title: "Tiny RDM",
|
||||||
|
@ -26,6 +38,7 @@ func main() {
|
||||||
Height: 768,
|
Height: 768,
|
||||||
MinWidth: 1024,
|
MinWidth: 1024,
|
||||||
MinHeight: 768,
|
MinHeight: 768,
|
||||||
|
Menu: appMenu,
|
||||||
AssetServer: &assetserver.Options{
|
AssetServer: &assetserver.Options{
|
||||||
Assets: assets,
|
Assets: assets,
|
||||||
},
|
},
|
||||||
|
@ -51,6 +64,11 @@ func main() {
|
||||||
UseToolbar: false,
|
UseToolbar: false,
|
||||||
HideToolbarSeparator: true,
|
HideToolbarSeparator: true,
|
||||||
},
|
},
|
||||||
|
About: &mac.AboutInfo{
|
||||||
|
Title: "Tiny RDM",
|
||||||
|
Message: "Copyright © 2023",
|
||||||
|
Icon: icon,
|
||||||
|
},
|
||||||
//WebviewIsTransparent: true,
|
//WebviewIsTransparent: true,
|
||||||
//WindowIsTranslucent: true,
|
//WindowIsTranslucent: true,
|
||||||
},
|
},
|
||||||
|
|
13
wails.json
13
wails.json
|
@ -1,13 +1,20 @@
|
||||||
{
|
{
|
||||||
"$schema": "https://wails.io/schemas/config.v2.json",
|
"$schema": "https://wails.io/schemas/config.v2.json",
|
||||||
"name": "Tiny RDM",
|
"name": "Tiny RDM",
|
||||||
"outputfilename": "tiny-rdm",
|
"outputfilename": "Tiny RDM",
|
||||||
"frontend:install": "npm install",
|
"frontend:install": "npm install",
|
||||||
"frontend:build": "npm run build",
|
"frontend:build": "npm run build",
|
||||||
"frontend:dev:watcher": "npm run dev",
|
"frontend:dev:watcher": "npm run dev",
|
||||||
"frontend:dev:serverUrl": "auto",
|
"frontend:dev:serverUrl": "auto",
|
||||||
"author": {
|
"author": {
|
||||||
"name": "Lykin",
|
"name": "tiny-craft",
|
||||||
"email": "huangliu3060@qq.com"
|
"email": "lykinhuang@outlook.com"
|
||||||
|
},
|
||||||
|
"info": {
|
||||||
|
"companyName": "Tiny Craft",
|
||||||
|
"productName": "Tiny RDM",
|
||||||
|
"productVersion": "1.0.0",
|
||||||
|
"copyright": "Copyright © 2023",
|
||||||
|
"comments": "Tiny Redis Desktop Manager"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue