diff --git a/package.json b/package.json index cf079cd47..f68d608f8 100644 --- a/package.json +++ b/package.json @@ -9,8 +9,8 @@ "start:api": "yarn workspace dbgate-api start", "start:api:portal": "yarn workspace dbgate-api start:portal", "start:api:covid": "yarn workspace dbgate-api start:covid", - "start:web": "yarn workspace dbgate-web-svelte dev", - "start:sqltree": "yarn workspace dbgate-sqltree start", + "start:web": "yarn workspace dbgate-web dev", + "start:sqltree": "yarn workspace dbgate-sqltree start", "start:tools": "yarn workspace dbgate-tools start", "start:datalib": "yarn workspace dbgate-datalib start", "start:filterparser": "yarn workspace dbgate-filterparser start", diff --git a/packages/web/public/icon-colors.css b/packages/web/public/icon-colors.css new file mode 100644 index 000000000..2619b3211 --- /dev/null +++ b/packages/web/public/icon-colors.css @@ -0,0 +1,23 @@ +.color-icon-blue { + color: var(--theme-icon-blue); +} + +.color-icon-green { + color: var(--theme-icon-green); +} + +.color-icon-red { + color: var(--theme-icon-red); +} + +.color-icon-gold { + color: var(--theme-icon-gold); +} + +.color-icon-yellow { + color: var(--theme-icon-yellow); +} + +.color-icon-magenta { + color: var(--theme-icon-magenta); +} diff --git a/packages/web/public/index.html b/packages/web/public/index.html index a5ba1c3c8..a2cb44ac2 100644 --- a/packages/web/public/index.html +++ b/packages/web/public/index.html @@ -11,6 +11,7 @@ + diff --git a/packages/web/public/theme-dark.css b/packages/web/public/theme-dark.css index 6fdca18ea..1d8d8c7bd 100644 --- a/packages/web/public/theme-dark.css +++ b/packages/web/public/theme-dark.css @@ -1,25 +1,8 @@ .theme-dark { - --theme-font-1: #000000; - --theme-font-2: #4d4d4d; - --theme-font-3: #808080; - --theme-font-4: #b3b3b3; - - --theme-bg-1: #ededed; - --theme-bg-2: #d4d4d4; - --theme-bg-3: #bbbbbb; - --theme-bg-4: #a2a2a2; - - --theme-font-inv-1: #FFFFFF; - --theme-font-inv-2: #b3b3b3; - --theme-font-inv-3: #808080; - --theme-font-inv-4: #4d4d4d; - - --theme-bg-inv-1: #222; - --theme-bg-inv-2: #3c3c3c; - --theme-bg-inv-3: #565656; - --theme-bg-inv-4: #707070; - - --theme-border: #ccc; - - --theme-bg-statusbar-inv: blue; + --theme-icon-blue: #3c9ae8; + --theme-icon-green: #8fd460; + --theme-icon-red: #e84749; + --theme-icon-gold: #e8b339; + --theme-icon-yellow: #e8d639; + --theme-icon-magenta: #e0529c; } diff --git a/packages/web/public/theme-light.css b/packages/web/public/theme-light.css index 099d43420..07aa65596 100644 --- a/packages/web/public/theme-light.css +++ b/packages/web/public/theme-light.css @@ -21,5 +21,14 @@ --theme-border: #ccc; + --theme-bg-hover: #bae7ff; + --theme-bg-statusbar-inv: blue; + + --theme-icon-blue: #096dd9; + --theme-icon-green: #237804; + --theme-icon-red: #cf1322; + --theme-icon-gold: #d48806; + --theme-icon-yellow: #d4b106; + --theme-icon-magenta: #c41d7f; } diff --git a/packages/web/src/appobj/AppObjectCore.svelte b/packages/web/src/appobj/AppObjectCore.svelte index 8f4c7b5c8..7a0a23a5d 100644 --- a/packages/web/src/appobj/AppObjectCore.svelte +++ b/packages/web/src/appobj/AppObjectCore.svelte @@ -12,7 +12,7 @@
- {prefix} + {prefix || ''} {#if isBusy} {:else} @@ -39,6 +39,10 @@ white-space: nowrap; font-weight: normal; } + .main:hover { + background-color: var(--theme-bg-hover); + + } .isBold { font-weight: bold; } @@ -48,6 +52,6 @@ .ext-info { font-weight: normal; margin-left: 5px; - color: vra(--theme-font-3); + color: var(--theme-font-3); } diff --git a/packages/web/src/icons/FontIcon.svelte b/packages/web/src/icons/FontIcon.svelte index 69408790a..a815eb34f 100644 --- a/packages/web/src/icons/FontIcon.svelte +++ b/packages/web/src/icons/FontIcon.svelte @@ -62,38 +62,38 @@ 'icon plugin': 'mdi mdi-toy-brick', 'icon menu': 'mdi mdi-menu', - 'img ok': 'mdi mdi-check-circle color-green-8', - 'img alert': 'mdi mdi-alert-circle color-blue-6', - 'img error': 'mdi mdi-close-circle color-red-7', - 'img warn': 'mdi mdi-alert color-gold-7', + 'img ok': 'mdi mdi-check-circle color-icon-green', + 'img alert': 'mdi mdi-alert-circle color-icon-blue', + 'img error': 'mdi mdi-close-circle color-icon-red', + 'img warn': 'mdi mdi-alert color-icon-gold', // 'img statusbar-ok': 'mdi mdi-check-circle color-on-statusbar-green', - 'img archive': 'mdi mdi-table color-gold-7', - 'img archive-folder': 'mdi mdi-database-outline color-green-7', + 'img archive': 'mdi mdi-table color-icon-gold', + 'img archive-folder': 'mdi mdi-database-outline color-icon-green', 'img autoincrement': 'mdi mdi-numeric-1-box-multiple-outline', 'img column': 'mdi mdi-table-column', - 'img server': 'mdi mdi-server color-blue-7', - 'img primary-key': 'mdi mdi-key-star color-yellow-7', + 'img server': 'mdi mdi-server color-icon-blue', + 'img primary-key': 'mdi mdi-key-star color-icon-yellow', 'img foreign-key': 'mdi mdi-key-link', 'img sql-file': 'mdi mdi-file', - 'img shell': 'mdi mdi-flash color-blue-7', - 'img chart': 'mdi mdi-chart-bar color-magenta-7', - 'img markdown': 'mdi mdi-application color-red-7', - 'img preview': 'mdi mdi-file-find color-red-7', - 'img favorite': 'mdi mdi-star color-yellow-7', - 'img query-design': 'mdi mdi-vector-polyline-edit color-red-7', + 'img shell': 'mdi mdi-flash color-icon-blue', + 'img chart': 'mdi mdi-chart-bar color-icon-magenta', + 'img markdown': 'mdi mdi-application color-icon-red', + 'img preview': 'mdi mdi-file-find color-icon-red', + 'img favorite': 'mdi mdi-star color-icon-yellow', + 'img query-design': 'mdi mdi-vector-polyline-edit color-icon-red', - 'img free-table': 'mdi mdi-table color-green-7', + 'img free-table': 'mdi mdi-table color-icon-green', 'img macro': 'mdi mdi-hammer-wrench', - 'img database': 'mdi mdi-database color-gold-7', - 'img table': 'mdi mdi-table color-blue-7', - 'img view': 'mdi mdi-table color-magenta-7', - 'img procedure': 'mdi mdi-cog color-blue-7', + 'img database': 'mdi mdi-database color-icon-gold', + 'img table': 'mdi mdi-table color-icon-blue', + 'img view': 'mdi mdi-table color-icon-magenta', + 'img procedure': 'mdi mdi-cog color-icon-blue', 'img function': 'mdi mdi-function-variant', - 'img sort-asc': 'mdi mdi-sort-alphabetical-ascending color-green', - 'img sort-desc': 'mdi mdi-sort-alphabetical-descending color-green', + 'img sort-asc': 'mdi mdi-sort-alphabetical-ascending color-icon-green', + 'img sort-desc': 'mdi mdi-sort-alphabetical-descending color-icon-green', 'img reference': 'mdi mdi-link-box', 'img link': 'mdi mdi-link',