Received: from malur.postgresql.org ([217.196.149.56]) by arkaria.postgresql.org with esmtps (TLS1.2:ECDHE_RSA_AES_256_CBC_SHA1:256) (Exim 4.89) (envelope-from ) id 1gaLQe-0000vp-PE for pgadmin-hackers@arkaria.postgresql.org; Fri, 21 Dec 2018 14:05:29 +0000 Received: from localhost ([127.0.0.1] helo=malur.postgresql.org) by malur.postgresql.org with esmtp (Exim 4.89) (envelope-from ) id 1gaLQd-0008PX-96 for pgadmin-hackers@arkaria.postgresql.org; Fri, 21 Dec 2018 14:05:27 +0000 Received: from magus.postgresql.org ([2a02:c0:301:0:ffff::29]) by malur.postgresql.org with esmtps (TLS1.2:ECDHE_RSA_AES_256_CBC_SHA1:256) (Exim 4.89) (envelope-from ) id 1gaLQd-0008PG-25 for pgadmin-hackers@lists.postgresql.org; Fri, 21 Dec 2018 14:05:27 +0000 Received: from mail-wm1-x334.google.com ([2a00:1450:4864:20::334]) by magus.postgresql.org with esmtps (TLS1.2:ECDHE_RSA_AES_256_CBC_SHA1:256) (Exim 4.89) (envelope-from ) id 1gaLQZ-0000td-GR for pgadmin-hackers@lists.postgresql.org; Fri, 21 Dec 2018 14:05:26 +0000 Received: by mail-wm1-x334.google.com with SMTP id y139so5386698wmc.5 for ; Fri, 21 Dec 2018 06:05:22 -0800 (PST) DKIM-Signature: v=1; a=rsa-sha256; c=relaxed/relaxed; d=pgadmin-org.20150623.gappssmtp.com; s=20150623; h=mime-version:references:in-reply-to:from:date:message-id:subject:to :cc; bh=q4sBeI5bZ2J6MSGmReRATUpaPwk+fOVo1ktMhPlr984=; b=EiM6FsGIRj0612nE7SItAACLjLWMGiGeEw+L8EReFoCGg6KGcG59GsLJQYcTP0sYki 98YpAvJzmsQstR/aOHOtCMrCRiy3ASCXArgJjZkjd4G5YNhHLQaLA8I1wuUyVf+kAPKR /XW+3NNs7r80I4+KIA/naJRMS/H6gxDRnRpqbK6R9OgJGiquoONZ/UdEsuemahD2n77t UkpA7kxkcp9Q2eJE6y27ePsvyDMhARJ5Fk9JuzTn+85Wc6Ewoy9rk0DoKZxvBQXbS47u aVPZsaBCDxuBDrm4z2FIgFbA+xzj50RU3BhPpH2u5WX7BRii+Le/Pz6gAVwolLxgxVoQ /uVw== X-Google-DKIM-Signature: v=1; a=rsa-sha256; c=relaxed/relaxed; d=1e100.net; s=20161025; h=x-gm-message-state:mime-version:references:in-reply-to:from:date :message-id:subject:to:cc; bh=q4sBeI5bZ2J6MSGmReRATUpaPwk+fOVo1ktMhPlr984=; b=DK3HXNCBvCo6iGw+cBpG3JWyQmy8goAcy6fLWI8MXgvpuYzW+T+cGCOAcShgpkxaSc Mo8/af5dA5NWhI7Vt4EwUozr1z5M7IxjZ4vvfD8Wd0IkbE/kOQc5f+W4DYWlA4sXKDIb r+tU3G/3u9Lfhj656rbXbAspiHr5r5l8tpFrspzlVecvGH/+ZnNsmZUliQNtDeS1+S+k wyx3VKmMesVFlW4Mp2nAYTmK1gcrswrYwWb9FaKwDKfa60M9BeXuKQMbYiZAjtkvNoSZ DDpkTKdB92f8rCyZapMPcu2rNLdqRr2mWstvkwvSb86jSwtNwozDYFms6gHcAKZ/NpLc QuZw== X-Gm-Message-State: AJcUukebtaN0eyaF8/t/9uxbnt1vqga/ra4LU6xz7/DQU8+nYOpOs1Ij +y0oDEIQ/uiRg9jg9K6jn6RuYGPst/0WCTtZNfP4iQ== X-Google-Smtp-Source: AFSGD/U33dvHfXYv5nVguzddO6ImzYKik8vL1Mk28PwpogIoyWd4su3AeYiiLZcXDFOxLP1fvtVcf97wjHroLFPorpc= X-Received: by 2002:a1c:bb04:: with SMTP id l4mr3018344wmf.142.1545401121723; Fri, 21 Dec 2018 06:05:21 -0800 (PST) MIME-Version: 1.0 References: In-Reply-To: From: Dave Page Date: Fri, 21 Dec 2018 14:05:10 +0000 Message-ID: Subject: Re: pgAdmin 4 commit: Improvement in the look and feel of the whole applica To: Aditya Toshniwal Cc: Ashesh Vashi , pgadmin-hackers , Akshay Joshi , Chethana Kumar , Khushboo Vashi Content-Type: text/plain; charset="UTF-8" List-Id: List-Help: List-Subscribe: List-Post: List-Owner: List-Archive: Precedence: bulk On Fri, Dec 21, 2018 at 2:02 PM Aditya Toshniwal wrote: > > > > On Fri, Dec 21, 2018 at 7:29 PM Dave Page wrote: >> >> One other issue: I'm seeing that standard sized dialogues (e.g. the >> Server or Database Properties dialogues) are wrapping their labels and >> controls at the default size. That should not be the case. > > Yep. Akshay has logged that in the sheet shared (https://drive.google.com/open?id=127BgrvdVUvWSEp-GnQvCDx1WaaemsycxSD0aUpWxb6k). OK, but the answer isn't to increase the size of the dialogues as suggested. The size is fine (though we should review for consistency, and ensure we are using no more than 3 default standard sizes throughout the app); we should make the controls display nicely on the default dialogue size and wrap if the user makes it smaller than we can display in. >> On Fri, Dec 21, 2018 at 12:46 PM Dave Page wrote: >> > >> > Hi >> > >> > On Fri, Dec 21, 2018 at 12:29 PM Aditya Toshniwal >> > wrote: >> > > >> > > Hi Dave, >> > > >> > > On Fri, Dec 21, 2018 at 5:51 PM Dave Page wrote: >> > >> >> > >> Nice! Thanks Ashesh. >> > >> >> > >> Some small issues I spotted: >> > >> >> > >> - The font looks somewhat small. How does it compare in size to, say, >> > >> Gmail? I think it needs to be increased to at least that size. >> > > >> > > Gmail uses 0.875rem (14px) for the left panel (Inbox, Sent). We are using 0.875rem (14px) for main navbar links and 0.815rem(13.04px) for all other text. >> > >> > Let's increase the default to 0.875, and make the main links >> > proportionally bigger. >> > >> > >> - Dialogues have 2 close buttons next to each other in the top-right. >> > >> Looks like an icon and a text version? >> > > >> > > You need to do a yarn install. wcDocker code is changed to fix that. >> > >> > Yup, that fixed it. >> > >> > >> - Why do some Preferences panels use alternate line colouring, whilst >> > >> others don't? I suspect it's because some are actually tables under >> > >> the hood? I think we need consistency there. >> > > >> > > Noted. >> > >> >> > >> >> > >> - The Maintenance dialogue looks terrible - it needs to be made much >> > >> more compact. I also seem to be getting a failure to create >> > >> maintenance jobs (backups etc work fine). >> > > >> > > Noted. >> > >> >> > >> >> > >> - I think the buttons on the Browser need borders to match other buttons. >> > > >> > > It is made consistent with other wcDocker buttons like close, right arrow, left arrow. However, we can make it look like other buttons. >> > >> > I think they're a different class of buttons - control/navigation vs. >> > function. I think we should make this change as the browser buttons >> > really are a toolbar just like the larger on on the query tool. >> > >> > Thanks! >> > >> > >> Thanks! >> > >> >> > >> On Fri, Dec 21, 2018 at 12:01 PM Ashesh Vashi >> > >> wrote: >> > >> > >> > >> > Improvement in the look and feel of the whole application >> > >> > >> > >> > Changed the SCSS/CSS for the below third party libraries to adopt the >> > >> > new look 'n' feel: >> > >> > - wcDocker >> > >> > - Alertify dialogs, and notifications >> > >> > - AciTree >> > >> > - Bootstrap Navbar >> > >> > - Bootstrap Tabs >> > >> > - Bootstrap Drop-Down menu >> > >> > - Backgrid >> > >> > - Select2 >> > >> > >> > >> > Adopated the new the look 'n' feel for the dialogs, wizard, properties, >> > >> > tab panels, tabs, fieldset, subnode control, spinner control, HTML >> > >> > table, and other form controls. >> > >> > >> > >> > - Font is changed to Roboto >> > >> > - Using SCSS variables to define the look 'n' feel >> > >> > - Designer background images for the Login, and Forget password pages in >> > >> > 'web' mode >> > >> > - Improved the look 'n' feel for the key selection in the preferences >> > >> > dialog >> > >> > - Table classes consistency changes across the application >> > >> > - File Open and Save dialog list view changes >> > >> > >> > >> > Author(s): Aditya Toshniwal & Khushboo Vashi >> > >> > >> > >> > Branch >> > >> > ------ >> > >> > master >> > >> > >> > >> > Details >> > >> > ------- >> > >> > https://git.postgresql.org/gitweb?p=pgadmin4.git;a=commitdiff;h=5799ac14ba17dc25fbec184b3b2c6afbe37f1f74 >> > >> > >> > >> > Modified Files >> > >> > -------------- >> > >> > web/package.json | 2 +- >> > >> > .../static/js/fts_configuration.js | 2 +- >> > >> > .../databases/schemas/functions/__init__.py | 4 +- >> > >> > .../function => static}/css/function.css | 0 >> > >> > .../templates/trigger_function/css/function.css | 3 - >> > >> > .../{templates/edbfunc => static}/css/edbfunc.css | 0 >> > >> > .../static/js/exclusion_constraint.js | 18 +- >> > >> > .../foreign_key/static/js/foreign_key.js | 17 +- >> > >> > .../schemas/tables/rules/static/css/rule.css | 7 + >> > >> > .../tables/rules/templates/rules/css/rule.css | 8 - >> > >> > .../databases/schemas/views/static/css/view.css | 7 + >> > >> > .../schemas/views/templates/mview/css/mview.css | 4 - >> > >> > .../schemas/views/templates/view/css/view.css | 4 - >> > >> > .../pgagent/schedules/static/js/pga_schedule.js | 3 +- >> > >> > .../servers/pgagent/static/css/pga_job.css | 3 + >> > >> > .../pgagent/templates/pga_job/css/pga_job.css | 13 - >> > >> > .../server_groups/servers/static/css/servers.css | 4 + >> > >> > .../server_groups/servers/static/js/server.js | 22 +- >> > >> > .../server_groups/servers/static/js/variable.js | 4 +- >> > >> > .../servers/tablespaces/static/js/tablespace.js | 13 +- >> > >> > .../servers/templates/css/servers.css | 4 - >> > >> > web/pgadmin/browser/static/css/browser.css | 13 - >> > >> > web/pgadmin/browser/static/css/wizard.css | 21 +- >> > >> > web/pgadmin/browser/static/js/browser.js | 26 +- >> > >> > web/pgadmin/browser/static/js/collection.js | 16 +- >> > >> > web/pgadmin/browser/static/js/keyboard.js | 14 +- >> > >> > web/pgadmin/browser/static/js/menu.js | 28 +- >> > >> > web/pgadmin/browser/static/js/node.js | 53 +- >> > >> > web/pgadmin/browser/static/js/node.ui.js | 4 +- >> > >> > web/pgadmin/browser/static/js/panel.js | 15 +- >> > >> > web/pgadmin/browser/static/js/toolbar.js | 3 - >> > >> > web/pgadmin/browser/static/js/wizard.js | 58 +- >> > >> > web/pgadmin/browser/static/scss/_browser.scss | 43 +- >> > >> > web/pgadmin/browser/static/scss/_wizard.scss | 41 +- >> > >> > web/pgadmin/browser/templates/browser/css/node.css | 2 +- >> > >> > web/pgadmin/browser/templates/browser/index.html | 9 +- >> > >> > web/pgadmin/dashboard/__init__.py | 2 +- >> > >> > web/pgadmin/dashboard/static/css/dashboard.css | 21 +- >> > >> > web/pgadmin/dashboard/static/js/dashboard.js | 120 +- >> > >> > web/pgadmin/dashboard/static/scss/_dashboard.scss | 44 +- >> > >> > .../templates/dashboard/database_dashboard.html | 171 ++- >> > >> > .../templates/dashboard/server_dashboard.html | 197 ++- >> > >> > .../templates/dashboard/welcome_dashboard.html | 30 +- >> > >> > web/pgadmin/feature_tests/browser_tool_bar_test.py | 23 +- >> > >> > web/pgadmin/feature_tests/file_manager_test.py | 23 +- >> > >> > .../feature_tests/keyboard_shortcut_test.py | 5 +- >> > >> > .../feature_tests/pg_datatype_validation_test.py | 5 +- >> > >> > .../pg_utilities_backup_restore_test.py | 28 +- >> > >> > .../feature_tests/pg_utilities_maintenance_test.py | 16 +- >> > >> > .../feature_tests/query_tool_journey_test.py | 5 +- >> > >> > web/pgadmin/feature_tests/query_tool_tests.py | 117 +- >> > >> > web/pgadmin/feature_tests/view_data_dml_queries.py | 16 +- >> > >> > .../misc/bgprocess/static/css/bgprocess.css | 11 - >> > >> > web/pgadmin/misc/bgprocess/static/js/bgprocess.js | 173 ++- >> > >> > .../misc/bgprocess/static/scss/_bgprocess.scss | 81 +- >> > >> > web/pgadmin/misc/depends/static/js/depends.js | 3 +- >> > >> > .../misc/file_manager/static/css/file_manager.css | 141 +- >> > >> > .../misc/file_manager/static/js/create_dialogue.js | 9 +- >> > >> > .../misc/file_manager/static/js/select_dialogue.js | 19 +- >> > >> > web/pgadmin/misc/file_manager/static/js/utility.js | 77 +- >> > >> > .../file_manager/static/scss/_file_manager.scss | 157 +-- >> > >> > .../file_manager/templates/file_manager/index.html | 95 +- >> > >> > .../misc/statistics/static/js/statistics.js | 3 +- >> > >> > web/pgadmin/preferences/static/css/preferences.css | 14 - >> > >> > web/pgadmin/preferences/static/js/preferences.js | 31 +- >> > >> > .../preferences/static/scss/_preferences.scss | 16 + >> > >> > web/pgadmin/static/css/pgadmin.css | 81 +- >> > >> > web/pgadmin/static/fonts/Roboto-Bold.ttf | Bin 0 -> 170760 bytes >> > >> > web/pgadmin/static/fonts/Roboto-Medium.ttf | Bin 0 -> 172064 bytes >> > >> > web/pgadmin/static/fonts/Roboto-Regular.ttf | Bin 0 -> 171676 bytes >> > >> > web/pgadmin/static/img/collapse_expand.svg | 15 + >> > >> > web/pgadmin/static/img/forgot_password.svg | 283 ++++ >> > >> > web/pgadmin/static/img/login.svg | 1 + >> > >> > web/pgadmin/static/js/alertify.pgadmin.defaults.js | 82 +- >> > >> > web/pgadmin/static/js/backform.pgadmin.js | 80 +- >> > >> > web/pgadmin/static/js/backgrid.pgadmin.js | 33 +- >> > >> > web/pgadmin/static/js/slickgrid/editors.js | 8 +- >> > >> > web/pgadmin/static/js/sqleditor/filter_dialog.js | 33 +- >> > >> > .../static/js/sqleditor/query_tool_preferences.js | 15 +- >> > >> > web/pgadmin/static/scss/_aci_tree.overrides.scss | 75 +- >> > >> > web/pgadmin/static/scss/_alert.scss | 12 +- >> > >> > web/pgadmin/static/scss/_alertify.overrides.scss | 150 +- >> > >> > web/pgadmin/static/scss/_backform.overrides.scss | 8 + >> > >> > web/pgadmin/static/scss/_backgrid.overrides.scss | 251 +++- >> > >> > web/pgadmin/static/scss/_bootstrap.overrides.scss | 230 ++-- >> > >> > web/pgadmin/static/scss/_codemirror.overrides.scss | 94 +- >> > >> > web/pgadmin/static/scss/_pgadmin.grid.scss | 56 + >> > >> > web/pgadmin/static/scss/_pgadmin.style.scss | 1440 +++++--------------- >> > >> > web/pgadmin/static/scss/_select2.overrides.scss | 24 +- >> > >> > web/pgadmin/static/scss/_webcabin.overrides.scss | 368 ----- >> > >> > web/pgadmin/static/scss/_webcabin.pgadmin.scss | 250 ++++ >> > >> > web/pgadmin/static/scss/pgadmin.scss | 10 +- >> > >> > .../static/scss/resources/_default.style.scss | 90 +- >> > >> > .../static/scss/resources/_default.variables.scss | 203 ++- >> > >> > web/pgadmin/static/vendor/backform/backform.js | 645 +++++++++ >> > >> > .../templates/security/change_password.html | 43 +- >> > >> > .../templates/security/forgot_password.html | 9 +- >> > >> > web/pgadmin/templates/security/login_user.html | 16 +- >> > >> > web/pgadmin/templates/security/panel.html | 23 +- >> > >> > web/pgadmin/tools/backup/__init__.py | 6 +- >> > >> > web/pgadmin/tools/backup/static/js/backup.js | 8 +- >> > >> > .../backup/static/js/backup_dialog_wrapper.js | 22 +- >> > >> > web/pgadmin/tools/datagrid/__init__.py | 1 - >> > >> > web/pgadmin/tools/datagrid/static/js/datagrid.js | 38 +- >> > >> > .../tools/datagrid/templates/datagrid/filter.html | 2 - >> > >> > .../tools/datagrid/templates/datagrid/index.html | 193 ++- >> > >> > web/pgadmin/tools/debugger/static/css/debugger.css | 34 +- >> > >> > web/pgadmin/tools/debugger/static/js/debugger.js | 2 +- >> > >> > .../tools/debugger/static/js/debugger_ui.js | 28 +- >> > >> > web/pgadmin/tools/debugger/static/js/direct.js | 13 +- >> > >> > .../tools/debugger/static/scss/_debugger.scss | 8 - >> > >> > .../tools/debugger/templates/debugger/direct.html | 89 +- >> > >> > .../tools/grant_wizard/static/js/grant_wizard.js | 27 +- >> > >> > .../grant_wizard/static/scss/_grant_wizard.scss | 31 +- >> > >> > .../tools/import_export/static/js/import_export.js | 24 +- >> > >> > web/pgadmin/tools/maintenance/__init__.py | 10 +- >> > >> > .../tools/maintenance/static/js/maintenance.js | 24 +- >> > >> > .../maintenance/static/scss/_maintenance.scss | 2 +- >> > >> > web/pgadmin/tools/restore/__init__.py | 14 +- >> > >> > web/pgadmin/tools/restore/static/js/restore.js | 8 +- >> > >> > .../restore/static/js/restore_dialog_wrapper.js | 24 +- >> > >> > .../tools/sqleditor/static/css/sqleditor.css | 128 +- >> > >> > web/pgadmin/tools/sqleditor/static/js/sqleditor.js | 35 +- >> > >> > .../tools/sqleditor/static/scss/_history.scss | 42 +- >> > >> > .../tools/sqleditor/static/scss/_sqleditor.scss | 128 +- >> > >> > .../user_management/static/css/user_management.css | 37 - >> > >> > .../user_management/static/js/user_management.js | 53 +- >> > >> > .../static/scss/_user_management.scss | 12 +- >> > >> > .../javascript/alerts/alertify_wrapper_spec.js | 4 +- >> > >> > .../backup/backup_dialog_wrapper_spec.js | 8 +- >> > >> > .../restore/restore_dialog_wrapper_spec.js | 8 +- >> > >> > web/webpack.config.js | 2 +- >> > >> > web/webpack.shim.js | 2 +- >> > >> > web/webpack.test.config.js | 1 + >> > >> > web/yarn.lock | 1015 +++++++++++++- >> > >> > 135 files changed, 5002 insertions(+), 3850 deletions(-) >> > >> > >> > >> >> > >> >> > >> -- >> > >> Dave Page >> > >> Blog: http://pgsnake.blogspot.com >> > >> Twitter: @pgsnake >> > >> >> > >> EnterpriseDB UK: http://www.enterprisedb.com >> > >> The Enterprise PostgreSQL Company >> > > >> > > >> > > >> > > -- >> > > Thanks and Regards, >> > > Aditya Toshniwal >> > > Software Engineer | EnterpriseDB Software Solutions | Pune >> > > "Don't Complain about Heat, Plant a tree" >> > >> > >> > >> > -- >> > Dave Page >> > Blog: http://pgsnake.blogspot.com >> > Twitter: @pgsnake >> > >> > EnterpriseDB UK: http://www.enterprisedb.com >> > The Enterprise PostgreSQL Company >> >> >> >> -- >> Dave Page >> Blog: http://pgsnake.blogspot.com >> Twitter: @pgsnake >> >> EnterpriseDB UK: http://www.enterprisedb.com >> The Enterprise PostgreSQL Company > > > > -- > Thanks and Regards, > Aditya Toshniwal > Software Engineer | EnterpriseDB Software Solutions | Pune > "Don't Complain about Heat, Plant a tree" -- Dave Page Blog: http://pgsnake.blogspot.com Twitter: @pgsnake EnterpriseDB UK: http://www.enterprisedb.com The Enterprise PostgreSQL Company