diff --git a/.gitignore b/.gitignore
index 1cc2ea4e8..c1e62bc38 100644
--- a/.gitignore
+++ b/.gitignore
@@ -36,6 +36,7 @@ runtime/pgAdmin4_resource.rc
runtime/release/
runtime/ui_BrowserWindow.h
web/config_local.py
+web/pgadmin.themes.json
web/geckodriver.log
web/regression/test_config.json
node_modules/
diff --git a/README b/README
index e1045703d..3c886c43a 100644
--- a/README
+++ b/README
@@ -219,6 +219,19 @@ can be used:
C:\$PGADMIN4_SRC\web> yarn install
C:\$PGADMIN4_SRC\web> yarn run bundle
+Creating pgAdmin themes
+-----------------------
+
+To create a pgAdmin theme, you need to create a directory under web/pgadmin/static/scss/resources.
+Copy the sample file _theme.variables.scss.sample to the new directory and rename it to _theme.variables.scss.
+Change the desired hexadecimal values of the colors and bundle pgAdmin. You can also add a preview image in the
+theme directory with the name as
_preview.png. It is recommended that the preview image should not be
+larger in size as it may take time to load on slow networks. Run the yarn run bundle and you're good to go.
+No other changes are required, pgAdmin bundle will read the directory and create other required entries to make them
+available in preferences.
+The name of the theme is derived from the directory name. Underscores (_) and hyphens (-) will be replaced with
+spaces and the result will be camel cased.
+
Configuring the Runtime
-----------------------
diff --git a/docs/en_US/images/preferences_misc_themes.png b/docs/en_US/images/preferences_misc_themes.png
new file mode 100644
index 000000000..460998d45
Binary files /dev/null and b/docs/en_US/images/preferences_misc_themes.png differ
diff --git a/docs/en_US/images/preferences_misc_user_language.png b/docs/en_US/images/preferences_misc_user_language.png
old mode 100755
new mode 100644
index 14a9b5670..3382a59d7
Binary files a/docs/en_US/images/preferences_misc_user_language.png and b/docs/en_US/images/preferences_misc_user_language.png differ
diff --git a/docs/en_US/preferences.rst b/docs/en_US/preferences.rst
index 5a85fe0d2..e29cb9d25 100644
--- a/docs/en_US/preferences.rst
+++ b/docs/en_US/preferences.rst
@@ -178,6 +178,14 @@ Expand the *Miscellaneous* node to specify miscellaneous display preferences.
* Use the *User language* drop-down listbox to select the display language for
the client.
+.. image:: images/preferences_misc_themes.png
+ :alt: Preferences dialog themes section
+ :align: center
+
+* Use the *Themes* drop-down listbox to select the theme for pgAdmin. You'll also get a preview just below the
+ drop down. Note that, to apply the theme you need to refresh the pgAdmin page. You can also submit your
+ own themes, check `here `_ how.
+
The Paths Node
**************
diff --git a/docs/en_US/release_notes_4_15.rst b/docs/en_US/release_notes_4_15.rst
index 7407abc92..5b0609961 100644
--- a/docs/en_US/release_notes_4_15.rst
+++ b/docs/en_US/release_notes_4_15.rst
@@ -10,8 +10,10 @@ New features
************
| `Issue #1974 `_ - Added encrypted password in reverse engineered SQL for roles.
-| `Issue #4351 `_ - Add an option to request confirmation before cancelling/resetting changes on a Properties dialog.
+| `Issue #3741 `_ - Added Dark(Beta) UI Theme option.
| `Issue #4006 `_ - Support Enable Always and Enable Replica on triggers.
+| `Issue #4351 `_ - Add an option to request confirmation before cancelling/resetting changes on a Properties dialog.
+| `Issue #4348 `_ - Added support for custom theme creation and selection.
Housekeeping
************
@@ -27,6 +29,7 @@ Bug fixes
| `Issue #3913 `_ - Ensure the correct "running at" agent is shown when a pgAgent job is executing.
| `Issue #3915 `_ - Fix an issue in the Query Tool where shortcut keys could be ignored following a query error.
| `Issue #3999 `_ - Fix the toggle case shortcut key combination.
+| `Issue #4171 `_ - Fix an issue where a black arrow-kind image is displaying at the background of browser tree images.
| `Issue #4191 `_ - Ensure comments are shown in reverse engineered SQL for table partitions.
| `Issue #4242 `_ - Handle NULL values appropriately when sorting backgrid tables.
| `Issue #4341 `_ - Give appropriate error messages when the user tries to use an blank master password.
diff --git a/web/config.py b/web/config.py
index c67f240b2..f992cc487 100644
--- a/web/config.py
+++ b/web/config.py
@@ -14,6 +14,7 @@
import logging
import os
import sys
+import json
if sys.version_info[0] >= 3:
import builtins
@@ -486,6 +487,26 @@ try:
except ImportError:
pass
+THEMES = {
+ "standard": {
+ "disp_name": "Standard",
+ "cssfile": "pgadmin",
+ "preview_img": "standard_preview.png"
+ }
+}
+
+OTHER_THEMES = {}
+try:
+ extra_themes = json.load(open('pgadmin.themes.json'))
+ OTHER_THEMES.update(extra_themes)
+except Exception:
+ pass
+
+# Set OTHER_THEMES to None here to disable all other themes
+
+if OTHER_THEMES is not None:
+ THEMES.update(OTHER_THEMES)
+
# SUPPORT_SSH_TUNNEL can be override in local config file and if that
# setting is False in local config then we should not check the Python version.
if (SUPPORT_SSH_TUNNEL is True and
diff --git a/web/package.json b/web/package.json
index 52352348f..4e82aa7f7 100644
--- a/web/package.json
+++ b/web/package.json
@@ -9,14 +9,17 @@
"devDependencies": {
"@babel/core": "~7.6.0",
"@babel/preset-env": "~7.6.0",
+ "autoprefixer": "^9.6.4",
"axios-mock-adapter": "^1.17.0",
"babel-loader": "~8.0.5",
"babel-plugin-transform-object-rest-spread": "^7.0.0-beta.3",
+ "copy-webpack-plugin": "^5.0.4",
"core-js": "^3.2.1",
"cross-env": "^5.2.0",
"eclint": "^2.8.1",
"eslint": "5.15.1",
"file-loader": "^3.0.1",
+ "iconfont-webpack-plugin": "^4.2.1",
"image-webpack-loader": "^4.6.0",
"is-docker": "^1.1.0",
"jasmine-core": "~3.3.0",
@@ -34,6 +37,7 @@
"node-sass": "^4.11.0",
"optimize-css-assets-webpack-plugin": "^5.0.1",
"popper.js": "^1.14.7",
+ "postcss-loader": "^3.0.0",
"raw-loader": "^1.0.0",
"sass-loader": "^7.1.0",
"sass-resources-loader": "^2.0.0",
diff --git a/web/pgadmin/__init__.py b/web/pgadmin/__init__.py
index de365eadd..41ca051f1 100644
--- a/web/pgadmin/__init__.py
+++ b/web/pgadmin/__init__.py
@@ -713,10 +713,26 @@ def create_app(app_name=None):
@app.context_processor
def inject_blueprint():
- """Inject a reference to the current blueprint, if any."""
+ """
+ Inject a reference to the current blueprint, if any.
+ Also the get_theme_css func.
+ """
+
+ def get_theme_css():
+ misc_preference = Preferences.module('misc')
+ theme = misc_preference.preference('theme').get()
+ theme_css = config.THEMES['standard']['cssfile'] + '.css'
+
+ if theme not in config.THEMES:
+ pass
+ else:
+ theme_css = config.THEMES[theme]['cssfile'] + '.css'
+ return theme_css
+
return {
'current_app': current_app,
- 'current_blueprint': current_blueprint
+ 'current_blueprint': current_blueprint,
+ 'get_theme_css': get_theme_css,
}
@app.errorhandler(Exception)
diff --git a/web/pgadmin/browser/server_groups/servers/static/css/servers.css b/web/pgadmin/browser/server_groups/servers/static/css/servers.css
index 65f9f53db..61536428a 100644
--- a/web/pgadmin/browser/server_groups/servers/static/css/servers.css
+++ b/web/pgadmin/browser/server_groups/servers/static/css/servers.css
@@ -1,12 +1,3 @@
-.icon-server-connecting {
- background-image: url('~top/static/img/load-node.gif') !important;
- background-repeat: no-repeat;
- background-size: 20px !important;
- align-content: center;
- vertical-align: middle;
- height: 1.3em;
-}
-
.change_password {
padding-left: 7px;
-}
\ No newline at end of file
+}
diff --git a/web/pgadmin/browser/server_groups/servers/static/scss/_servers.scss b/web/pgadmin/browser/server_groups/servers/static/scss/_servers.scss
index 0059fc259..6b83f891c 100644
--- a/web/pgadmin/browser/server_groups/servers/static/scss/_servers.scss
+++ b/web/pgadmin/browser/server_groups/servers/static/scss/_servers.scss
@@ -1,3 +1,12 @@
.bg-model-duplicate {
@extend .bg-warning-light;
}
+
+.icon-server-connecting {
+ background-image: $loader-icon-small !important;
+ background-repeat: no-repeat;
+ background-size: 18px !important;
+ align-content: center;
+ vertical-align: middle;
+ height: 1.3em;
+}
diff --git a/web/pgadmin/browser/static/css/browser.css b/web/pgadmin/browser/static/css/browser.css
index b4de47c0f..57295ee76 100644
--- a/web/pgadmin/browser/static/css/browser.css
+++ b/web/pgadmin/browser/static/css/browser.css
@@ -47,3 +47,8 @@
.pgadmin_header_logo {
cursor: default;
}
+
+.icon-drop-cascade:before {
+ font-icon: url('../img/drop_cascade.svg');
+ font-size: 1.6em !important;
+}
diff --git a/web/pgadmin/browser/static/img/drop_cascade.svg b/web/pgadmin/browser/static/img/drop_cascade.svg
new file mode 100644
index 000000000..c3e521c55
--- /dev/null
+++ b/web/pgadmin/browser/static/img/drop_cascade.svg
@@ -0,0 +1,20 @@
+
+
+
+
+
+
+
+
+
+
+
diff --git a/web/pgadmin/browser/static/js/collection.js b/web/pgadmin/browser/static/js/collection.js
index 51919fdce..96e793079 100644
--- a/web/pgadmin/browser/static/js/collection.js
+++ b/web/pgadmin/browser/static/js/collection.js
@@ -247,7 +247,7 @@ define([
type: 'delete',
tooltip: gettext('Drop Cascade'),
extraClasses: ['btn-secondary m-1', 'delete_multiple_cascade'],
- icon: 'icon-delete_multiple_cascade',
+ icon: 'pg-font-icon icon-drop-cascade',
disabled: (_.isFunction(that.canDropCascade)) ? !(that.canDropCascade.apply(self, [data, item])) : (!that.canDropCascade),
register: function(btn) {
btn.on('click',() => {
diff --git a/web/pgadmin/browser/static/js/toolbar.js b/web/pgadmin/browser/static/js/toolbar.js
index 1a951d272..f491bfdbc 100644
--- a/web/pgadmin/browser/static/js/toolbar.js
+++ b/web/pgadmin/browser/static/js/toolbar.js
@@ -22,7 +22,7 @@ let _defaultToolBarButtons = [
text: '',
toggled: false,
toggleClass: '',
- parentClass: 'pg-toolbar-btn',
+ parentClass: 'pg-toolbar-btn btn-secondary',
enabled: false,
},
{
@@ -31,7 +31,7 @@ let _defaultToolBarButtons = [
text: '',
toggled: false,
toggleClass: '',
- parentClass: 'pg-toolbar-btn',
+ parentClass: 'pg-toolbar-btn btn-secondary',
enabled: false,
},
{
@@ -40,7 +40,7 @@ let _defaultToolBarButtons = [
text: '',
toggled: false,
toggleClass: '',
- parentClass: 'pg-toolbar-btn',
+ parentClass: 'pg-toolbar-btn btn-secondary',
enabled: false,
},
];
diff --git a/web/pgadmin/browser/static/scss/_browser.scss b/web/pgadmin/browser/static/scss/_browser.scss
index 53de6f93a..9ea1ecc5e 100644
--- a/web/pgadmin/browser/static/scss/_browser.scss
+++ b/web/pgadmin/browser/static/scss/_browser.scss
@@ -49,5 +49,6 @@ samp,
.pg-toolbar-btn {
margin-left: 0.25rem;
- border: $input-btn-border-width solid $btn-secondary-border;
+ border-style: solid;
+ border-width: 1px;
}
diff --git a/web/pgadmin/dashboard/static/css/dashboard.css b/web/pgadmin/dashboard/static/css/dashboard.css
index 93a0e1471..91ab75b62 100644
--- a/web/pgadmin/dashboard/static/css/dashboard.css
+++ b/web/pgadmin/dashboard/static/css/dashboard.css
@@ -24,23 +24,6 @@
line-height: 30px;
}
-.dashboard-tab-btn-group button {
- padding: 5px;
-}
-
-.dashboard-tab-btn-group > button {
- margin: 2px 3px 2px 0px;
- min-width: 40px;
-}
-
-.dashboard-tab-btn-group > button:first-child {
- margin-left: 3px;
-}
-
-.dashboard-tab-btn-group > button:last-child {
- margin-right: 3px;
-}
-
.graph-container {
margin-top: 10px;
height: 150px;
diff --git a/web/pgadmin/dashboard/static/scss/_dashboard.scss b/web/pgadmin/dashboard/static/scss/_dashboard.scss
index eeac9c4f5..4b204a3bb 100644
--- a/web/pgadmin/dashboard/static/scss/_dashboard.scss
+++ b/web/pgadmin/dashboard/static/scss/_dashboard.scss
@@ -16,14 +16,6 @@
margin-bottom: $grid-gutter-width/2;
}
-.dashboard-tab-btn-group {
- background-color: $color-gray-light;
- border: 2px solid $color-gray;
- left: 0px;
- right: 0px;
- padding: 2px;
-}
-
.graph-error {
background-color: $color-gray-lighter;
padding-top: 20px
@@ -44,5 +36,17 @@
.dashboard-link a {
cursor: pointer;
- color: $color-fg-theme;
+ color: $color-fg;
+}
+
+.dashboard-graph-body {
+ & .flotr-labels {
+ color: $color-fg !important;
+ }
+ & .flotr-legend {
+ .flotr-legend-label {
+ color: $color-fg !important;
+ padding-left: 0.25rem;
+ }
+ }
}
diff --git a/web/pgadmin/misc/__init__.py b/web/pgadmin/misc/__init__.py
index 0041e4a98..68d4381af 100644
--- a/web/pgadmin/misc/__init__.py
+++ b/web/pgadmin/misc/__init__.py
@@ -23,6 +23,8 @@ MODULE_NAME = 'misc'
class MiscModule(PgAdminModule):
+ LABEL = gettext('Miscellaneous')
+
def get_own_javascripts(self):
return [
{
@@ -47,10 +49,6 @@ class MiscModule(PgAdminModule):
"""
Register preferences for this module.
"""
- self.misc_preference = Preferences(
- 'miscellaneous', gettext('Miscellaneous')
- )
-
lang_options = []
for lang in config.LANGUAGES:
lang_options.append(
@@ -61,13 +59,39 @@ class MiscModule(PgAdminModule):
)
# Register options for the User language settings
- self.misc_preference.register(
- 'miscellaneous', 'user_language',
+ self.preference.register(
+ 'user_language', 'user_language',
gettext("User language"), 'options', 'en',
category_label=gettext('User language'),
options=lang_options
)
+ theme_options = []
+
+ for theme in config.THEMES:
+ theme_options.append({
+ 'label': config.THEMES[theme]['disp_name']
+ .replace('_', ' ')
+ .replace('-', ' ')
+ .title(),
+ 'value': theme,
+ 'preview_src': url_for(
+ 'static', filename='js/generated/img/' +
+ config.THEMES[theme]['preview_img']
+ )
+ })
+
+ self.preference.register(
+ 'themes', 'theme',
+ gettext("Theme"), 'options', 'standard',
+ category_label=gettext('Themes'),
+ options=theme_options,
+ help_str=gettext(
+ 'A refresh is required to apply the theme. Below is the '
+ 'preview of the theme'
+ )
+ )
+
def get_exposed_url_endpoints(self):
"""
Returns:
diff --git a/web/pgadmin/misc/bgprocess/static/scss/_bgprocess.scss b/web/pgadmin/misc/bgprocess/static/scss/_bgprocess.scss
index 7821853e3..63f716135 100644
--- a/web/pgadmin/misc/bgprocess/static/scss/_bgprocess.scss
+++ b/web/pgadmin/misc/bgprocess/static/scss/_bgprocess.scss
@@ -5,7 +5,7 @@ $bgproc-container-pad: 2px;
border: none;
padding: 0px !important;
text-align: left;
- color: $color-fg-theme;
+ color: $color-fg;
min-width: 500px;
max-width: 500px;
.card {
diff --git a/web/pgadmin/misc/file_manager/static/css/file_manager.css b/web/pgadmin/misc/file_manager/static/css/file_manager.css
index 669bca71d..1fc5bd374 100644
--- a/web/pgadmin/misc/file_manager/static/css/file_manager.css
+++ b/web/pgadmin/misc/file_manager/static/css/file_manager.css
@@ -56,12 +56,6 @@
/** Opera hack */
x:-o-prefocus, .file-input-container {top:16px;width:198px;}
-@-moz-document url-prefix() {
- .filepath {
- padding:0.2em 0.3em;
- }
-}
-
/** Input file Replacement - end */
.file_listing #contents.grid {
text-align: left;
diff --git a/web/pgadmin/misc/file_manager/static/scss/_file_manager.scss b/web/pgadmin/misc/file_manager/static/scss/_file_manager.scss
index f85bced82..6bd173dc9 100644
--- a/web/pgadmin/misc/file_manager/static/scss/_file_manager.scss
+++ b/web/pgadmin/misc/file_manager/static/scss/_file_manager.scss
@@ -105,7 +105,7 @@
.fm_folder_grid,
.fm_file_grid,
.fm_file_list {
- color: $color-gray-darker;
+ color: $color-fg;
}
.fm_drive {
@@ -130,20 +130,6 @@
wrap: no-wrap;
}
-.filepath {
- background-color: $color-gray-lighter;
- border: 1px solid $color-gray-lighter;
- margin: 0;
- padding: 0.1em 0.3em;
- line-height: 1.7em;
- -webkit-border-top-left-radius: 6px;
- -webkit-border-bottom-left-radius: 6px;
- -moz-border-radius-topleft: 6px;
- -moz-border-radius-bottomleft: 6px;
- border-top-left-radius: 6px;
- border-bottom-left-radius: 6px;
-}
-
.file_listing #contents.grid li {
display: block;
float: left;
@@ -158,24 +144,6 @@
border: 1px solid $color-bg;
}
-.file_listing #contents.list thead {
- background: $color-gray-lighter; /* Old browsers */
- background: -moz-linear-gradient(top, rgba($color-primary, 0.71) 0%, rgba($color-primary, 0.98) 100%); /* FF3.6+ */
- background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba($color-primary, 0.71)), color-stop(100%,rgba($color-primary, 0.98))); /* Chrome,Safari4+ */
- background: -webkit-linear-gradient(top, rgba($color-primary, 0.71) 0%,rgba($color-primary, 0.98) 100%); /* Chrome10+,Safari5.1+ */
- background: -o-linear-gradient(top, rgba($color-primary, 0.71) 0%,rgba($color-primary, 0.98) 100%); /* Opera 11.10+ */
- background: -ms-linear-gradient(top, rgba($color-primary, 0.71) 0%,rgba($color-primary, 0.98) 100%); /* IE10+ */
- background: linear-gradient(to bottom, rgba($color-primary, 0.71) 0%,rgba($color-primary, 0.98) 100%);
- border-bottom: 1px solid $color-gray-lighter;
- display: inline-block;
- width: 100%;
-}
-
-.btn-group.filemanager-btn-group .btn:not(:first-child):not(:last-child),
-.btn-group.filemanager-path-group .btn:not(:first-child):not(:last-child) {
- border-left: 1px solid $color-gray-light;
-}
-
.file_manager {
position: absolute;
top: 0px;
@@ -191,7 +159,7 @@
.file_manager #uploader .filemanager-path-group {
padding: 0;
display: block;
- border: 1px solid $color-gray;
+ border: 1px solid $border-color;
height: 30px;
border-radius: 5px;
-webkit-border-radius: 5px;
@@ -207,7 +175,7 @@
}
.file_manager #uploader .filemanager-btn-group {
- border: 1px solid $color-gray;
+ border: 1px solid $border-color;
border-radius: 5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
@@ -222,12 +190,12 @@
.fileinfo .prompt-info {
text-align: center;
- color: $color-fg-theme;
+ color: $color-fg;
}
.allowed_file_types {
border-top: $panel-border;
- background: $color-bg-theme;
+ background: $color-bg;
z-index: 5;
padding: 0.25rem;
}
@@ -261,7 +229,7 @@
float: left;
width: 100%;
height: 21px !important;
- border: 1px solid $color-gray-dark;
+ border: 1px solid $border-color;
border-radius: 0 !important;
-moz-border-radius: 0 !important;
-webkit-border-radius: 0 !important;
@@ -313,7 +281,7 @@
display: none;
padding: 1rem;
border-bottom: $panel-border;
- background: $color-bg-theme;
+ background: $color-bg;
position: absolute;
top: 0;
left: 0;
@@ -322,7 +290,7 @@
}
.upload_file .dz_cross_btn {
- color: $color-fg-theme;
+ color: $color-fg;
right: 0px;
position: absolute;
background: transparent;
@@ -359,7 +327,7 @@
.file_selection_ctrl button.select_item {
display: inline;
- background: $color-bg-theme;
+ background: $color-bg;
padding: 9px 0px 9px 0px;
margin-left: 0px;
margin-right: -7px;
diff --git a/web/pgadmin/misc/static/explain/js/explain.js b/web/pgadmin/misc/static/explain/js/explain.js
index 993ab5a00..e0aeb100c 100644
--- a/web/pgadmin/misc/static/explain/js/explain.js
+++ b/web/pgadmin/misc/static/explain/js/explain.js
@@ -1350,7 +1350,7 @@ define('pgadmin.misc.explain', [
// Main div to be drawn all images on
var planDiv = $('
', {
- class: 'pgadmin-explain-container p-3 w-100 h-100 overflow-auto',
+ class: 'pgadmin-explain-container w-100 h-100 overflow-auto',
}).appendTo(graphicalContainer),
// Div to draw tool-tip on
toolTip = $('
', {
diff --git a/web/pgadmin/misc/static/explain/scss/_explain.scss b/web/pgadmin/misc/static/explain/scss/_explain.scss
index d812516cb..35cee5480 100644
--- a/web/pgadmin/misc/static/explain/scss/_explain.scss
+++ b/web/pgadmin/misc/static/explain/scss/_explain.scss
@@ -1,16 +1,12 @@
.pgadmin-explain-tooltip {
position: absolute;
opacity: 0;
- color: $color-gray-lighter;
- background-color: $color-gray-dark;
+ color: $popover-body-color;
+ background-color: $popover-bg;
+ border-color: $popover-border-color;
+ box-shadow: $popover-box-shadow;
}
-$explain-bg-color-2: #FFEE88;
-$explain-bg-color-3: #EE8800;
-$explain-bg-color-4: #880000;
-$explain-fg-color-3: #FFFFFF;
-$explain-fg-color-4: #FFFFFF;
-
.sql-editor-explain {
.backform-tab {
.tab-content {
@@ -56,21 +52,21 @@ div.tab-pane[data-explain-tabpanel=table] {
td.pga-ex-exclusive-2,
td.pga-ex-inclusive-2,
td.pga-ex-rowsx-2 {
- background-color: $explain-bg-color-2;
+ background-color: $explain-sev-2-bg;
}
td.pga-ex-exclusive-3,
td.pga-ex-inclusive-3,
td.pga-ex-rowsx-3 {
- background-color: $explain-bg-color-3;
- color: $explain-fg-color-3;
+ background-color: $explain-sev-3-bg;
+ color: $explain-sev-3-color;
}
td.pga-ex-exclusive-4,
td.pga-ex-inclusive-4,
td.pga-ex-rowsx-4 {
- background-color: $explain-bg-color-4;
- color: $explain-fg-color-4;
+ background-color: $explain-sev-4-bg;
+ color: $explain-sev-4-color;
}
.pg-ex-subplans {
@@ -141,3 +137,10 @@ div.tab-pane[data-explain-tabpanel=statistics] {
}
}
}
+
+/* Setting it to hardcoded white as the SVG generated is having white bg
+ * Need to check what can be done.
+ */
+.pgadmin-explain-container {
+ background-color: #fff;
+}
diff --git a/web/pgadmin/preferences/static/js/preferences.js b/web/pgadmin/preferences/static/js/preferences.js
index b047b13a1..3344ed388 100644
--- a/web/pgadmin/preferences/static/js/preferences.js
+++ b/web/pgadmin/preferences/static/js/preferences.js
@@ -242,10 +242,17 @@ define('pgadmin.preferences', [
// Convert the array to SelectControl understandable options.
_.each(p.options, function(o) {
if ('label' in o && 'value' in o) {
- opts.push({
+ let push_var = {
'label': o.label,
'value': o.value,
- });
+ };
+ push_var['label'] = o.label;
+ push_var['value'] = o.value;
+
+ if('preview_src' in o) {
+ push_var['preview_src'] = o.preview_src;
+ }
+ opts.push(push_var);
if (o.value == p.value)
has_value = true;
} else {
@@ -454,6 +461,7 @@ define('pgadmin.preferences', [
}
if (e.button.text == gettext('Save')) {
+ let requires_refresh = false;
preferences.updateAll();
/* Find the modules changed */
@@ -463,8 +471,27 @@ define('pgadmin.preferences', [
if(!modulesChanged[pref.module]) {
modulesChanged[pref.module] = true;
}
+
+ if(pref.name == 'theme') {
+ requires_refresh = true;
+ }
});
+ if(requires_refresh) {
+ Alertify.confirm(
+ gettext('Refresh required'),
+ gettext('A page refresh is required to apply the theme. Do you wish to refresh the page now ?'),
+ function() {
+ /* If user clicks Yes */
+ location.reload();
+ return true;
+ },
+ function() {/* If user clicks No */ return true;}
+ ).set('labels', {
+ ok: gettext('Refresh'),
+ cancel: gettext('Later'),
+ });
+ }
// Refresh preferences cache
pgBrowser.cache_preferences(modulesChanged);
}
diff --git a/web/pgadmin/static/img/drop_cascade.svg b/web/pgadmin/static/img/drop_cascade.svg
deleted file mode 100644
index 24eb7947c..000000000
--- a/web/pgadmin/static/img/drop_cascade.svg
+++ /dev/null
@@ -1,28 +0,0 @@
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
diff --git a/web/pgadmin/static/img/load-node.gif b/web/pgadmin/static/img/load-node.gif
deleted file mode 100644
index 500fa0860..000000000
Binary files a/web/pgadmin/static/img/load-node.gif and /dev/null differ
diff --git a/web/pgadmin/static/img/loader-small.svg b/web/pgadmin/static/img/loader-small.svg
new file mode 100644
index 000000000..dc5faaf40
--- /dev/null
+++ b/web/pgadmin/static/img/loader-small.svg
@@ -0,0 +1,18 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/web/pgadmin/static/js/backform.pgadmin.js b/web/pgadmin/static/js/backform.pgadmin.js
index a03ac7cac..4d9aa9155 100644
--- a/web/pgadmin/static/js/backform.pgadmin.js
+++ b/web/pgadmin/static/js/backform.pgadmin.js
@@ -2065,6 +2065,11 @@ define([
$(this.$sel).append($element);
$(this.$sel).trigger('change');
}
+
+ let new_value = _.findWhere(this.field.get('options'), {value: evt.params.data.id});
+ if(new_value.preview_src) {
+ this.$el.find('.preview-img img').attr('src', new_value.preview_src);
+ }
},
formatter: Select2Formatter,
@@ -2090,6 +2095,14 @@ define([
' <% if (helpMessage && helpMessage.length) { %>',
' <%=helpMessage%> ',
' <% } %>',
+ ' <% for (var i=0; i < options.length; i++) {%>',
+ ' <% var option = options[i]; %>',
+ ' <% if (option.preview_src && option.value === rawValue) { %>',
+ ' ',
+ '
',
+ '
',
+ ' <%}%>',
+ ' <%}%>',
'',
].join('\n')),
render: function() {
diff --git a/web/pgadmin/static/js/sqleditor_utils.js b/web/pgadmin/static/js/sqleditor_utils.js
index fde7283b0..d305f4779 100644
--- a/web/pgadmin/static/js/sqleditor_utils.js
+++ b/web/pgadmin/static/js/sqleditor_utils.js
@@ -135,7 +135,7 @@ define(['jquery', 'underscore', 'sources/gettext', 'sources/url_for'],
if(sqlEditorUtils.previousStatus != status &&
!$status_el.hasClass('fa-query_tool_connected')) {
$status_el.removeClass()
- .addClass('fa-custom fa-query-tool-connected');
+ .addClass('pg-font-icon icon-query-tool-connected');
is_status_changed = true;
}
}
@@ -153,10 +153,10 @@ define(['jquery', 'underscore', 'sources/gettext', 'sources/url_for'],
msg = gettext('An unexpected error occurred - ' +
'ensure you are logged into the application.');
$el.attr('data-content', msg);
- if(!$status_el.hasClass('fa-query-tool-disconnected')) {
+ if(!$status_el.hasClass('icon-query-tool-disconnected')) {
$el.popover('hide');
$status_el.removeClass()
- .addClass('fa-custom fa-query-tool-disconnected');
+ .addClass('pg-icon-font icon-query-tool-disconnected');
}
}
})
@@ -173,10 +173,10 @@ define(['jquery', 'underscore', 'sources/gettext', 'sources/url_for'],
// Set bootstrap popover
$el.attr('data-content', msg);
// Add error class
- if(!$status_el.hasClass('fa-query-tool-disconnected')) {
+ if(!$status_el.hasClass('icon-query-tool-disconnected')) {
$el.popover('hide');
$status_el.removeClass()
- .addClass('fa-custom fa-query-tool-disconnected');
+ .addClass('pg-font-icon icon-query-tool-disconnected');
}
});
},
diff --git a/web/pgadmin/static/scss/_aci_tree.overrides.scss b/web/pgadmin/static/scss/_aci_tree.overrides.scss
index 8b7b6683b..806798065 100644
--- a/web/pgadmin/static/scss/_aci_tree.overrides.scss
+++ b/web/pgadmin/static/scss/_aci_tree.overrides.scss
@@ -1,3 +1,19 @@
+.tree-icon-right:before {
+ font-family: $font-family-icon;
+ content: "\f054" !important;
+ right: 15px;
+ top: 3px;
+ font-size: 0.6rem;
+ line-height: 2;
+ border-style: none;
+}
+
+.aciTree {
+ & .aciTreeButton, & .aciTreePush, & .aciTreeItem, & .aciTreeIcon, & .aciTreeText, & .aciTreeColumn {
+ color: $color-fg;
+ }
+}
+
.aciTree .aciTreeLi {
display: grid !important;
cursor: pointer;
@@ -6,13 +22,9 @@
font-family: $font-family-primary;
font-size: 0.815rem;
}
-.aciTree.aciTreeFocus .aciTreeFocus > .aciTreeLine {
- background-color: $color-primary-light !important;
- border-right: $active-border !important;
-}
.aciTree .aciTreeSelected > .aciTreeLine {
- background-color: $color-primary-light !important;
+ background-color: $tree-bg-selected !important;
border-color: $color-primary-light;
border-right: $active-border !important;
border-left: none !important;
@@ -21,13 +33,15 @@
-webkit-border-radius: none !important;
-moz-border-radius: none !important;
border-radius: none !important;
-}
-.aciTree .aciTreeSelected > .aciTreeLine .aciTreeItem {
- background-color: $color-primary-light;
- border: 1px solid transparent;
- -webkit-border-radius: none !important;
- -moz-border-radius: none !important;
- border-radius: none !important;
+
+ & .aciTreeItem {
+ background-color: $tree-bg-selected;
+ border: 1px solid transparent;
+ -webkit-border-radius: none !important;
+ -moz-border-radius: none !important;
+ border-radius: none !important;
+ color: $tree-fg-selected;
+ }
}
.aciTree .aciTreeItem {
white-space: nowrap !important;
@@ -36,31 +50,45 @@
background: none;
}
.aciTree .aciTreeLine.aciTreeHover {
- background-color: $color-gray-light;
+ background-color: $tree-bg-hover;
-webkit-border-radius: none !important;
-moz-border-radius: none !important;
border-radius: none !important;
+ & .aciTreeItem {
+ background-color: inherit;
+ border: 1px solid transparent;
+ -webkit-border-radius: none !important;
+ -moz-border-radius: none !important;
+ border-radius: none !important;
+ color: $tree-fg-hover;
+ }
}
-.aciTree .aciTreeLine.aciTreeHover .aciTreeItem {
- background-color: $color-gray-light;
- border: 1px solid transparent;
- -webkit-border-radius: none !important;
- -moz-border-radius: none !important;
- border-radius: none !important;
-}
-.aciTree.aciTreeFocus .aciTreeSelected >.aciTreeLine .aciTreeItem {
- background-color: $color-primary-light;
-}
-.aciTree.aciTreeFocus .aciTreeFocus >.aciTreeLine .aciTreeItem,
-.aciTree.aciTreeFocus .aciTreeSelected.aciTreeFocus >.aciTreeLine .aciTreeItem {
- border: 1px solid transparent;
+
+.aciTree.aciTreeFocus {
+
+ & .aciTreeFocus > .aciTreeLine {
+ background-color: $tree-bg-selected !important;
+ border-right: $active-border !important;
+ }
+
+ & .aciTreeSelected >.aciTreeLine .aciTreeItem {
+ background-color: $tree-bg-selected;
+ }
+
+ & .aciTreeFocus >.aciTreeLine .aciTreeItem,
+ & .aciTreeSelected.aciTreeFocus >.aciTreeLine .aciTreeItem {
+ border: 1px solid transparent;
+ color: $tree-fg-selected;
+ }
}
+
.aciTree .aciTreeButton {
background: none;
}
.aciTree .aciTreePush {
- width: 30px;
- background: url(../img/collapse_expand.svg) 12px 7px no-repeat;
+ background: none;
+ text-align: center;
+ font-size: 0.85em;
}
.aciTree .aciTreeEntry,
.aciTree .aciTreeBranch,
@@ -68,11 +96,41 @@
overflow:hidden;
background: none !important;
}
-.aciTree .aciTreeInode >.aciTreeLine .aciTreePush,
-.aciTree .aciTreeInode >.aciTreeLine .aciTreePush.aciTreeHover {
- background-position: 6px center !important;
+
+
+.aciTree .aciTreeInode>.aciTreeLine .aciTreePush {
+ &:before,
+ &.aciTreeHover:before {
+ background-position: 6px center !important;
+ font-family: $font-family-icon;
+ content: "\f054" !important;
+ border-style: none;
+ margin-left: 5px;
+ }
}
-.aciTree .aciTreeOpen >.aciTreeLine .aciTreePush,
-.aciTree .aciTreeOpen >.aciTreeLine .aciTreePush.aciTreeHover {
- background-position: -14px center !important;
+
+.aciTree .aciTreeLoad>.aciTreeLine .aciTreePush {
+ &:before,
+ &.aciTreeHover:before {
+ content: " " !important;
+ }
+}
+
+.aciTree .aciTreeOpen >.aciTreeLine .aciTreePush {
+ &:before,
+ &.aciTreeHover:before {
+ background-position: -14px center !important;
+ font-family: $font-family-icon;
+ content: "\f078" !important;
+ border-style: none;
+ margin-left: 5px;
+ }
+}
+
+.aciTree .aciTreePush>span {
+ width: 15px;
+ height: 15px;
+ left: 2px;
+ background: $loader-icon-small 0 0 no-repeat;
+ background-color: inherit!important;
}
diff --git a/web/pgadmin/static/scss/_alert.scss b/web/pgadmin/static/scss/_alert.scss
index f5082c37b..3f2e561e3 100644
--- a/web/pgadmin/static/scss/_alert.scss
+++ b/web/pgadmin/static/scss/_alert.scss
@@ -49,7 +49,7 @@
.alert-info {
border-color: $color-primary;
background-color: $color-primary-light;
- color : $color-fg-theme;
+ color : $color-fg;
background-image: none;
}
diff --git a/web/pgadmin/static/scss/_alertify.overrides.scss b/web/pgadmin/static/scss/_alertify.overrides.scss
index 0c579dd6a..0063d565f 100644
--- a/web/pgadmin/static/scss/_alertify.overrides.scss
+++ b/web/pgadmin/static/scss/_alertify.overrides.scss
@@ -23,6 +23,11 @@
}
}
+ .ajs-body {
+ background-color: $color-bg !important;
+ color: $color-fg !important;
+ }
+
&.ajs-resizable,
&.ajs-maximized {
& .ajs-body {
@@ -64,6 +69,8 @@
padding: 0;
min-height: $footer-min-height;
border-top: $panel-border;
+ background-color: $color-bg !important;
+ color: $color-fg !important;
& .ajs-buttons {
border: none;
border-radius: 0rem;
@@ -115,6 +122,8 @@
border: $panel-border;
border-radius: $panel-border-radius;
box-shadow: $dialog-box-shadow;
+ background-color: $color-bg !important;
+ color: $color-fg !important;
}
.ajs-content {
padding-left: 0 !important;
diff --git a/web/pgadmin/static/scss/_backgrid.overrides.scss b/web/pgadmin/static/scss/_backgrid.overrides.scss
index 47915bb8e..c929ddd45 100644
--- a/web/pgadmin/static/scss/_backgrid.overrides.scss
+++ b/web/pgadmin/static/scss/_backgrid.overrides.scss
@@ -80,8 +80,8 @@
.backgrid thead td,
.backgrid thead th{
- background: $color-bg-theme;
- background-color: $color-bg-theme !important;
+ background: $color-bg;
+ background-color: $color-bg !important;
text-align: left;
}
@@ -147,7 +147,7 @@ span.form-control:disabled {
.subnode {
border: $panel-border;
- background: $color-bg-theme;
+ background: $color-bg;
}
.subnode-noouter-border {
@@ -203,8 +203,8 @@ span.form-control:disabled {
}
.subnode-header {
- background-color: $color-bg-theme;
- color: $color-fg-theme;
+ background-color: $color-bg;
+ color: $color-fg;
border-bottom: $panel-border;
}
@@ -240,7 +240,7 @@ span.form-control:disabled {
}
fieldset.inline-fieldset {
- background: $color-bg-theme;
+ background: $color-bg;
}
}
.subnode-footer {
@@ -289,7 +289,7 @@ table.backgrid {
}
& td.editor {
- background-color: $color-bg-theme !important;
+ background-color: $color-bg !important;
}
& td.edit-cell.editor:focus {
diff --git a/web/pgadmin/static/scss/_bootstrap.overrides.scss b/web/pgadmin/static/scss/_bootstrap.overrides.scss
index 3b2df9fd6..0b61787e2 100644
--- a/web/pgadmin/static/scss/_bootstrap.overrides.scss
+++ b/web/pgadmin/static/scss/_bootstrap.overrides.scss
@@ -226,12 +226,6 @@ legend {
}
}
-/* Override default bootstrap popover fonts & size */
-.popover-content {
- font-family: $font-family-primary;
- font-size: 13px;
-}
-
.switch-cell {
height: 0px;
width: 0px;
@@ -252,10 +246,10 @@ td.switch-cell > div.toggle {
& .nav-link {
border: none !important;
padding: $tabs-padding;
- color: $color-fg-theme;
+ color: $color-fg;
&.active {
border-bottom: $active-border !important;
- color: $color-primary;
+ color: $active-color;
}
}
}
@@ -313,7 +307,7 @@ td.switch-cell > div.toggle {
.btn-group label.btn.btn-primary.active {
background-color: $color-primary-light;
- color: $color-primary;
+ color: $color-primary-light-fg;
}
.btn-group.pgadmin-controls-radio-none.disabled {
diff --git a/web/pgadmin/static/scss/_codemirror.overrides.scss b/web/pgadmin/static/scss/_codemirror.overrides.scss
index 27e028b75..2857455be 100644
--- a/web/pgadmin/static/scss/_codemirror.overrides.scss
+++ b/web/pgadmin/static/scss/_codemirror.overrides.scss
@@ -1,6 +1,3 @@
-.cm-s-default .CodeMirror {
- background: $color-editor-bg;
-}
/* To override inbuilt Green color for matchingbracket */
.cm-s-default .CodeMirror-matchingbracket {
color: $sql-bracket-match-fg !important;
@@ -10,6 +7,8 @@
.CodeMirror {
font-size: 1em;
font-family: monospace, monospace;
+ background-color: $color-editor-bg;
+ color: $color-editor-fg;
}
/* Ensure the codemirror editor displays full height gutters when resized */
@@ -39,14 +38,34 @@
}
/* make syntax-highlighting bold */
-.cm-s-default .cm-keyword {
- font-weight: 600;
- color: $color-editor-keyword;
-}
+.cm-s-default {
+ & .cm-quote {color: #090;}
+ & .cm-keyword {color: $color-editor-keyword; font-weight: 600;}
+ & .cm-atom {color: $color-editor-fg;}
+ & .cm-number {color: $color-editor-number; font-weight: 600;}
+ & .cm-def {color: $color-editor-fg;}
+ & .cm-punctuation,
+ & .cm-property,
+ & .cm-operator { color: $color-editor-operator; }
+ & .cm-variable {color: $color-editor-variable; }
+ & .cm-variable-2,
+ & .cm-variable-3,
+ & .cm-type {color: $color-editor-variable-2;}
+ & .cm-comment {color: $color-editor-comment;}
+ & .cm-string {color: $color-editor-string;}
+ & .cm-string-2 {color: $color-editor-string;}
+ & .cm-meta {color: $color-editor-fg;}
+ & .cm-qualifier {color: $color-editor-fg;}
+ & .cm-builtin {color: $color-editor-builtin;}
+ & .cm-bracket {color: $color-editor-bracket;}
+ & .cm-tag {color: $color-editor-fg;}
+ & .cm-attribute {color: $color-editor-fg;}
+ & .cm-hr {color: $color-editor-fg;}
+ & .cm-link {color: $color-editor-fg;}
-.cm-s-default .cm-number {
- font-weight: 600;
- color: $color-editor-number;
+ & .CodeMirror-cursor {
+ border-color: $color-editor-fg;
+ }
}
/* Codemirror buttons */
@@ -84,7 +103,7 @@
}
.CodeMirror-linenumber {
- color: $color-fg-theme;
+ color: $color-fg;
}
.debugger-container .breakpoints {
diff --git a/web/pgadmin/static/scss/_pgadmin.style.scss b/web/pgadmin/static/scss/_pgadmin.style.scss
index 7a6768b8d..53aeddf8b 100644
--- a/web/pgadmin/static/scss/_pgadmin.style.scss
+++ b/web/pgadmin/static/scss/_pgadmin.style.scss
@@ -90,6 +90,7 @@
.panel-link-heading:hover {
text-decoration: none;
+ color: inherit;
}
.nav .open > a, .nav .open > a:hover, .nav .open > a:focus {
@@ -97,7 +98,7 @@
}
#navbar-user {
- font-size: $navbar-user-font-size;
+ font-size: 0.9em;
}
@@ -143,19 +144,12 @@
.pg-navbar {
font-size: $navbar-font-size;
- background-color: $navbar-color-bg;
+ background-color: $navbar-bg;
padding-left: 0rem;
padding-right: 0.5rem;
& .nav-item .nav-link{
line-height: 1;
}
-
- .pg-navbar-brand-arrow {
- border: $navbar-height/2 solid $navbar-brand-arrow-bg;
- border-right-color: transparent;
- border-bottom-color: transparent;
- border-top-color: transparent;
- }
}
@@ -192,7 +186,7 @@
&.pg-prop-btn-group-below {
text-align: right;
padding: $footer-padding;
- background: $color-bg-theme;
+ background: $color-bg;
border-top: $panel-border;
}
}
@@ -407,9 +401,9 @@
padding: 0rem;
border: $panel-border;
border-radius: $card-border-radius;
- background-color: $color-bg-theme;
+ background-color: $color-bg;
fieldset.inline-fieldset {
- background: $color-bg-theme;
+ background: $color-bg;
}
}
@@ -548,7 +542,8 @@ fieldset.inline-fieldset > div {
.dashboard-tab-container,
.pg-panel-statistics-container,
-.pg-panel-depends-container,
+.pg-panel-dependencies-container,
+.pg-panel-dependents-container,
.pg-prop-coll-container, {
width: 100%;
overflow: auto;
@@ -561,7 +556,7 @@ fieldset.inline-fieldset > div {
left: 0px;
right: 0px;
top : 0px;
- background-color: $color-bg-theme;
+ background-color: $color-bg;
}
/* Overrides/fixes for pgAdmin specific styling */
@@ -733,7 +728,7 @@ table tr th {
& button {
background: none;
border: none;
- color: $color-fg-theme;
+ color: $color-fg;
padding: 0;
}
& button:focus {
@@ -843,11 +838,11 @@ body {
}
.pg-el-container {
- background-color: $color-gray-lighter;
+ background-color: $negative-bg;
}
.nav-tabs {
- background-color: $color-bg-theme;
+ background-color: $color-bg;
}
.editor-toolbar {
@@ -967,18 +962,6 @@ table.table-empty-rows{
background-size: 28px 28px;
}
}
-.icon-delete_multiple_cascade {
- display: inline-block;
- align-content: center;
- vertical-align: middle;
- height: 17px;
- width: 22px;
- background-image: url(/static/img/drop_cascade.svg) !important;
- background-size: 25px !important;
- background-repeat: no-repeat;
- background-position-x: center;
- background-position-y: center;
-}
.pgadmin-controls-radio-none {
& input[type="radio"] {
@@ -1031,3 +1014,23 @@ table.table-empty-rows{
border-radius: $input-border-radius;
padding: $input-btn-padding-y $input-btn-padding-x;
}
+
+::placeholder {
+ color: $input-placeholder-color;
+}
+
+.pg-font-icon {
+ &:before {
+ font-style: normal;
+ font-weight: normal;
+ font-stretch: normal;
+ font-size: 100%;
+ line-height: 1;
+ vertical-align: middle;
+ }
+}
+
+textarea {
+ color: $input-color;
+ background-color: $input-bg;
+}
diff --git a/web/pgadmin/static/scss/_select2.overrides.scss b/web/pgadmin/static/scss/_select2.overrides.scss
index f0e4e7e68..d94d064af 100644
--- a/web/pgadmin/static/scss/_select2.overrides.scss
+++ b/web/pgadmin/static/scss/_select2.overrides.scss
@@ -1,6 +1,22 @@
-.select2-container--default .select2-results__option--highlighted[aria-selected] {
- background-color: $color-primary-light;
- color: $color-gray-dark;
+.select2-dropdown {
+ background-color: $input-bg;
+ color: $input-color;
+}
+
+.select2-container--default .select2-results__option--highlighted[aria-selected],
+.select2-container--default .select2-results__option[aria-selected=true] {
+ background-color: $dropdown-link-hover-bg;
+ color: $dropdown-link-hover-color;
+}
+
+.select2-container--default .select2-selection--multiple {
+ background-color: $input-bg;
+ color: $input-color;
+}
+
+.select2-container--default .select2-selection--multiple .select2-selection__choice {
+ background-color: $dropdown-link-hover-bg;
+ color: $dropdown-link-hover-color;
}
.select2-container--default .select2-search--inline .select2-search__field {
@@ -11,6 +27,11 @@
width: 100% !important;
}
+.select2-container--default .select2-search__field {
+ background-color: $input-bg;
+ color: $input-color;
+}
+
.renderable > .select2-container {
width: 100% !important;
}
@@ -18,10 +39,12 @@
.select2-container .select2-selection--single {
height: auto;
min-height: 28px;
+ background-color: $input-bg;
& .select2-selection__rendered{
line-height: inherit;
padding: $input-padding-y $input-padding-x;
padding-right: 1.5rem;
+ color: $input-color;
}
}
diff --git a/web/pgadmin/static/scss/_webcabin.pgadmin.scss b/web/pgadmin/static/scss/_webcabin.pgadmin.scss
index 5c0ff69a8..91dfb57d2 100644
--- a/web/pgadmin/static/scss/_webcabin.pgadmin.scss
+++ b/web/pgadmin/static/scss/_webcabin.pgadmin.scss
@@ -1,30 +1,30 @@
.wcDocker {
- background-color: $color-bg-theme;
+ background-color: $color-bg;
}
.wcModalBlocker {
- background-color: $color-bg-theme;
+ background-color: $color-bg;
}
.wcPanelBackground {
- background-color: $color-bg-theme;
+ background-color: $color-bg;
}
.wcPanelBackground .wcCenter {
- background-color: $color-bg-theme;
+ background-color: $color-bg;
}
.wcFrameFlasher {
- background-color: $color-bg-theme;
+ background-color: $color-bg;
}
.wcFrameShadower {
- background-color: $color-bg-theme;
+ background-color: $color-bg;
}
.wcFrameTitleBar {
height: $title-height;
- background-color: $color-bg-theme;
+ background-color: $color-bg;
border-bottom: $panel-border;
}
@@ -43,7 +43,7 @@
.wcFrameButton.disabled {
pointer-events: none;
- color: $color-gray;
+ opacity: $btn-disabled-opacity;
}
.wcFrameButton .fa {
@@ -52,7 +52,7 @@
.wcFrameButtonBar {
height: $title-height;
- background-color: $color-bg-theme;
+ background-color: $color-bg;
border-bottom: $panel-border;
padding: 0rem 0.25rem;
@@ -80,13 +80,13 @@
}
.wcPanelTab, .wcFrameTitle{
- color: $color-fg-theme;
+ color: $color-fg;
padding: $tabs-padding;
margin: 0px;
}
.wcFloating {
- box-shadow: $box-shadow;
+ box-shadow: $dialog-box-shadow;
z-index: 1050 !important;
&.wcFrame, & .wcPanelBackground {
@@ -152,7 +152,7 @@
.wcFloating .wcPanelTabActive {
border-bottom: none;
- color: $color-fg-theme;
+ color: $color-fg;
font-weight: bold;
}
@@ -162,7 +162,7 @@
.wcFloating .wcFrameTitleBar {
height: $title-height;
- background-color: $color-bg-theme;
+ background-color: $color-bg;
border-bottom: $panel-border;
}
@@ -182,7 +182,7 @@
.wcPanelTabActive {
border-bottom: $active-border;
- color: $color-primary;
+ color: $active-color;
}
.wcFrameEdge {
diff --git a/web/pgadmin/static/scss/pgadmin.scss b/web/pgadmin/static/scss/pgadmin.scss
index d2d5e9022..890f5082b 100644
--- a/web/pgadmin/static/scss/pgadmin.scss
+++ b/web/pgadmin/static/scss/pgadmin.scss
@@ -1,6 +1,3 @@
-@import './resources/pgadmin.resources.scss';
-
-
$theme-colors: (
"primary": $color-primary,
"danger": $color-danger,
diff --git a/web/pgadmin/static/scss/resources/_default.style.scss b/web/pgadmin/static/scss/resources/_default.style.scss
index f90fe47ad..4a0bd9192 100644
--- a/web/pgadmin/static/scss/resources/_default.style.scss
+++ b/web/pgadmin/static/scss/resources/_default.style.scss
@@ -60,10 +60,6 @@
&-dark {
background-color: $color-gray-dark;
}
-
- &-darker {
- background-color: $color-gray-darker;
- }
}
/* Borders */
@@ -113,10 +109,6 @@
&-dark {
border: 2px solid $color-gray-dark;
}
-
- &-darker {
- border: 2px solid $color-gray-darker;
- }
}
/* Typography */
@@ -167,3 +159,13 @@
.text-semibold {
font-family: $font-family-semibold;
}
+
+.not-selectable {
+ -webkit-touch-callout: none;
+ -webkit-user-select: none;
+ -khtml-user-select: none;
+ -moz-user-select: none;
+ ms-user-select: none;
+ user-select: none;
+ cursor: default;
+}
diff --git a/web/pgadmin/static/scss/resources/_default.variables.scss b/web/pgadmin/static/scss/resources/_default.variables.scss
index 55507a33d..f09b11fb1 100644
--- a/web/pgadmin/static/scss/resources/_default.variables.scss
+++ b/web/pgadmin/static/scss/resources/_default.variables.scss
@@ -1,5 +1,5 @@
/** Dividing a pixel var with 1px or rem var with 1rem removes the unit px/rem **/
-$enable-flex: true !default;
+$enable-flex: true ;
$white: #fff;
$black: #000;
@@ -7,72 +7,65 @@ $black: #000;
$color-bg: $white !default;
$color-fg: #222222 !default;
-$color-bg-theme: $white !default;
-$color-fg-theme: #222222 !default;
-
$color-primary: #326690 !default;
$color-primary-fg: $white !default;
$color-primary-light: #d6effc !default;
+$color-primary-light-fg: $color-primary !default;
$color-primary-dark: #295c85 !default;
$color-secondary: $white !default;
$color-danger: #e53935 !default;
$color-danger-fg: $white !default;
-$color-danger-light: #F39999;
-$color-danger-lighter: #FAECEC;
+$color-danger-light: #F39999 !default;
+$color-danger-lighter: #F39999 !default;
$color-success: #43a047 !default;
$color-success-fg: $black !default;
-$color-success-light: #DDF1DE;
+$color-success-light: #DDF1DE !default;
$color-warning: #eea236 !default;
$color-warning-fg: $black !default;
-$color-warning-light: #fce5c5;
+$color-warning-light: #fce5c5 !default;;
-$color-gray-darker: #5b6d7c;
-$color-gray-dark: #848ea0;
-$color-gray: #bac1cd;
-$color-gray-light: #ebeef3;
-$color-gray-lighter: #f3f5f9;
+$color-gray-dark: #848ea0 !default;
+$color-gray: #bac1cd !default;
+$color-gray-light: #ebeef3 !default;
+$color-gray-lighter: #f3f5f9 !default;
$color-brand: $white !default;
-$color-editor-bg: $color-bg !default;
-$color-editor-keyword: #908 !default;
-$color-editor-number: #964 !default;
-$color-editor-foldmarker: #0000FF !default;
-$color-editor-activeline: #50B0F0 !default;
/* Typography */
-$font-family-primary: "Roboto", "Helvetica Neue", -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !default;
-$font-family-semibold: "Roboto Medium" !default;
-$font-family-editor: "Source Code Pro", SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace !default;
-$font-family-icon: "FontAwesome" !default;
+$font-family-primary: "Roboto", "Helvetica Neue", -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
+$font-family-semibold: "Roboto Medium";
+$font-family-editor: "Source Code Pro", SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
+$font-family-icon: "FontAwesome";
$border-width: 1px;
-$border-color: #dde0e6;
+$border-color: #dde0e6 !default;
$border-color-dark: $color-gray;
-$box-shadow: 0 0.5rem 3rem $color-gray-dark;
-/** Bootstrap Variable Changes **/
-$font-family-monospace: $font-family-editor !default;
-$font-family-base: $font-family-primary !default;
-$gray-600: $color-gray-dark;
-$gray-900: $color-fg-theme;
-$body-color: $color-fg-theme;
+$shadow-base-color: $color-gray-dark !default;
+
+$font-family-monospace: $font-family-editor;
+$font-family-base: $font-family-primary;
+$body-color: $color-fg;
$font-size-base: 0.875rem;
-$line-height-base: 1.5; // no change
+$line-height-base: 1.5;
$text-height-calc: $line-height-base*$font-size-base/1rem;
$grid-gutter-width: 15px;
-$border-radius: 0.25rem; //no change
+$border-radius: 0.25rem;
-$text-color: $color-fg-theme;
-$text-muted: $color-gray-dark;
+$text-muted: $color-gray-dark !default;
-$navbar-dark-color: #fff;
-$navbar-dark-hover-color: #fff;
-$navbar-dark-active-color: #fff;
+$navbar-bg: $color-primary;
+$navbar-font-size: 0.925rem;
+$navbar-height: 32px;
+$navbar-dropdown-top: 100%;
+$navbar-dark-color: $color-primary-fg;
+$navbar-dark-hover-color: $color-primary-fg;
+$navbar-dark-active-color: $color-primary-fg;
$navbar-dark-disabled-color: $color-gray;
$navbar-toggler-padding-y: 0.25rem; //no-change
@@ -80,16 +73,25 @@ $navbar-toggler-padding-y: 0.25rem; //no-change
$form-group-margin-bottom: 0.5rem;
$btn-active-box-shadow: none;
-$dropdown-link-hover-color: $white;
+$dropdown-bg: $color-bg;
+$dropdown-color: $color-fg;
+$dropdown-link-color: $color-fg;
+$dropdown-link-hover-color: $color-primary-fg;
$dropdown-link-hover-bg: $color-primary;
$dropdown-border-color: $border-color;
-$dropdown-box-shadow: 0 0.125rem 0.5rem rgba($color-gray-dark, .175);
+$dropdown-box-shadow: 0 0.125rem 0.5rem rgba($shadow-base-color, .275);
$dropdown-divider-bg: $dropdown-border-color;
$dropdown-padding-y: 0.25rem;
$dropdown-item-padding-x: 1rem;
$dropdown-spacer: .125rem; //no-change
+$dropdown-link-disabled-color: $text-muted;
$nav-divider-margin-y: .25rem;
+$popover-bg: $color-gray-dark !default;
+$popover-body-color: $white !default;
+$popover-border-color: $dropdown-border-color;
+$popover-box-shadow: $dropdown-box-shadow;
+
$input-btn-focus-width: 0.1rem;
$btn-disabled-opacity: 0.5;
$btn-transition: color .05s ease-in-out, background-color .05s ease-in-out, border-color .05s ease-in-out, box-shadow .05s ease-in-out;
@@ -98,9 +100,8 @@ $card-spacer-y: 0rem;
$card-spacer-x: 0rem;
$card-border-radius: $border-radius;
$card-border-color: $border-color;
-$card-cap-bg: $color-bg-theme;
-$card-bg: $color-bg-theme;
-
+$card-cap-bg: $color-bg;
+$card-bg: $color-bg;
$navbar-padding-y: 0rem;
$navbar-padding-x: 0rem;
@@ -122,36 +123,50 @@ $table-cell-padding: 0.25rem;
$table-header-cell-padding: 0.75rem;
$table-hover-bg: none; //we will use our own classes
$table-active-bg: $color-primary-light;
-$table-border-width: $border-width !default;
-$table-border-color: $border-color !default;
-$table-head-bg: $color-primary !default;
-$table-head-color: $color-primary-fg !default;
+$table-border-width: $border-width;
+$table-border-color: $border-color;
+$table-head-bg: $color-primary;
+$table-head-color: $color-primary-fg;
-$input-bg: $white; //no change
-$input-color: $color-fg-theme;
+$input-bg: $white !default;
+$input-color: $color-fg !default;
+$input-placeholder-color: $text-muted;
$input-border-color: $border-color;
-$input-border-radius: $border-radius; //no change
-$input-disabled-bg: $color-gray-lighter;
-$input-btn-border-width: $border-width; //no change
-$input-border-width: $input-btn-border-width; //no change
+$input-border-radius: $border-radius;
+$input-disabled-bg: $color-gray-lighter !default;
+$input-btn-border-width: $border-width;
+$input-border-width: $input-btn-border-width;
$input-btn-padding-y: .25rem;
-$input-btn-padding-x: .75rem; //no change
+$input-btn-padding-x: .75rem;
-$component-active-bg: $color-primary; //no change
-$input-btn-focus-width: .2rem !default; //no change
-$input-btn-focus-color: rgba($component-active-bg, .25) !default; //no change
-$input-btn-focus-box-shadow: 0 0 0 $input-btn-focus-width $input-btn-focus-color !default; //no change
-$input-focus-bg: $input-bg !default; //no change
-$input-focus-border-color: lighten($component-active-bg, 25%) !default; //no change
-$input-focus-color: $input-color !default; //no change
-$input-focus-width: $input-btn-focus-width !default; //no change
-$input-focus-box-shadow: $input-btn-focus-box-shadow !default; //no change
+$component-active-bg: $color-primary;
+$input-btn-focus-width: .2rem;
+$input-btn-focus-color: rgba($component-active-bg, .25);
+$input-btn-focus-box-shadow: 0 0 0 $input-btn-focus-width $input-btn-focus-color;
+$input-focus-bg: $input-bg;
+$input-focus-border-color: lighten($component-active-bg, 25%);
+$input-focus-color: $input-color;
+$input-focus-width: $input-btn-focus-width;
+$input-focus-box-shadow: $input-btn-focus-box-shadow;
-$btn-border-radius: $border-radius; //no change
+$btn-border-radius: $border-radius;
-/***************/
+$color-editor-fg: $input-color !default;
+$color-editor-bg: $input-bg;
+$color-editor-keyword: #908 !default;
+$color-editor-number: #964 !default;
+$color-editor-string: #a11 !default;
+$color-editor-variable: $color-fg !default;
+$color-editor-variable-2: #05a !default;
+$color-editor-builtin: #30a !default;
+$color-editor-comment: #a50 !default;
+$color-editor-bracket: #997 !default;
+$color-editor-operator: $color-fg !default;
+$color-editor-foldmarker: #0000FF !default;
+$color-editor-activeline: #50B0F0 !default;
-$active-border: 3px solid $color-primary;
+$active-color: $color-primary !default;
+$active-border: 3px solid $active-color;
$panel-border-width: $border-width;
$panel-border-color: $border-color;
$panel-border-radius: $border-radius;
@@ -166,42 +181,51 @@ $footer-height-calc: $footer-min-height+$footer-padding*2;
// ($splitter-hover-width - $panel-border-width) should be even number to split evenly.
$splitter-hover-width: 7px;
-$navbar-brand-bg: #222222; //place image url if image
-$navbar-brand-arrow-bg: #222222;
-$navbar-color-bg: $color-primary;
-$navbar-font-size: 0.925rem;
-$navbar-user-font-size: 0.875rem;
-
-$navbar-height: 32px;
-$navbar-dropdown-top: 100%;
$dropdown-submenu-top: -$dropdown-spacer;
-$table-bg: $color-bg-theme;
+$table-bg: $color-bg;
$table-bg-selected: $color-primary-light;
$table-hover-border-color: $color-primary;
$table-hover-border: $panel-border-width solid $color-primary !important;
$table-hover-bg-color: $color-primary-light;
$datagrid-bg: $color-gray-light;
+$tree-fg-hover: $color-fg;
+$tree-bg-hover: $color-gray-lighter;
+$tree-fg-selected: $color-fg;
+$tree-bg-selected: $color-primary-light;
+
+$sql-grid-data-cell-fg: $input-color;
+$sql-grid-data-cell-bg: $input-bg;
+$sql-grid-title-cell-fg: $input-color;
+$sql-grid-title-cell-bg: $input-bg;
+
$sql-title-padding: 3px;
-$sql-title-bg: $color-gray-darker;
+$sql-title-bg: #5b6d7c;
$sql-title-fg: $white;
// Toolbar + editor title heights + title bottom border
$sql-editor-panel-top: $title-height + $text-height-calc*16px + $sql-title-padding*2 + $panel-border-width;
$sql-gutters-bg: $color-gray-light;
$sql-history-detail-bg: $color-gray-lighter;
$sql-history-success-bg: $color-primary-light;
-$sql-history-success-fg: $color-primary;
+$sql-history-success-fg: $active-color;
$sql-history-error-bg: $color-danger-lighter;
$sql-history-error-fg: $color-danger;
-$sql-hint-bg: $color-bg-theme;
+$sql-hint-bg: $color-bg;
$sql-hint-active-bg: $color-primary;
$sql-hint-active-fg: $white;
-$sql-bracket-match-fg: $color-gray-darker;
+$sql-bracket-match-fg: #5b6d7c;
$sql-bracket-match-bg: #f5d2af;
-$negative-bg: $color-gray-light;
-$dialog-box-shadow: $box-shadow;
+/* For explain analysis */
+$explain-sev-2-bg: #FFEE88 !default;
+$explain-sev-3-bg: #EE8800 !default;
+$explain-sev-4-bg: #880000 !default;
+$explain-sev-3-color: #FFFFFF !default;
+$explain-sev-4-color: #FFFFFF !default;
+
+$negative-bg: $color-gray-light !default;
+$dialog-box-shadow: 0 0.5rem 3rem $shadow-base-color;
$alert-icon-color: $white;
$alertify-borderremove-margin: $panel-border-width;
@@ -221,3 +245,4 @@ $loading-bg : rgba($black,0.6);
$loading-fg : $white;
$loader-icon : url("data:image/svg+xml;charset=UTF-8,%3c?xml version='1.0' encoding='utf-8'?%3e%3csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 38 38' style='enable-background:new 0 0 38 38;' xml:space='preserve'%3e%3cstyle type='text/css'%3e .st0%7bfill:none;stroke:%23ebeef3;stroke-width:2;%7d .st1%7bfill:none;stroke:%23326690;stroke-width:2;%7d %3c/style%3e%3cg%3e%3cg transform='translate(1 1)'%3e%3ccircle class='st0' cx='18' cy='18' r='18'/%3e%3cpath class='st1' d='M36,18c0-9.9-8.1-18-18-18 '%3e%3canimateTransform accumulate='none' additive='replace' attributeName='transform' calcMode='linear' dur='0.7s' fill='remove' from='0 18 18' repeatCount='indefinite' restart='always' to='360 18 18' type='rotate'%3e%3c/animateTransform%3e%3c/path%3e%3c/g%3e%3c/g%3e%3c/svg%3e ") !default;
+$loader-icon-small: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Generator: Adobe Illustrator 23.1.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 38 38' style='enable-background:new 0 0 38 38;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:none;stroke:%23EBEEF3;stroke-width:5;%7D .st1%7Bfill:none;stroke:%23326690;stroke-width:5;%7D%0A%3C/style%3E%3Cg%3E%3Cg transform='translate(1 1)'%3E%3Ccircle class='st0' cx='18' cy='18' r='16'/%3E%3Cpath class='st1' d='M34,18c0-8.8-7.2-16-16-16 '%3E%3CanimateTransform accumulate='none' additive='replace' attributeName='transform' calcMode='linear' dur='0.7s' fill='remove' from='0 18 18' repeatCount='indefinite' restart='always' to='360 18 18' type='rotate'%3E%3C/animateTransform%3E%3C/path%3E%3C/g%3E%3C/g%3E%3C/svg%3E%0A") !default;
diff --git a/web/pgadmin/static/scss/resources/_pgadmin.variables.scss b/web/pgadmin/static/scss/resources/_pgadmin.variables.scss
deleted file mode 100644
index e69de29bb..000000000
diff --git a/web/pgadmin/static/scss/resources/_theme.variables.scss.sample b/web/pgadmin/static/scss/resources/_theme.variables.scss.sample
new file mode 100644
index 000000000..30bc06060
--- /dev/null
+++ b/web/pgadmin/static/scss/resources/_theme.variables.scss.sample
@@ -0,0 +1,74 @@
+$color-bg: $white;
+$color-fg: #222222;
+
+$color-bg: #fff;
+$color-fg: #222;
+
+$color-primary: #326690;
+$color-primary-fg: $white;
+$color-primary-light: #d6effc;
+$color-primary-light-fg: $color-primary;
+$color-primary-dark: #295c85;
+
+$color-secondary: $white;
+
+$color-danger: #e53935;
+$color-danger-fg: $white;
+$color-danger-light: #F39999;
+$color-danger-lighter: #F39999;
+
+$color-success: #43a047;
+$color-success-fg: $black;
+$color-success-light: #DDF1DE;
+
+$color-warning: #eea236;
+$color-warning-fg: $black;
+$color-warning-light: #fce5c5;;
+
+/* Used at highest level in places like tooltip backgroud */
+$color-gray-dark: #848ea0;
+/* Used for text colors at certain places */
+$color-gray: #bac1cd;
+/* Used mostly for panel background empty spaces */
+$color-gray-light: #ebeef3;
+/* Used mostly for disabled input backgrounds */
+$color-gray-lighter: #f3f5f9;
+
+$color-brand: $white;
+
+$border-color: #dde0e6;
+$shadow-base-color: $color-gray-dark;
+
+$text-muted: $color-gray-dark;
+$input-bg: $white;
+$input-color: $color-fg;
+$input-disabled-bg: $color-gray-lighter;
+
+$popover-bg: $color-bg;
+$popover-body-color: $color-fg;
+
+$active-color: $color-primary;
+
+$color-editor-fg: $color-fg;
+$color-editor-keyword: #908;
+$color-editor-number: #964;
+$color-editor-string: #a11;
+$color-editor-variable: $color-fg;
+$color-editor-variable-2: #05a;
+$color-editor-builtin: #30a;
+$color-editor-comment: #a50;
+$color-editor-bracket: #997;
+$color-editor-operator: $color-fg;
+$color-editor-foldmarker: #0000FF;
+$color-editor-activeline: #50B0F0;
+
+$explain-sev-2-bg: #FFEE88;
+$explain-sev-3-bg: #EE8800;
+$explain-sev-4-bg: #880000;
+$explain-sev-3-color: #FFFFFF;
+$explain-sev-4-color: #FFFFFF;
+
+$negative-bg: $color-gray-light;
+
+$loader-icon : url("data:image/svg+xml;charset=UTF-8,%3c?xml version='1.0' encoding='utf-8'?%3e%3csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 38 38' style='enable-background:new 0 0 38 38;' xml:space='preserve'%3e%3cstyle type='text/css'%3e .st0%7bfill:none;stroke:%23ebeef3;stroke-width:2;%7d .st1%7bfill:none;stroke:%23326690;stroke-width:2;%7d %3c/style%3e%3cg%3e%3cg transform='translate(1 1)'%3e%3ccircle class='st0' cx='18' cy='18' r='18'/%3e%3cpath class='st1' d='M36,18c0-9.9-8.1-18-18-18 '%3e%3canimateTransform accumulate='none' additive='replace' attributeName='transform' calcMode='linear' dur='0.7s' fill='remove' from='0 18 18' repeatCount='indefinite' restart='always' to='360 18 18' type='rotate'%3e%3c/animateTransform%3e%3c/path%3e%3c/g%3e%3c/g%3e%3c/svg%3e ") !default;
+$loader-icon-small: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Generator: Adobe Illustrator 23.1.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 38 38' style='enable-background:new 0 0 38 38;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:none;stroke:%23EBEEF3;stroke-width:5;%7D .st1%7Bfill:none;stroke:%23222222;stroke-width:5;%7D%0A%3C/style%3E%3Cg%3E%3Cg transform='translate(1 1)'%3E%3Ccircle class='st0' cx='18' cy='18' r='16'/%3E%3Cpath class='st1' d='M34,18c0-8.8-7.2-16-16-16 '%3E%3CanimateTransform accumulate='none' additive='replace' attributeName='transform' calcMode='linear' dur='0.7s' fill='remove' from='0 18 18' repeatCount='indefinite' restart='always' to='360 18 18' type='rotate'%3E%3C/animateTransform%3E%3C/path%3E%3C/g%3E%3C/g%3E%3C/svg%3E%0A") !default;
diff --git a/web/pgadmin/static/scss/resources/_utils.scss b/web/pgadmin/static/scss/resources/_utils.scss
deleted file mode 100644
index ed749243d..000000000
--- a/web/pgadmin/static/scss/resources/_utils.scss
+++ /dev/null
@@ -1,9 +0,0 @@
-.not-selectable {
- -webkit-touch-callout: none;
- -webkit-user-select: none;
- -khtml-user-select: none;
- -moz-user-select: none;
- ms-user-select: none;
- user-select: none;
- cursor: default;
-}
\ No newline at end of file
diff --git a/web/pgadmin/static/scss/resources/dark/_theme.variables.scss b/web/pgadmin/static/scss/resources/dark/_theme.variables.scss
new file mode 100644
index 000000000..e290fe289
--- /dev/null
+++ b/web/pgadmin/static/scss/resources/dark/_theme.variables.scss
@@ -0,0 +1,73 @@
+$white: #fff;
+$black: #000;
+
+$color-bg: #4d4d4d;
+$color-fg: #fff;
+
+$color-primary: #40617d;
+$color-primary-fg: $white;
+$color-primary-light: #536270;
+$color-primary-light-fg: $color-primary-fg;
+$color-primary-dark: #15354f;
+
+$color-secondary: #424242;
+
+$color-danger: #ff5370;
+$color-danger-fg: $white;
+$color-danger-light: #914649;
+$color-danger-lighter: #8f8282;
+
+$color-success: #6baa7f;
+$color-success-fg: $black;
+$color-success-light: #5a7863;
+
+$color-warning: #eea236;
+$color-warning-fg: $black;
+$color-warning-light: #fce5c5;
+
+/* For dark theme - colors are in reverse order
+ * gray-dark is lighter then gray-light
+ */
+$color-gray-dark: #595959;
+$color-gray: #424242;
+$color-gray-light: #303030;
+$color-gray-lighter: #212121;
+
+$color-brand: $white;
+
+$border-color: $color-gray;
+$shadow-base-color: $color-gray-lighter;
+
+$text-muted: #9d9fa1;
+$input-bg: $color-gray-lighter;
+$input-color: $color-fg;
+$input-disabled-bg: $color-bg;
+
+$popover-bg: $color-bg;
+$popover-body-color: $color-fg;
+
+$active-color: $color-fg;
+
+$color-editor-fg: #9cdcfe;
+$color-editor-keyword: #c58680;
+$color-editor-number: #81bb67;
+$color-editor-string: #dcdcaa;
+$color-editor-variable: #9cdcfe;
+$color-editor-variable-2: #9cdcfe;
+$color-editor-builtin: #dcdcaa;
+$color-editor-comment: #81bb67;
+$color-editor-bracket: #d4d4d4;
+$color-editor-operator: #d4d4d4;
+$color-editor-foldmarker: #0000FF !default;
+$color-editor-activeline: #50B0F0 !default;
+
+$explain-sev-2-bg: #ded17e;
+$explain-sev-3-bg: #c2812b;
+$explain-sev-4-bg: #880000;
+$explain-sev-3-color: $color-fg;
+$explain-sev-4-color: $color-fg;
+
+$negative-bg: $color-bg;
+
+$loader-icon : url("data:image/svg+xml;charset=UTF-8,%3c?xml version='1.0' encoding='utf-8'?%3e%3csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 38 38' style='enable-background:new 0 0 38 38;' xml:space='preserve'%3e%3cstyle type='text/css'%3e .st0%7bfill:none;stroke:%23ebeef3;stroke-width:2;%7d .st1%7bfill:none;stroke:%2340617d;stroke-width:2;%7d %3c/style%3e%3cg%3e%3cg transform='translate(1 1)'%3e%3ccircle class='st0' cx='18' cy='18' r='18'/%3e%3cpath class='st1' d='M36,18c0-9.9-8.1-18-18-18 '%3e%3canimateTransform accumulate='none' additive='replace' attributeName='transform' calcMode='linear' dur='0.7s' fill='remove' from='0 18 18' repeatCount='indefinite' restart='always' to='360 18 18' type='rotate'%3e%3c/animateTransform%3e%3c/path%3e%3c/g%3e%3c/g%3e%3c/svg%3e ") !default;
+$loader-icon-small: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Generator: Adobe Illustrator 23.1.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 38 38' style='enable-background:new 0 0 38 38;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:none;stroke:%23EBEEF3;stroke-width:5;%7D .st1%7Bfill:none;stroke:%2340617d;stroke-width:5;%7D%0A%3C/style%3E%3Cg%3E%3Cg transform='translate(1 1)'%3E%3Ccircle class='st0' cx='18' cy='18' r='16'/%3E%3Cpath class='st1' d='M34,18c0-8.8-7.2-16-16-16 '%3E%3CanimateTransform accumulate='none' additive='replace' attributeName='transform' calcMode='linear' dur='0.7s' fill='remove' from='0 18 18' repeatCount='indefinite' restart='always' to='360 18 18' type='rotate'%3E%3C/animateTransform%3E%3C/path%3E%3C/g%3E%3C/g%3E%3C/svg%3E%0A") !default;
diff --git a/web/pgadmin/static/scss/resources/dark/dark_preview.png b/web/pgadmin/static/scss/resources/dark/dark_preview.png
new file mode 100644
index 000000000..09cc988c1
Binary files /dev/null and b/web/pgadmin/static/scss/resources/dark/dark_preview.png differ
diff --git a/web/pgadmin/static/scss/resources/pgadmin.resources.scss b/web/pgadmin/static/scss/resources/pgadmin.resources.scss
index 4b6ba733d..787f83663 100644
--- a/web/pgadmin/static/scss/resources/pgadmin.resources.scss
+++ b/web/pgadmin/static/scss/resources/pgadmin.resources.scss
@@ -1,5 +1,3 @@
/* All the global variables, mixins goes here */
-@import 'pgadmin.variables.scss';
@import 'default.variables.scss';
@import 'default.style.scss';
-@import 'utils.scss';
diff --git a/web/pgadmin/static/scss/resources/standard_preview.png b/web/pgadmin/static/scss/resources/standard_preview.png
new file mode 100644
index 000000000..64b5eb507
Binary files /dev/null and b/web/pgadmin/static/scss/resources/standard_preview.png differ
diff --git a/web/pgadmin/templates/base.html b/web/pgadmin/templates/base.html
index ad9e75d5b..781a09246 100644
--- a/web/pgadmin/templates/base.html
+++ b/web/pgadmin/templates/base.html
@@ -20,7 +20,8 @@
-
+
+
{% block css_link %}{% endblock %}
diff --git a/web/pgadmin/tools/datagrid/templates/datagrid/index.html b/web/pgadmin/tools/datagrid/templates/datagrid/index.html
index 0f12665e5..30e87c558 100644
--- a/web/pgadmin/tools/datagrid/templates/datagrid/index.html
+++ b/web/pgadmin/tools/datagrid/templates/datagrid/index.html
@@ -49,7 +49,7 @@
title=""
accesskey=""
tabindex="0" disabled>
-
+
@@ -324,12 +324,12 @@
title=""
accesskey=""
tabindex="0" disabled>
-
+
-
+
@@ -370,7 +370,7 @@
data-panel-visible="visible"
accesskey=""
tabindex="0">
-
@@ -392,55 +392,57 @@
{% endblock %}
{% block init_script %}
- require(['sources/generated/sqleditor', 'sources/generated/browser_nodes', 'sources/generated/codemirror', 'sources/generated/slickgrid'], function(ctx) {
- var $ = pgAdmin.SqlEditor.jquery,
- S = pgAdmin.SqlEditor.S,
- editorPanel = $('.sql-editor'),
- loadingDiv = $('#fetching_data'),
- msgDiv = loadingDiv.find('.sql-editor-busy-text');
+require(['sources/generated/browser_nodes', 'sources/generated/codemirror', 'sources/generated/slickgrid'], function() {
+ require(['sources/generated/sqleditor'], function(ctx) {
+ var $ = pgAdmin.SqlEditor.jquery,
+ S = pgAdmin.SqlEditor.S,
+ editorPanel = $('.sql-editor'),
+ loadingDiv = $('#fetching_data'),
+ msgDiv = loadingDiv.find('.sql-editor-busy-text');
- // Register unload event on window close.
- /* If opened in new tab, close the connection only on tab/window close and
- * not on refresh attempt because the user may cancel the reload
- */
- if(window.opener) {
- $(window).on('unload', function(ev) {
- $.ajax({
- method: 'DELETE',
- url: "{{ url_for('datagrid.index') }}" + "close/" + {{ uniqueId }}
- });
- });
- } else {
- $(window).on('beforeunload', function(ev) {
- $.ajax({
- method: 'DELETE',
- url: "{{ url_for('datagrid.index') }}" + "close/" + {{ uniqueId }}
- });
- });
- }
+ // Register unload event on window close.
+ /* If opened in new tab, close the connection only on tab/window close and
+ * not on refresh attempt because the user may cancel the reload
+ */
+ if(window.opener) {
+ $(window).on('unload', function(ev) {
+ $.ajax({
+ method: 'DELETE',
+ url: "{{ url_for('datagrid.index') }}" + "close/" + {{ uniqueId }}
+ });
+ });
+ } else {
+ $(window).on('beforeunload', function(ev) {
+ $.ajax({
+ method: 'DELETE',
+ url: "{{ url_for('datagrid.index') }}" + "close/" + {{ uniqueId }}
+ });
+ });
+ }
- // Get the controller object from pgAdmin.SqlEditor
- var sqlEditorController = pgAdmin.SqlEditor.create(editorPanel);
+ // Get the controller object from pgAdmin.SqlEditor
+ var sqlEditorController = pgAdmin.SqlEditor.create(editorPanel);
- // Listen on events to show/hide loading-icon and change messages.
- sqlEditorController.on('pgadmin-sqleditor:loading-icon:message', function(msg) {
- msgDiv.text(msg);
- }).on('pgadmin-sqleditor:loading-icon:show', function(msg) {
- loadingDiv.removeClass('d-none');
- msgDiv.text(msg);
- }).on('pgadmin-sqleditor:loading-icon:hide', function() {
- loadingDiv.addClass('d-none');
- });
- {% if script_type_url %}
- var script_type_url = '{{ script_type_url }}';
- {% else %}
- var script_type_url = '';
- {% endif %}
- // Start the query tool.
- sqlEditorController.start(
- {{ uniqueId }},
- {{ url_params|safe}},
- '{{ layout|safe }}'
- );
+ // Listen on events to show/hide loading-icon and change messages.
+ sqlEditorController.on('pgadmin-sqleditor:loading-icon:message', function(msg) {
+ msgDiv.text(msg);
+ }).on('pgadmin-sqleditor:loading-icon:show', function(msg) {
+ loadingDiv.removeClass('d-none');
+ msgDiv.text(msg);
+ }).on('pgadmin-sqleditor:loading-icon:hide', function() {
+ loadingDiv.addClass('d-none');
+ });
+ {% if script_type_url %}
+ var script_type_url = '{{ script_type_url }}';
+ {% else %}
+ var script_type_url = '';
+ {% endif %}
+ // Start the query tool.
+ sqlEditorController.start(
+ {{ uniqueId }},
+ {{ url_params|safe}},
+ '{{ layout|safe }}'
+ );
+ });
});
{% endblock %}
diff --git a/web/pgadmin/tools/sqleditor/static/css/sqleditor.css b/web/pgadmin/tools/sqleditor/static/css/sqleditor.css
index 8831d5023..62c0f2c56 100644
--- a/web/pgadmin/tools/sqleditor/static/css/sqleditor.css
+++ b/web/pgadmin/tools/sqleditor/static/css/sqleditor.css
@@ -14,30 +14,6 @@
bottom: 0;
}
-.sql-scratch {
- width: 100%;
- height: 100%;
- box-sizing: border-box;
- overflow-y: hidden;
-}
-
-.sql-scratch textarea {
- width: 100%;
- height: 100%;
- box-sizing: border-box;
- border: none;
- resize: none;
-}
-
-.sql-editor-grid-container {
- height: 100%;
- overflow: auto;
-}
-
-.sql-editor-grid-container.has-no-footer {
- height: 100%;
-}
-
.filter-container .CodeMirror-scroll {
min-height: 120px;
}
@@ -274,53 +250,32 @@ input.editor-checkbox:focus {
white-space: pre;
}
-/* CSS for connection status icon */
-.connection_status .fa-custom {
- height: 18px;
- width: 18px;
- display: block;
- background-repeat: no-repeat;
- content: '';
+.connection_status {
+ font-size: 1rem;
}
-.connection_status .fa-query-tool-connected {
- background-image: url('../img/connect.svg');
+.icon-query-tool-connected:before {
+ font-icon: url('../img/connect.svg');
}
-.connection_status .fa-query-tool-disconnected {
- background-image: url('../img/disconnect.svg');
+.icon-query-tool-disconnected:before {
+ font-icon: url('../img/disconnect.svg');
}
-.connection_status .obtaining-conn {
- background-image: url('../img/loading.gif') !important;
+.icon-commit:before {
+ font-icon: url('../img/commit.svg');
}
-.icon-commit, .icon-rollback, .icon-save-data-changes, .icon-view-data {
- display: inline-block;
- align-content: center;
- vertical-align: middle;
- height: 18px;
- width: 18px;
- background-size: 22px !important;
- background-repeat: no-repeat;
- background-position-x: center;
- background-position-y: center;
+.icon-rollback:before {
+ font-icon: url('../img/rollback.svg');
}
-.icon-commit {
- background-image: url('../img/commit.svg') !important;
+.icon-save-data-changes:before {
+ font-icon: url('../img/save_data_changes.svg');
}
-.icon-rollback {
- background-image: url('../img/rollback.svg') !important;
-}
-
-.icon-save-data-changes {
- background-image: url('../img/save_data_changes.svg') !important;
-}
-
-.icon-view-data {
- background-image: url('../img/view_data.svg') !important;
+.icon-view-data:before {
+ font-icon: url('../img/view_data.svg');
}
.ajs-body .warn-header {
diff --git a/web/pgadmin/tools/sqleditor/static/img/commit.svg b/web/pgadmin/tools/sqleditor/static/img/commit.svg
index 7fd36e8b8..5047ac3e6 100644
--- a/web/pgadmin/tools/sqleditor/static/img/commit.svg
+++ b/web/pgadmin/tools/sqleditor/static/img/commit.svg
@@ -1 +1,22 @@
-commit
+
+
+
+commit
+
+
diff --git a/web/pgadmin/tools/sqleditor/static/img/connect.svg b/web/pgadmin/tools/sqleditor/static/img/connect.svg
index 9170fc9b5..c311f2868 100644
--- a/web/pgadmin/tools/sqleditor/static/img/connect.svg
+++ b/web/pgadmin/tools/sqleditor/static/img/connect.svg
@@ -1 +1,23 @@
-connect
+
+
+
+connect
+
+
diff --git a/web/pgadmin/tools/sqleditor/static/img/disconnect.svg b/web/pgadmin/tools/sqleditor/static/img/disconnect.svg
index 113b7588d..1fe248042 100644
--- a/web/pgadmin/tools/sqleditor/static/img/disconnect.svg
+++ b/web/pgadmin/tools/sqleditor/static/img/disconnect.svg
@@ -1 +1,24 @@
-disconnect
+
+
+
+disconnect
+
+
diff --git a/web/pgadmin/tools/sqleditor/static/img/rollback.svg b/web/pgadmin/tools/sqleditor/static/img/rollback.svg
index 89713cdf4..c0566447f 100644
--- a/web/pgadmin/tools/sqleditor/static/img/rollback.svg
+++ b/web/pgadmin/tools/sqleditor/static/img/rollback.svg
@@ -1 +1,22 @@
-rollback
+
+
+
+rollback
+
+
diff --git a/web/pgadmin/tools/sqleditor/static/img/save_data_changes.svg b/web/pgadmin/tools/sqleditor/static/img/save_data_changes.svg
index 09ead9286..1b1140237 100644
--- a/web/pgadmin/tools/sqleditor/static/img/save_data_changes.svg
+++ b/web/pgadmin/tools/sqleditor/static/img/save_data_changes.svg
@@ -1,12 +1,32 @@
-
+
+
+
save_data_changes
-
-
-Layer 1
-
-
-
\ No newline at end of file
+
+
diff --git a/web/pgadmin/tools/sqleditor/static/img/view_data.svg b/web/pgadmin/tools/sqleditor/static/img/view_data.svg
index 8a1a382b4..803d12cb5 100644
--- a/web/pgadmin/tools/sqleditor/static/img/view_data.svg
+++ b/web/pgadmin/tools/sqleditor/static/img/view_data.svg
@@ -1,9 +1,26 @@
-
-
-save_data_changes
-
-
-Layer 1
\ No newline at end of file
+
+
+
+
+
diff --git a/web/pgadmin/tools/sqleditor/static/scss/_history.scss b/web/pgadmin/tools/sqleditor/static/scss/_history.scss
index 68f7fcd2c..b2922630f 100644
--- a/web/pgadmin/tools/sqleditor/static/scss/_history.scss
+++ b/web/pgadmin/tools/sqleditor/static/scss/_history.scss
@@ -3,7 +3,7 @@
.list-item {
border-bottom: $panel-border;
- background-color: $color-bg-theme;
+ background-color: $color-bg;
}
.entry {
@@ -81,8 +81,8 @@
.header-label {
@extend .text-12;
- @extend .text-gray;
display: block;
+ color: $color-fg;
}
@@ -98,7 +98,7 @@
width: 100%;
display: flex;
flex-direction: column;
- background-color: $color-bg-theme;
+ background-color: $color-bg;
.error-message-block {
background: $sql-history-error-bg;
flex: 0.3;
@@ -163,8 +163,8 @@
float: left;
position: relative;
z-index: 10;
- border: 1px solid $color-gray-light;
- color: $color-primary;
+ border: 1px solid $border-color;
+ color: $color-fg;
font-size: 12px;
box-shadow: 1px 2px 4px 0px $color-gray-light;
padding: 3px 12px 3px 10px;
@@ -172,13 +172,14 @@
min-width: 75px;
}
- .copy-all {
+ .copy-all, .copy-to-editor {
background-color: $color-bg;
}
.was-copied {
background-color: $color-primary-light;
border-color: $color-primary-light;
+ color: $active-color;
}
.CodeMirror-scroll {
@@ -217,6 +218,7 @@
@extend .bg-white;
@extend .text-13;
font-family: $font-family-editor;
+ color: $color-fg;
border: 0;
padding-left: 0;
position: absolute;
diff --git a/web/pgadmin/tools/sqleditor/static/scss/_sqleditor.scss b/web/pgadmin/tools/sqleditor/static/scss/_sqleditor.scss
index 2742f3204..0ecfc3894 100644
--- a/web/pgadmin/tools/sqleditor/static/scss/_sqleditor.scss
+++ b/web/pgadmin/tools/sqleditor/static/scss/_sqleditor.scss
@@ -110,7 +110,7 @@ li.CodeMirror-hint-active {
.slick-cell.cell-move-handle {
font-weight: bold;
text-align: right;
- border-right: solid $color-gray;
+ border-right: solid $border-color;
background: $color-gray-lighter;
cursor: move;
}
@@ -129,7 +129,7 @@ li.CodeMirror-hint-active {
}
.cell-selection {
- border-right-color: $color-gray-light;
+ border-right-color: $border-color;
border-right-style: solid;
background: $color-gray-lighter;
color: $color-gray;
@@ -138,7 +138,8 @@ li.CodeMirror-hint-active {
}
#datagrid .slick-header .slick-header-columns {
- background: $color-bg;
+ background: $sql-grid-title-cell-bg;
+ color: $sql-grid-title-cell-fg;
height: 40px;
border-bottom: $panel-border;
}
@@ -222,6 +223,27 @@ li.CodeMirror-hint-active {
}
/* color the first column */
+
+#datagrid .slick-row {
+ .slick-cell {
+ background-color: $sql-grid-data-cell-bg;
+ color: $sql-grid-data-cell-fg;
+ }
+
+ .slick-cell.l0.r0 {
+ background-color: $sql-grid-title-cell-bg;
+ color: $sql-grid-title-cell-fg;
+ }
+}
+
+#datagrid div.slick-header.ui-state-default {
+ background-color: $sql-grid-title-cell-bg;
+ color: $sql-grid-title-cell-fg;
+ border-bottom: none;
+ border-right: none;
+ border-top: none;
+}
+
#datagrid .slick-row .slick-cell.l0.r0.selected {
background-color: $color-primary;
color: $color-primary-fg;
@@ -233,17 +255,10 @@ li.CodeMirror-hint-active {
border-bottom: $table-hover-border;
}
-#datagrid div.slick-header.ui-state-default {
- background: $color-bg;
- border-bottom: none;
- border-right: none;
- border-top: none;
-}
-
.pg-text-editor {
z-index:10000;
position:absolute;
- background: $color-bg-theme;
+ background: $color-bg;
padding: 0.25rem;
border: $panel-border;
box-shadow: $dropdown-box-shadow;
@@ -299,3 +314,55 @@ div.strikeout:after {
content: "\00B7";
font-size: 1px;
}
+
+.sql-scratch {
+ width: 100%;
+ height: 100%;
+ box-sizing: border-box;
+ overflow-y: hidden;
+
+ textarea {
+ width: 100%;
+ height: 100%;
+ box-sizing: border-box;
+ border: none;
+ resize: none;
+ }
+}
+
+.icon-query-tool-connected {
+ color: $color-primary;
+}
+
+.icon-query-tool-disconnected {
+ color: $color-danger;
+}
+
+.connection_status .obtaining-conn {
+ background-image: $loader-icon-small !important;
+ background-position: center center;
+ background-repeat: no-repeat;
+ &:before {
+ content:'';
+ }
+ min-width: 50%;
+ min-height: 100%;
+}
+
+.sql-editor-grid-container {
+ height: 100%;
+ overflow: auto;
+
+ .ui-widget-content {
+ background-color: $input-bg;
+ color: $input-color;
+ }
+
+ .ui-state-default {
+ color: $color-fg;
+ }
+}
+
+.sql-editor-grid-container.has-no-footer {
+ height: 100%;
+}
diff --git a/web/webpack.config.js b/web/webpack.config.js
index bc64081e2..2acaacb55 100644
--- a/web/webpack.config.js
+++ b/web/webpack.config.js
@@ -22,15 +22,20 @@ const UglifyJsPlugin = require('uglifyjs-webpack-plugin');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const extractStyle = new MiniCssExtractPlugin({
filename: '[name].css',
+ chunkFilename: '[name].css',
allChunks: true,
});
const WebpackRequireFromPlugin = require('webpack-require-from');
const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
+const CopyPlugin = require('copy-webpack-plugin');
+const IconfontWebpackPlugin = require('iconfont-webpack-plugin');
const envType = PRODUCTION ? 'production': 'development';
const devToolVal = PRODUCTION ? false : 'eval';
const analyzerMode = process.env.ANALYZE=='true' ? 'static' : 'disabled';
+const outputPath = __dirname + '/pgadmin/static/js/generated';
+
// Expose libraries in app context so they need not to
// require('libname') when used in a module
const providePlugin = new webpack.ProvidePlugin({
@@ -62,7 +67,7 @@ const optimizeAssetsPlugin = new OptimizeCssAssetsPlugin({
// Reference: https://webpack.js.org/plugins/source-map-dev-tool-plugin/#components/sidebar/sidebar.jsx
const sourceMapDevToolPlugin = new webpack.SourceMapDevToolPlugin({
filename: '[name].js.map',
- exclude: /(vendor|codemirror|slickgrid|pgadmin\.js|style\.js|popper)/,
+ exclude: /(vendor|codemirror|slickgrid|pgadmin\.js|pgadmin.theme|pgadmin.static|style\.js|popper)/,
columns: false,
});
@@ -79,6 +84,16 @@ const bundleAnalyzer = new BundleAnalyzerPlugin({
reportFilename: 'analyze_report.html',
});
+let pgadminThemesJson = 'pgadmin.themes.json';
+const copyFiles = new CopyPlugin([
+ pgadminThemesJson,
+ {
+ from: './pgadmin/static/scss/resources/**/*.png',
+ to: outputPath + '/img',
+ flatten: true,
+ },
+]);
+
function cssToBeSkiped(curr_path) {
/** Skip all templates **/
if(curr_path.indexOf('template') > -1) {
@@ -96,7 +111,7 @@ function cssToBeSkiped(curr_path) {
/* Get all the style files recursively and store in array to
* give input to webpack.
*/
-function pushModulesCss(curr_path, pgadminStyles) {
+function pushModulesStyles(curr_path, pgadminStyles, extn) {
/** Skip Directories */
if(cssToBeSkiped(curr_path)) {
return;
@@ -111,22 +126,223 @@ function pushModulesCss(curr_path, pgadminStyles) {
let stats = fs.statSync(path.join(curr_path, curr_file));
/* if directory, dig further */
if(stats.isDirectory()) {
- pushModulesCss(path.join(curr_path, curr_file), pgadminStyles);
+ pushModulesStyles(path.join(curr_path, curr_file), pgadminStyles, extn);
}
- else if(stats.isFile() && (curr_file.endsWith('.scss') || curr_file.endsWith('.css'))) {
+ else if(stats.isFile() && (curr_file.endsWith(extn))) {
pgadminStyles.push(path.join(curr_path, curr_file));
}
});
}
-let pgadminStyles = [];
+let pgadminScssStyles = [];
+let pgadminCssStyles = [];
+
/* Include what is given in shim config */
for(let i=0; i [
+ require('autoprefixer')(),
+ new IconfontWebpackPlugin(loader),
+ ],
+ },
+ },
+ {loader: 'sass-loader'},
+ {
+ loader: 'sass-resources-loader',
+ options: {
+ resources: function(theme_name){
+ let ret_res = [
+ './pgadmin/static/scss/resources/' + theme_name + '/_theme.variables.scss',
+ './pgadmin/static/scss/resources/pgadmin.resources.scss',
+ ];
+ if(theme_name!='standard') {
+ ret_res.unshift('./pgadmin/static/scss/resources/' + theme_name + '/_theme.variables.scss');
+ }
+ return ret_res;
+ }(theme_name),
+ },
+ },
+ ],
+ }, {
+ test: /\.css$/,
+ use: [
+ MiniCssExtractPlugin.loader,
+ 'css-loader',
+ {
+ loader: 'postcss-loader',
+ options: {
+ plugins: (loader) => [
+ require('autoprefixer')(),
+ new IconfontWebpackPlugin(loader),
+ ],
+ },
+ },
+ ],
+ }];
+};
+
+var getThemeWebpackConfig = function(theme_name) {
+ return {
+ mode: envType,
+ devtool: devToolVal,
+ stats: { children: false },
+ // The base directory, an absolute path, for resolving entry points and loaders
+ // from configuration.
+ context: __dirname,
+ // Specify entry points of application
+ entry: {
+ [pgadminThemes[theme_name].cssfile]: pgadminScssStyles,
+ },
+ // path: The output directory for generated bundles(defined in entry)
+ // Ref: https://webpack.js.org/configuration/output/#output-library
+ output: {
+ libraryTarget: 'amd',
+ path: outputPath,
+ filename: '[name].js',
+ libraryExport: 'default',
+ },
+ // Templates files which contains python code needs to load dynamically
+ // Such files specified in externals are loaded at first and defined in
+ // the start of generated bundle within define(['libname'],fn) etc.
+ externals: webpackShimConfig.externals,
+ module: {
+ // References:
+ // Module and Rules: https://webpack.js.org/configuration/module/
+ // Loaders: https://webpack.js.org/loaders/
+ //
+ // imports-loader: it adds dependent modules(use:imports-loader?module1)
+ // at the beginning of module it is dependency of like:
+ // var jQuery = require('jquery'); var browser = require('pgadmin.browser')
+ // It solves number of problems
+ // Ref: http:/github.com/webpack-contrib/imports-loader/
+ rules: themeCssRules(theme_name),
+ },
+ resolve: {
+ alias: webpackShimConfig.resolveAlias,
+ modules: ['node_modules', '.'],
+ extensions: ['.js'],
+ unsafeCache: true,
+ },
+ // Watch mode Configuration: After initial build, webpack will watch for
+ // changes in files and compiles only files which are changed,
+ // if watch is set to True
+ // Reference: https://webpack.js.org/configuration/watch/#components/sidebar/sidebar.jsx
+ watchOptions: {
+ aggregateTimeout: 300,
+ poll: 1000,
+ ignored: /node_modules/,
+ },
+ // Define list of Plugins used in Production or development mode
+ // Ref:https://webpack.js.org/concepts/plugins/#components/sidebar/sidebar.jsx
+ plugins: PRODUCTION ? [
+ extractStyle,
+ optimizeAssetsPlugin,
+ sourceMapDevToolPlugin,
+ ]: [
+ extractStyle,
+ sourceMapDevToolPlugin,
+ ],
+ };
+};
+
+var pgadminThemesWebpack = [];
+Object.keys(pgadminThemes).map((theme_name)=>{
+ pgadminThemesWebpack.push(getThemeWebpackConfig(theme_name));
+});
+
+module.exports = [{
mode: envType,
devtool: devToolVal,
stats: { children: false },
@@ -141,14 +357,15 @@ module.exports = {
sqleditor: './pgadmin/tools/sqleditor/static/js/sqleditor.js',
debugger_direct: './pgadmin/tools/debugger/static/js/direct.js',
file_utils: './pgadmin/misc/file_manager/static/js/utility.js',
- pgadmin: pgadminStyles,
+ 'pgadmin.style': pgadminCssStyles,
+ pgadmin: pgadminScssStyles,
style: './pgadmin/static/css/style.css',
},
// path: The output directory for generated bundles(defined in entry)
// Ref: https://webpack.js.org/configuration/output/#output-library
output: {
libraryTarget: 'amd',
- path: __dirname + '/pgadmin/static/js/generated',
+ path: outputPath,
filename: '[name].js',
chunkFilename: '[name].chunk.js',
libraryExport: 'default',
@@ -282,73 +499,7 @@ module.exports = {
use: {
loader: 'imports-loader?this=>window,fix=>module.exports=0',
},
- }, {
- test: /\.(jpe?g|png|gif|svg)$/i,
- loaders: [{
- loader: 'url-loader',
- options: {
- emitFile: true,
- name: 'img/[name].[ext]',
- limit: 4096,
- },
- }, {
- loader: 'image-webpack-loader',
- query: {
- bypassOnDebug: true,
- mozjpeg: {
- progressive: true,
- },
- gifsicle: {
- interlaced: false,
- },
- optipng: {
- optimizationLevel: 7,
- },
- pngquant: {
- quality: '75-90',
- speed: 3,
- },
- },
- }],
- exclude: /vendor/,
- }, {
- test: /\.(eot|svg|ttf|woff|woff2)$/,
- loaders: [{
- loader: 'file-loader',
- options: {
- name: 'fonts/[name].[ext]',
- emitFile: true,
- },
- }],
- include: [
- /node_modules/,
- path.join(sourceDir, '/css/'),
- path.join(sourceDir, '/scss/'),
- path.join(sourceDir, '/fonts/'),
- ],
- exclude: /vendor/,
- }, {
- test: /\.scss$/,
- use: [
- {loader: MiniCssExtractPlugin.loader},
- {loader: 'css-loader'},
- {loader: 'sass-loader'},
- {
- loader: 'sass-resources-loader',
- options: {
- resources: [
- './pgadmin/static/scss/resources/pgadmin.resources.scss',
- ],
- },
- },
- ],
- }, {
- test: /\.css$/,
- use: [
- MiniCssExtractPlugin.loader,
- 'css-loader',
- ],
- }],
+ }].concat(themeCssRules('standard')),
// Prevent module from parsing through webpack, helps in reducing build time
noParse: [/moment.js/],
},
@@ -466,10 +617,12 @@ module.exports = {
sourceMapDevToolPlugin,
webpackRequireFrom,
bundleAnalyzer,
+ copyFiles,
]: [
extractStyle,
providePlugin,
sourceMapDevToolPlugin,
webpackRequireFrom,
+ copyFiles,
],
-};
+}].concat(pgadminThemesWebpack);
diff --git a/web/yarn.lock b/web/yarn.lock
index 8f325cf2b..9066fa4ae 100644
--- a/web/yarn.lock
+++ b/web/yarn.lock
@@ -1030,7 +1030,7 @@ are-we-there-yet@~1.1.2:
delegates "^1.0.0"
readable-stream "^2.0.6"
-argparse@^1.0.7:
+argparse@^1.0.6, argparse@^1.0.7:
version "1.0.10"
resolved "https://registry.yarnpkg.com/argparse/-/argparse-1.0.10.tgz#bcd6791ea5ae09725e17e5ad988134cd40b3d911"
integrity sha512-o5Roy6tNG4SL/FOkCAN6RzjiakZS25RLYFrcMttJqbdd8BWrnA+fGz57iN5Pb06pvBGvl5gQ0B48dJlslXvoTg==
@@ -1188,6 +1188,19 @@ atob@^2.1.1:
resolved "https://registry.yarnpkg.com/atob/-/atob-2.1.2.tgz#6d9517eb9e030d2436666651e86bd9f6f13533c9"
integrity sha512-Wm6ukoaOGJi/73p/cl2GvLjTI5JM1k/O14isD73YML8StrH/7/lRFgmg8nICZgD3bZZvjwCGxtMOD3wWNAu8cg==
+autoprefixer@^9.6.4:
+ version "9.6.4"
+ resolved "https://registry.yarnpkg.com/autoprefixer/-/autoprefixer-9.6.4.tgz#e6453be47af316b2923eaeaed87860f52ad4b7eb"
+ integrity sha512-Koz2cJU9dKOxG8P1f8uVaBntOv9lP4yz9ffWvWaicv9gHBPhpQB22nGijwd8gqW9CNT+UdkbQOQNLVI8jN1ZfQ==
+ dependencies:
+ browserslist "^4.7.0"
+ caniuse-lite "^1.0.30000998"
+ chalk "^2.4.2"
+ normalize-range "^0.1.2"
+ num2fraction "^1.2.2"
+ postcss "^7.0.18"
+ postcss-value-parser "^4.0.2"
+
aws-sign2@~0.7.0:
version "0.7.0"
resolved "https://registry.yarnpkg.com/aws-sign2/-/aws-sign2-0.7.0.tgz#b46e890934a9591f2d2f6f86d7e6a9f1b3fe76a8"
@@ -2039,7 +2052,7 @@ browserify@^16.1.0, browserify@~16.2.3:
vm-browserify "^1.0.0"
xtend "^4.0.0"
-browserslist@^4.0.0, browserslist@^4.6.0, browserslist@^4.7.1:
+browserslist@^4.0.0, browserslist@^4.6.0, browserslist@^4.7.0, browserslist@^4.7.1:
version "4.7.2"
resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-4.7.2.tgz#1bb984531a476b5d389cedecb195b2cd69fb1348"
integrity sha512-uZavT/gZXJd2UTi9Ov7/Z340WOSQ3+m1iBVRUknf+okKxonL9P83S3ctiBDtuRmRu8PiCHjqyueqQ9HYlJhxiw==
@@ -2132,6 +2145,26 @@ bytes@3.1.0:
resolved "https://registry.yarnpkg.com/bytes/-/bytes-3.1.0.tgz#f6cf7933a360e0588fa9fde85651cdc7f805d1f6"
integrity sha512-zauLjrfCG+xvoyaqLoV8bLVXXNGC4JqlxFCutSDWA6fJrTo2ZuvLYTqZ7aHBLZSMOopbzwv8f+wZcVzfVTI2Dg==
+cacache@^11.3.3:
+ version "11.3.3"
+ resolved "https://registry.yarnpkg.com/cacache/-/cacache-11.3.3.tgz#8bd29df8c6a718a6ebd2d010da4d7972ae3bbadc"
+ integrity sha512-p8WcneCytvzPxhDvYp31PD039vi77I12W+/KfR9S8AZbaiARFBCpsPJS+9uhWfeBfeAtW7o/4vt3MUqLkbY6nA==
+ dependencies:
+ bluebird "^3.5.5"
+ chownr "^1.1.1"
+ figgy-pudding "^3.5.1"
+ glob "^7.1.4"
+ graceful-fs "^4.1.15"
+ lru-cache "^5.1.1"
+ mississippi "^3.0.0"
+ mkdirp "^0.5.1"
+ move-concurrently "^1.0.1"
+ promise-inflight "^1.0.1"
+ rimraf "^2.6.3"
+ ssri "^6.0.1"
+ unique-filename "^1.1.1"
+ y18n "^4.0.0"
+
cacache@^12.0.2:
version "12.0.3"
resolved "https://registry.yarnpkg.com/cacache/-/cacache-12.0.3.tgz#be99abba4e1bf5df461cd5a2c1071fc432573390"
@@ -2253,6 +2286,11 @@ caniuse-lite@^1.0.0, caniuse-lite@^1.0.30001004:
resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001004.tgz#d879b73981b255488316da946c39327d8c00a586"
integrity sha512-3nfOR4O8Wa2RWoYfJkMtwRVOsK96TQ+eq57wd0iKaEWl8dwG4hKZ/g0MVBfCvysFvMLi9fQGR/DvozMdkEPl3g==
+caniuse-lite@^1.0.30000998:
+ version "1.0.30000999"
+ resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30000999.tgz#427253a69ad7bea4aa8d8345687b8eec51ca0e43"
+ integrity sha512-1CUyKyecPeksKwXZvYw0tEoaMCo/RwBlXmEtN5vVnabvO0KPd9RQLcaAuR9/1F+KDMv6esmOFWlsXuzDk+8rxg==
+
caseless@~0.12.0:
version "0.12.0"
resolved "https://registry.yarnpkg.com/caseless/-/caseless-0.12.0.tgz#1b681c21ff84033c826543090689420d187151dc"
@@ -2543,7 +2581,7 @@ combined-stream@^1.0.6, combined-stream@~1.0.6:
dependencies:
delayed-stream "~1.0.0"
-commander@^2.18.0, commander@^2.19.0, commander@^2.20.0, commander@~2.20.3:
+commander@^2.12.2, commander@^2.18.0, commander@^2.19.0, commander@^2.20.0, commander@~2.20.3:
version "2.20.3"
resolved "https://registry.yarnpkg.com/commander/-/commander-2.20.3.tgz#fd485e84c03eb4881c20722ba48035e8531aeb33"
integrity sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ==
@@ -2691,6 +2729,24 @@ copy-descriptor@^0.1.0:
resolved "https://registry.yarnpkg.com/copy-descriptor/-/copy-descriptor-0.1.1.tgz#676f6eb3c39997c2ee1ac3a924fd6124748f578d"
integrity sha1-Z29us8OZl8LuGsOpJP1hJHSPV40=
+copy-webpack-plugin@^5.0.4:
+ version "5.0.4"
+ resolved "https://registry.yarnpkg.com/copy-webpack-plugin/-/copy-webpack-plugin-5.0.4.tgz#c78126f604e24f194c6ec2f43a64e232b5d43655"
+ integrity sha512-YBuYGpSzoCHSSDGyHy6VJ7SHojKp6WHT4D7ItcQFNAYx2hrwkMe56e97xfVR0/ovDuMTrMffXUiltvQljtAGeg==
+ dependencies:
+ cacache "^11.3.3"
+ find-cache-dir "^2.1.0"
+ glob-parent "^3.1.0"
+ globby "^7.1.1"
+ is-glob "^4.0.1"
+ loader-utils "^1.2.3"
+ minimatch "^3.0.4"
+ normalize-path "^3.0.0"
+ p-limit "^2.2.0"
+ schema-utils "^1.0.0"
+ serialize-javascript "^1.7.0"
+ webpack-log "^2.0.0"
+
core-js-compat@^3.1.1:
version "3.3.3"
resolved "https://registry.yarnpkg.com/core-js-compat/-/core-js-compat-3.3.3.tgz#82642808cf484a35292b2f8e83ef9376884e760f"
@@ -2970,6 +3026,11 @@ csso@^3.5.1:
dependencies:
css-tree "1.0.0-alpha.29"
+cubic2quad@^1.0.0:
+ version "1.1.1"
+ resolved "https://registry.yarnpkg.com/cubic2quad/-/cubic2quad-1.1.1.tgz#69b19c61a3f5b41ecf2f1d5fae8fb03415aa8b15"
+ integrity sha1-abGcYaP1tB7PLx1fro+wNBWqixU=
+
currently-unhandled@^0.4.1:
version "0.4.1"
resolved "https://registry.yarnpkg.com/currently-unhandled/-/currently-unhandled-0.4.1.tgz#988df33feab191ef799a61369dd76c17adf957ea"
@@ -3248,6 +3309,13 @@ diffie-hellman@^5.0.0:
miller-rabin "^4.0.0"
randombytes "^2.0.0"
+dir-glob@^2.0.0:
+ version "2.2.2"
+ resolved "https://registry.yarnpkg.com/dir-glob/-/dir-glob-2.2.2.tgz#fa09f0694153c8918b18ba0deafae94769fc50c4"
+ integrity sha512-f9LBi5QWzIW3I6e//uxZoLBlUt9kcp66qo0sSCxL6YZKc75R1c4MFCoe/LaZiBGmgujvQdxc5Bn3QhfyvK5Hsw==
+ dependencies:
+ path-type "^3.0.0"
+
doctrine@^3.0.0:
version "3.0.0"
resolved "https://registry.yarnpkg.com/doctrine/-/doctrine-3.0.0.tgz#addebead72a6574db783639dc87a121773973961"
@@ -4296,6 +4364,11 @@ gaze@^1.0.0:
dependencies:
globule "^1.0.0"
+geometry-interfaces@^1.1.4:
+ version "1.1.4"
+ resolved "https://registry.yarnpkg.com/geometry-interfaces/-/geometry-interfaces-1.1.4.tgz#9e82af6700ca639a675299f08e1f5fbc4a79d48d"
+ integrity sha512-qD6OdkT6NcES9l4Xx3auTpwraQruU7dARbQPVO71MKvkGYw5/z/oIiGymuFXrRaEQa5Y67EIojUpaLeGEa5hGA==
+
get-assigned-identifiers@^1.2.0:
version "1.2.0"
resolved "https://registry.yarnpkg.com/get-assigned-identifiers/-/get-assigned-identifiers-1.2.0.tgz#6dbf411de648cbaf8d9169ebb0d2d576191e2ff1"
@@ -4465,6 +4538,18 @@ globby@^6.1.0:
pify "^2.0.0"
pinkie-promise "^2.0.0"
+globby@^7.1.1:
+ version "7.1.1"
+ resolved "https://registry.yarnpkg.com/globby/-/globby-7.1.1.tgz#fb2ccff9401f8600945dfada97440cca972b8680"
+ integrity sha1-+yzP+UAfhgCUXfral0QMypcrhoA=
+ dependencies:
+ array-union "^1.0.1"
+ dir-glob "^2.0.0"
+ glob "^7.1.2"
+ ignore "^3.3.5"
+ pify "^3.0.0"
+ slash "^1.0.0"
+
globule@^1.0.0:
version "1.2.1"
resolved "https://registry.yarnpkg.com/globule/-/globule-1.2.1.tgz#5dffb1b191f22d20797a9369b49eab4e9839696d"
@@ -4814,6 +4899,17 @@ https-browserify@^1.0.0:
resolved "https://registry.yarnpkg.com/https-browserify/-/https-browserify-1.0.0.tgz#ec06c10e0a34c0f2faf199f7fd7fc78fffd03c73"
integrity sha1-7AbBDgo0wPL68Zn3/X/Hj//QPHM=
+iconfont-webpack-plugin@^4.2.1:
+ version "4.2.1"
+ resolved "https://registry.yarnpkg.com/iconfont-webpack-plugin/-/iconfont-webpack-plugin-4.2.1.tgz#bd1b1ab2960affd602b207d1523d79dea4f21aea"
+ integrity sha512-OIBHTSgir7uGwM0nw+UbCsfDXg/OEfn9ixrgsRygKm2nY8JGTy9zHxOWbQE6xDaP92/jYzQL3GjCy3kiBvBYtw==
+ dependencies:
+ loader-utils "1.2.3"
+ postcss "6.0.23"
+ svg2ttf "4.3.0"
+ svgicons2svgfont "9.1.1"
+ ttf2woff "2.0.1"
+
iconv-lite@0.4.24, iconv-lite@^0.4.15, iconv-lite@^0.4.24, iconv-lite@^0.4.4:
version "0.4.24"
resolved "https://registry.yarnpkg.com/iconv-lite/-/iconv-lite-0.4.24.tgz#2022b4b25fbddc21d2f524974a474aafe733908b"
@@ -4850,6 +4946,11 @@ ignore-walk@^3.0.1:
dependencies:
minimatch "^3.0.4"
+ignore@^3.3.5:
+ version "3.3.10"
+ resolved "https://registry.yarnpkg.com/ignore/-/ignore-3.3.10.tgz#0a97fb876986e8081c631160f8f9f389157f0043"
+ integrity sha512-Pgs951kaMm5GXP7MOvxERINe3gsaVjUWFm+UZPSq9xYriQAksyhg0csnS0KXSNRD5NmNdapXEpjxG49+AKh/ug==
+
ignore@^4.0.6:
version "4.0.6"
resolved "https://registry.yarnpkg.com/ignore/-/ignore-4.0.6.tgz#750e3db5862087b4737ebac8207ffd1ef27b25fc"
@@ -4943,6 +5044,13 @@ immutability-helper@^3.0.0:
dependencies:
invariant "^2.2.4"
+import-cwd@^2.0.0:
+ version "2.1.0"
+ resolved "https://registry.yarnpkg.com/import-cwd/-/import-cwd-2.1.0.tgz#aa6cf36e722761285cb371ec6519f53e2435b0a9"
+ integrity sha1-qmzzbnInYShcs3HsZRn1PiQ1sKk=
+ dependencies:
+ import-from "^2.1.0"
+
import-fresh@^2.0.0:
version "2.0.0"
resolved "https://registry.yarnpkg.com/import-fresh/-/import-fresh-2.0.0.tgz#d81355c15612d386c61f9ddd3922d4304822a546"
@@ -4959,6 +5067,13 @@ import-fresh@^3.0.0:
parent-module "^1.0.0"
resolve-from "^4.0.0"
+import-from@^2.1.0:
+ version "2.1.0"
+ resolved "https://registry.yarnpkg.com/import-from/-/import-from-2.1.0.tgz#335db7f2a7affd53aaa471d4b8021dee36b7f3b1"
+ integrity sha1-M1238qev/VOqpHHUuAId7ja387E=
+ dependencies:
+ resolve-from "^3.0.0"
+
import-lazy@^3.1.0:
version "3.1.0"
resolved "https://registry.yarnpkg.com/import-lazy/-/import-lazy-3.1.0.tgz#891279202c8a2280fdbd6674dbd8da1a1dfc67cc"
@@ -5463,6 +5578,11 @@ is-wsl@^1.1.0:
resolved "https://registry.yarnpkg.com/is-wsl/-/is-wsl-1.1.0.tgz#1f16e4aa22b04d1336b66188a66af3c600c3a66d"
integrity sha1-HxbkqiKwTRM2tmGIpmrzxgDDpm0=
+isarray@0.0.1:
+ version "0.0.1"
+ resolved "https://registry.yarnpkg.com/isarray/-/isarray-0.0.1.tgz#8a18acfca9a8f4177e09abfc6038939b05d1eedf"
+ integrity sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8=
+
isarray@1.0.0, isarray@^1.0.0, isarray@~1.0.0:
version "1.0.0"
resolved "https://registry.yarnpkg.com/isarray/-/isarray-1.0.0.tgz#bb935d48582cba168c06834957a54a3e07124f11"
@@ -6156,6 +6276,11 @@ methods@~1.1.2:
resolved "https://registry.yarnpkg.com/methods/-/methods-1.1.2.tgz#5529a4d67654134edcc5266656835b0f851afcee"
integrity sha1-VSmk1nZUE07cxSZmVoNbD4Ua/O4=
+microbuffer@^1.0.0:
+ version "1.0.0"
+ resolved "https://registry.yarnpkg.com/microbuffer/-/microbuffer-1.0.0.tgz#8b3832ed40c87d51f47bb234913a698a756d19d2"
+ integrity sha1-izgy7UDIfVH0e7I0kTppinVtGdI=
+
micromatch@^3.0.4, micromatch@^3.1.10, micromatch@^3.1.4:
version "3.1.10"
resolved "https://registry.yarnpkg.com/micromatch/-/micromatch-3.1.10.tgz#70859bc95c9840952f359a068a3fc49f9ecfac23"
@@ -6435,6 +6560,13 @@ natural-compare@^1.4.0:
resolved "https://registry.yarnpkg.com/natural-compare/-/natural-compare-1.4.0.tgz#4abebfeed7541f2c27acfb29bdbbd15c8d5ba4f7"
integrity sha1-Sr6/7tdUHywnrPspvbvRXI1bpPc=
+neatequal@^1.0.0:
+ version "1.0.0"
+ resolved "https://registry.yarnpkg.com/neatequal/-/neatequal-1.0.0.tgz#2ee1211bc9fa6e4c55715fd210bb05602eb1ae3b"
+ integrity sha1-LuEhG8n6bkxVcV/SELsFYC6xrjs=
+ dependencies:
+ varstream "^0.3.2"
+
needle@^2.2.1:
version "2.3.0"
resolved "https://registry.yarnpkg.com/needle/-/needle-2.3.0.tgz#ce3fea21197267bacb310705a7bbe24f2a3a3492"
@@ -6589,6 +6721,11 @@ normalize-path@^3.0.0, normalize-path@~3.0.0:
resolved "https://registry.yarnpkg.com/normalize-path/-/normalize-path-3.0.0.tgz#0dcd69ff23a1c9b11fd0978316644a0388216a65"
integrity sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==
+normalize-range@^0.1.2:
+ version "0.1.2"
+ resolved "https://registry.yarnpkg.com/normalize-range/-/normalize-range-0.1.2.tgz#2d10c06bdfd312ea9777695a4d28439456b75942"
+ integrity sha1-LRDAa9/TEuqXd2laTShDlFa3WUI=
+
normalize-url@2.0.1:
version "2.0.1"
resolved "https://registry.yarnpkg.com/normalize-url/-/normalize-url-2.0.1.tgz#835a9da1551fa26f70e92329069a23aa6574d7e6"
@@ -6660,6 +6797,11 @@ null-check@^1.0.0:
resolved "https://registry.yarnpkg.com/null-check/-/null-check-1.0.0.tgz#977dffd7176012b9ec30d2a39db5cf72a0439edd"
integrity sha1-l33/1xdgErnsMNKjnbXPcqBDnt0=
+num2fraction@^1.2.2:
+ version "1.2.2"
+ resolved "https://registry.yarnpkg.com/num2fraction/-/num2fraction-1.2.2.tgz#6f682b6a027a4e9ddfa4564cd2589d1d4e669ede"
+ integrity sha1-b2gragJ6Tp3fpFZM0lidHU5mnt4=
+
number-is-nan@^1.0.0:
version "1.0.1"
resolved "https://registry.yarnpkg.com/number-is-nan/-/number-is-nan-1.0.1.tgz#097b602b53422a522c1afb8790318336941a011d"
@@ -6918,7 +7060,7 @@ p-is-promise@^2.0.0:
resolved "https://registry.yarnpkg.com/p-is-promise/-/p-is-promise-2.1.0.tgz#918cebaea248a62cf7ffab8e3bca8c5f882fc42e"
integrity sha512-Y3W0wlRPK8ZMRbNq97l4M5otioeA5lm1z7bkNkxCka8HSPjR0xRWmpCmc9utiaLP9Jb1eD8BgeIxTW4AIF45Pg==
-p-limit@^2.0.0:
+p-limit@^2.0.0, p-limit@^2.2.0:
version "2.2.1"
resolved "https://registry.yarnpkg.com/p-limit/-/p-limit-2.2.1.tgz#aa07a788cc3151c939b5131f63570f0dd2009537"
integrity sha512-85Tk+90UCVWvbDavCLKPOLC9vvY8OwEX/RtKF+/1OADJMVlFfEHOiMTPVyxg7mk/dKa+ipdHm0OUkTvCpMTuwg==
@@ -6968,7 +7110,7 @@ p-try@^2.0.0:
resolved "https://registry.yarnpkg.com/p-try/-/p-try-2.2.0.tgz#cb2868540e313d61de58fafbe35ce9004d5540e6"
integrity sha512-R4nPAVTAU0B9D35/Gk3uJf/7XYbQcyohSKdvAxIRSNghFl4e71hVoGnBNQz9cWaXxO2I10KTC+3jMdvvoKw6dQ==
-pako@~1.0.5:
+pako@^1.0.0, pako@~1.0.5:
version "1.0.10"
resolved "https://registry.yarnpkg.com/pako/-/pako-1.0.10.tgz#4328badb5086a426aa90f541977d4955da5c9732"
integrity sha512-0DTvPVU3ed8+HNXOu5Bs+o//Mbdj9VNQMUOe9oKCwh8l0GNwpTDMKCWbRjgtD291AWnkAgkqA/LOnQS8AmS1tw==
@@ -7118,6 +7260,13 @@ path-type@^1.0.0:
pify "^2.0.0"
pinkie-promise "^2.0.0"
+path-type@^3.0.0:
+ version "3.0.0"
+ resolved "https://registry.yarnpkg.com/path-type/-/path-type-3.0.0.tgz#cef31dc8e0a1a3bb0d105c0cd97cf3bf47f4e36f"
+ integrity sha512-T2ZUsdZFHgA3u4e5PfPbjd7HDDpxPnQb5jN0SrDsjNSuVXHJqtwTnWqG0B1jZrgmJ/7lj1EmVIByWt1gxGkWvg==
+ dependencies:
+ pify "^3.0.0"
+
pbkdf2@^3.0.3:
version "3.0.17"
resolved "https://registry.yarnpkg.com/pbkdf2/-/pbkdf2-3.0.17.tgz#976c206530617b14ebb32114239f7b09336e93a6"
@@ -7276,6 +7425,24 @@ postcss-discard-overridden@^4.0.1:
dependencies:
postcss "^7.0.0"
+postcss-load-config@^2.0.0:
+ version "2.1.0"
+ resolved "https://registry.yarnpkg.com/postcss-load-config/-/postcss-load-config-2.1.0.tgz#c84d692b7bb7b41ddced94ee62e8ab31b417b003"
+ integrity sha512-4pV3JJVPLd5+RueiVVB+gFOAa7GWc25XQcMp86Zexzke69mKf6Nx9LRcQywdz7yZI9n1udOxmLuAwTBypypF8Q==
+ dependencies:
+ cosmiconfig "^5.0.0"
+ import-cwd "^2.0.0"
+
+postcss-loader@^3.0.0:
+ version "3.0.0"
+ resolved "https://registry.yarnpkg.com/postcss-loader/-/postcss-loader-3.0.0.tgz#6b97943e47c72d845fa9e03f273773d4e8dd6c2d"
+ integrity sha512-cLWoDEY5OwHcAjDnkyRQzAXfs2jrKjXpO/HQFcc5b5u/r7aa471wdmChmwfnv7x2u840iat/wi0lQ5nbRgSkUA==
+ dependencies:
+ loader-utils "^1.1.0"
+ postcss "^7.0.0"
+ postcss-load-config "^2.0.0"
+ schema-utils "^1.0.0"
+
postcss-merge-longhand@^4.0.11:
version "4.0.11"
resolved "https://registry.yarnpkg.com/postcss-merge-longhand/-/postcss-merge-longhand-4.0.11.tgz#62f49a13e4a0ee04e7b98f42bb16062ca2549e24"
@@ -7531,10 +7698,24 @@ postcss-value-parser@^3.0.0, postcss-value-parser@^3.3.0, postcss-value-parser@^
resolved "https://registry.yarnpkg.com/postcss-value-parser/-/postcss-value-parser-3.3.1.tgz#9ff822547e2893213cf1c30efa51ac5fd1ba8281"
integrity sha512-pISE66AbVkp4fDQ7VHBwRNXzAAKJjw4Vw7nWI/+Q3vuly7SNfgYXvm6i5IgFylHGK5sP/xHAbB7N49OS4gWNyQ==
-postcss@^7.0.0, postcss@^7.0.1, postcss@^7.0.14, postcss@^7.0.5, postcss@^7.0.6:
- version "7.0.20"
- resolved "https://registry.yarnpkg.com/postcss/-/postcss-7.0.20.tgz#a107b68ef1ad1c5e6e214ebb3c5ede2799322837"
- integrity sha512-VOdO3a5nHVftPSEbG1zaG320b4mH5KAflH+pIeVAF5/hlw6YumELSgHZQBekjg29Oj4qw7XAyp9tIEBpeNWcyg==
+postcss-value-parser@^4.0.2:
+ version "4.0.2"
+ resolved "https://registry.yarnpkg.com/postcss-value-parser/-/postcss-value-parser-4.0.2.tgz#482282c09a42706d1fc9a069b73f44ec08391dc9"
+ integrity sha512-LmeoohTpp/K4UiyQCwuGWlONxXamGzCMtFxLq4W1nZVGIQLYvMCJx3yAF9qyyuFpflABI9yVdtJAqbihOsCsJQ==
+
+postcss@6.0.23:
+ version "6.0.23"
+ resolved "https://registry.yarnpkg.com/postcss/-/postcss-6.0.23.tgz#61c82cc328ac60e677645f979054eb98bc0e3324"
+ integrity sha512-soOk1h6J3VMTZtVeVpv15/Hpdl2cBLX3CAw4TAbkpTJiNPk9YP/zWcD1ND+xEtvyuuvKzbxliTOIyvkSeSJ6ag==
+ dependencies:
+ chalk "^2.4.1"
+ source-map "^0.6.1"
+ supports-color "^5.4.0"
+
+postcss@^7.0.0, postcss@^7.0.1, postcss@^7.0.14, postcss@^7.0.18, postcss@^7.0.5, postcss@^7.0.6:
+ version "7.0.21"
+ resolved "https://registry.yarnpkg.com/postcss/-/postcss-7.0.21.tgz#06bb07824c19c2021c5d056d5b10c35b989f7e17"
+ integrity sha512-uIFtJElxJo29QC753JzhidoAhvp/e/Exezkdhfmt8AymWT6/5B7W1WmponYWkHk2eg6sONyTch0A3nkMPun3SQ==
dependencies:
chalk "^2.4.2"
source-map "^0.6.1"
@@ -7789,6 +7970,16 @@ read-pkg@^1.0.0:
string_decoder "~1.1.1"
util-deprecate "~1.0.1"
+readable-stream@^1.0.33:
+ version "1.1.14"
+ resolved "https://registry.yarnpkg.com/readable-stream/-/readable-stream-1.1.14.tgz#7cf4c54ef648e3813084c636dd2079e166c081d9"
+ integrity sha1-fPTFTvZI44EwhMY23SB54WbAgdk=
+ dependencies:
+ core-util-is "~1.0.0"
+ inherits "~2.0.1"
+ isarray "0.0.1"
+ string_decoder "~0.10.x"
+
readdirp@^2.2.1:
version "2.2.1"
resolved "https://registry.yarnpkg.com/readdirp/-/readdirp-2.2.1.tgz#0e87622a3325aa33e892285caf8b4e846529a525"
@@ -8371,6 +8562,11 @@ simple-swizzle@^0.2.2:
dependencies:
is-arrayish "^0.3.1"
+slash@^1.0.0:
+ version "1.0.0"
+ resolved "https://registry.yarnpkg.com/slash/-/slash-1.0.0.tgz#c41f2f6c39fc16d1cd17ad4b5d896114ae470d55"
+ integrity sha1-xB8vbDn8FtHNF61LXYlhFK5HDVU=
+
slice-ansi@^1.0.0:
version "1.0.0"
resolved "https://registry.yarnpkg.com/slice-ansi/-/slice-ansi-1.0.0.tgz#044f1a49d8842ff307aad6b505ed178bd950134d"
@@ -8765,6 +8961,16 @@ string-width@^3.0.0, string-width@^3.1.0:
is-fullwidth-code-point "^2.0.0"
strip-ansi "^5.1.0"
+string.fromcodepoint@^0.2.1:
+ version "0.2.1"
+ resolved "https://registry.yarnpkg.com/string.fromcodepoint/-/string.fromcodepoint-0.2.1.tgz#8d978333c0bc92538f50f383e4888f3e5619d653"
+ integrity sha1-jZeDM8C8klOPUPOD5IiPPlYZ1lM=
+
+string.prototype.codepointat@^0.2.0:
+ version "0.2.1"
+ resolved "https://registry.yarnpkg.com/string.prototype.codepointat/-/string.prototype.codepointat-0.2.1.tgz#004ad44c8afc727527b108cd462b4d971cd469bc"
+ integrity sha512-2cBVCj6I4IOvEnjgO/hWqXjqBGsY+zwPmHl12Srk9IXSZ56Jwwmy+66XO5Iut/oQVR7t5ihYdLB0GMa4alEUcg==
+
string.prototype.trimleft@^2.1.0:
version "2.1.0"
resolved "https://registry.yarnpkg.com/string.prototype.trimleft/-/string.prototype.trimleft-2.1.0.tgz#6cc47f0d7eb8d62b0f3701611715a3954591d634"
@@ -8788,6 +8994,11 @@ string_decoder@^1.0.0, string_decoder@^1.1.1:
dependencies:
safe-buffer "~5.2.0"
+string_decoder@~0.10.x:
+ version "0.10.31"
+ resolved "https://registry.yarnpkg.com/string_decoder/-/string_decoder-0.10.31.tgz#62e203bc41766c6c28c9fc84301dab1c5310fa94"
+ integrity sha1-YuIDvEF2bGwoyfyEMB2rHFMQ+pQ=
+
string_decoder@~1.1.1:
version "1.1.1"
resolved "https://registry.yarnpkg.com/string_decoder/-/string_decoder-1.1.1.tgz#9cf1611ba62685d7030ae9e4ba34149c3af03fc8"
@@ -8890,13 +9101,46 @@ supports-color@^2.0.0:
resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-2.0.0.tgz#535d045ce6b6363fa40117084629995e9df324c7"
integrity sha1-U10EXOa2Nj+kARcIRimZXp3zJMc=
-supports-color@^5.3.0:
+supports-color@^5.3.0, supports-color@^5.4.0:
version "5.5.0"
resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-5.5.0.tgz#e2e69a44ac8772f78a1ec0b35b689df6530efc8f"
integrity sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==
dependencies:
has-flag "^3.0.0"
+svg-pathdata@^5.0.0:
+ version "5.0.2"
+ resolved "https://registry.yarnpkg.com/svg-pathdata/-/svg-pathdata-5.0.2.tgz#e667b94a6071b60c5b123df04f9d6c9fe2f4850e"
+ integrity sha512-tmfwioGZZaSMZnAGCFiWd30O2sVbA5/wVP/CS8Pcf9s1ptd6J26bZUFwkIRZy+GYmD+uCECdiAP7bPpLszj+1w==
+
+svg2ttf@4.3.0:
+ version "4.3.0"
+ resolved "https://registry.yarnpkg.com/svg2ttf/-/svg2ttf-4.3.0.tgz#433440c7e9062f8fdcec3cad721cd08a2c7e51e3"
+ integrity sha512-LZ0B7zzHWLWbzLzwaKGHQvPOuxCXLReIb3LSxFSGUy1gMw2Utk6KGNbTmbmRL6Rk1qDSmTixnDrQgnXaL9n0CA==
+ dependencies:
+ argparse "^1.0.6"
+ cubic2quad "^1.0.0"
+ lodash "^4.17.10"
+ microbuffer "^1.0.0"
+ svgpath "^2.1.5"
+ xmldom "~0.1.22"
+
+svgicons2svgfont@9.1.1:
+ version "9.1.1"
+ resolved "https://registry.yarnpkg.com/svgicons2svgfont/-/svgicons2svgfont-9.1.1.tgz#655d30c256176f6e29c96058609ef0a9b0ebf2df"
+ integrity sha512-iOj7lqHP/oMrLg7S2Iv89LOJUfmIuePefXcs5ul4IsKwcYvL/T/Buahz+nQQJygyuvEMBBXqnCRmnvJggHeJzA==
+ dependencies:
+ commander "^2.12.2"
+ geometry-interfaces "^1.1.4"
+ glob "^7.1.2"
+ neatequal "^1.0.0"
+ readable-stream "^2.3.3"
+ sax "^1.2.4"
+ string.fromcodepoint "^0.2.1"
+ string.prototype.codepointat "^0.2.0"
+ svg-pathdata "^5.0.0"
+ transformation-matrix-js "^2.7.1"
+
svgo@^1.0.0, svgo@^1.0.5:
version "1.3.0"
resolved "https://registry.yarnpkg.com/svgo/-/svgo-1.3.0.tgz#bae51ba95ded9a33a36b7c46ce9c359ae9154313"
@@ -8916,6 +9160,11 @@ svgo@^1.0.0, svgo@^1.0.5:
unquote "~1.1.1"
util.promisify "~1.0.0"
+svgpath@^2.1.5:
+ version "2.2.2"
+ resolved "https://registry.yarnpkg.com/svgpath/-/svgpath-2.2.2.tgz#1c70d44e27f7b6bd42a74ed3c960be93e411def3"
+ integrity sha512-7cXFbkZvPkZpKLC+3QIfyUd3/Un/CvJONjTD3Gz5qLuEa73StPOt8kZjTi9apxO6zwCaza0bPNnmzTyrQ4qQlw==
+
syntax-error@^1.1.1:
version "1.4.0"
resolved "https://registry.yarnpkg.com/syntax-error/-/syntax-error-1.4.0.tgz#2d9d4ff5c064acb711594a3e3b95054ad51d907c"
@@ -9205,6 +9454,11 @@ tough-cookie@~2.4.3:
psl "^1.1.24"
punycode "^1.4.1"
+transformation-matrix-js@^2.7.1:
+ version "2.7.6"
+ resolved "https://registry.yarnpkg.com/transformation-matrix-js/-/transformation-matrix-js-2.7.6.tgz#25c7ff055c99b8528ffbd4c4a2684be6c9d5ef60"
+ integrity sha512-1CxDIZmCQ3vA0GGnkdMQqxUXVm3xXAFmglPYRS1hr37LzSg22TC7QAWOT38OmdUvMEs/rqcnkFoAsqvzdiluDg==
+
trim-newlines@^1.0.0:
version "1.0.0"
resolved "https://registry.yarnpkg.com/trim-newlines/-/trim-newlines-1.0.0.tgz#5887966bb582a4503a41eb524f7d35011815a613"
@@ -9234,6 +9488,15 @@ tslib@^1.9.0:
resolved "https://registry.yarnpkg.com/tslib/-/tslib-1.10.0.tgz#c3c19f95973fb0a62973fb09d90d961ee43e5c8a"
integrity sha512-qOebF53frne81cf0S9B41ByenJ3/IuH8yJKngAX35CmiZySA0khhkovshKK+jGCaMnVomla7gVlIcc3EvKPbTQ==
+ttf2woff@2.0.1:
+ version "2.0.1"
+ resolved "https://registry.yarnpkg.com/ttf2woff/-/ttf2woff-2.0.1.tgz#871832240024b09db9570904c7c1928b8057c969"
+ integrity sha1-hxgyJAAksJ25VwkEx8GSi4BXyWk=
+ dependencies:
+ argparse "^1.0.6"
+ microbuffer "^1.0.0"
+ pako "^1.0.0"
+
tty-browserify@0.0.0:
version "0.0.0"
resolved "https://registry.yarnpkg.com/tty-browserify/-/tty-browserify-0.0.0.tgz#a157ba402da24e9bf957f9aa69d524eed42901a6"
@@ -9554,6 +9817,13 @@ value-or-function@^3.0.0:
resolved "https://registry.yarnpkg.com/value-or-function/-/value-or-function-3.0.0.tgz#1c243a50b595c1be54a754bfece8563b9ff8d813"
integrity sha1-HCQ6ULWVwb5Up1S/7OhWO5/42BM=
+varstream@^0.3.2:
+ version "0.3.2"
+ resolved "https://registry.yarnpkg.com/varstream/-/varstream-0.3.2.tgz#18ac6494765f3ff1a35ad9a4be053bec188a5de1"
+ integrity sha1-GKxklHZfP/GjWtmkvgU77BiKXeE=
+ dependencies:
+ readable-stream "^1.0.33"
+
vary@~1.1.2:
version "1.1.2"
resolved "https://registry.yarnpkg.com/vary/-/vary-1.1.2.tgz#2299f02c6ded30d4a5961b0b9f74524a18f634fc"
@@ -9870,6 +10140,11 @@ xmlbuilder@^10.0.0:
resolved "https://registry.yarnpkg.com/xmlbuilder/-/xmlbuilder-10.1.1.tgz#8cae6688cc9b38d850b7c8d3c0a4161dcaf475b0"
integrity sha512-OyzrcFLL/nb6fMGHbiRDuPup9ljBycsdCypwuyg5AAHvyWzGfChJpCXMG88AGTIMFhGZ9RccFN1e6lhg3hkwKg==
+xmldom@~0.1.22:
+ version "0.1.27"
+ resolved "https://registry.yarnpkg.com/xmldom/-/xmldom-0.1.27.tgz#d501f97b3bdb403af8ef9ecc20573187aadac0e9"
+ integrity sha1-1QH5ezvbQDr4757MIFcxh6rawOk=
+
xmlhttprequest-ssl@~1.5.4:
version "1.5.5"
resolved "https://registry.yarnpkg.com/xmlhttprequest-ssl/-/xmlhttprequest-ssl-1.5.5.tgz#c2876b06168aadc40e57d97e81191ac8f4398b3e"