public inbox for [email protected]
help / color / mirror / Atom feedFrom: Aditya Toshniwal <[email protected]>
To: pgadmin-hackers <[email protected]>
Subject: [pgAdmin][RM5128] [Accessibility] Revisit color contrast to meet the standards
Date: Mon, 23 Mar 2020 17:46:12 +0530
Message-ID: <CAM9w-_nsVHY_VN7VVFTunGHuP0DMYNpzFAmjhLHXNkgoN3bhrw@mail.gmail.com> (raw)
Hi Hackers,
Attached is a small patch to change certain colors and opacity in pgAdmin
in order to comply with WCAG color contrast standards.
Please review.
--
Thanks and Regards,
Aditya Toshniwal
pgAdmin Hacker | Sr. Software Engineer | EnterpriseDB India | Pune
"Don't Complain about Heat, Plant a TREE"
Attachments:
[application/octet-stream] RM5128.patch (2.6K, 3-RM5128.patch)
download | inline diff:
diff --git a/web/pgadmin/static/scss/resources/_default.variables.scss b/web/pgadmin/static/scss/resources/_default.variables.scss
index 9fe30cb9e..3cbac83db 100644
--- a/web/pgadmin/static/scss/resources/_default.variables.scss
+++ b/web/pgadmin/static/scss/resources/_default.variables.scss
@@ -23,7 +23,7 @@ $color-danger-fg: $white !default;
$color-danger-light: #F39999 !default;
$color-danger-lighter: #FAECEC !default;
-$color-success: #43a047 !default;
+$color-success: #26852B !default;
$color-success-fg: $black !default;
$color-success-light: #D9ECDA !default;
@@ -60,7 +60,7 @@ $text-height-calc: $line-height-base*$font-size-base/1rem;
$grid-gutter-width: 15px;
$border-radius: 0.25rem;
-$text-muted: $color-gray-dark !default;
+$text-muted: #667185 !default;
$header-bg: $color-bg !default;
$tree-font-size: 0.815rem;
@@ -101,7 +101,7 @@ $popover-border-color: $dropdown-border-color;
$popover-box-shadow: $dropdown-box-shadow;
$input-btn-focus-width: 0.1rem;
-$btn-disabled-opacity: 0.5;
+$btn-disabled-opacity: 0.65;
$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;
$card-spacer-y: 0rem;
@@ -218,7 +218,7 @@ $sql-title-bg: $color-ternary;
$sql-title-fg: $color-ternary-fg;
// Toolbar + editor title heights + title bottom border
$sql-editor-panel-top: $title-height + $text-height-calc*16px + $sql-title-padding*2 + $panel-border-width - 0.5px;
-$sql-gutters-bg: $negative-bg;
+$sql-gutters-bg: $datagrid-bg;
$sql-history-detail-bg: $color-gray-lighter;
$sql-history-success-bg: $color-primary-light;
$sql-history-success-fg: $active-color;
diff --git a/web/pgadmin/static/scss/resources/dark/_theme.variables.scss b/web/pgadmin/static/scss/resources/dark/_theme.variables.scss
index 872fe6f62..21d5b4a14 100644
--- a/web/pgadmin/static/scss/resources/dark/_theme.variables.scss
+++ b/web/pgadmin/static/scss/resources/dark/_theme.variables.scss
@@ -6,7 +6,7 @@ $color-fg: #d4d4d4;
$color-primary: #234d6e;
$color-primary-fg: $color-fg;
-$color-primary-light: #536270;
+$color-primary-light: #323E43;
$color-primary-light-fg: $color-primary-fg;
$color-primary-dark: #15354f;
@@ -17,7 +17,7 @@ $color-danger-fg: $white;
$color-danger-light: #914649;
$color-danger-lighter: #212121;
-$color-success: #43a047;
+$color-success: #26852B;
$color-success-fg: $black;
$color-success-light: #2B472C;
@@ -35,7 +35,7 @@ $color-brand: #1b71b5;
$border-color: #4a4a4a;
$shadow-base-color: #111111;
-$text-muted: #6b6b6b;
+$text-muted: #8A8A8A;
$input-bg: $color-bg;
$input-color: $color-fg;
$input-border-color: #6b6b6b;
view thread (2+ messages) latest in thread
reply
Reply instructions:
You may reply publicly to this message via plain-text email
using any one of the following methods:
* Reply to all the recipients using the --to and --cc options:
reply via email
To: [email protected]
Cc: [email protected]
Subject: Re: [pgAdmin][RM5128] [Accessibility] Revisit color contrast to meet the standards
In-Reply-To: <CAM9w-_nsVHY_VN7VVFTunGHuP0DMYNpzFAmjhLHXNkgoN3bhrw@mail.gmail.com>
* Save the following mbox file, import it into your mail client,
and reply-to-all from there: mbox
This inbox is served by agora; see mirroring instructions
for how to clone and mirror all data and code used for this inbox