public inbox for [email protected]help / color / mirror / Atom feed
[pgAdmin4][Patch] - RM #6847 - High Contrast theme hover issue 3+ messages / 2 participants [nested] [flat]
* [pgAdmin4][Patch] - RM #6847 - High Contrast theme hover issue @ 2021-10-04 06:06 Khushboo Vashi <[email protected]> 0 siblings, 1 reply; 3+ messages in thread From: Khushboo Vashi @ 2021-10-04 06:06 UTC (permalink / raw) To: pgadmin-hackers Hi, Please find the attached patch to fix the RM #6847 - [UI-Tree view][High Contrast theme]: Hover on any node its label is not visible. Thanks, Khushboo Attachments: [application/octet-stream] RM_6847.patch (5.9K, 3-RM_6847.patch) download | inline diff: diff --git a/web/pgadmin/static/scss/_pgadmin4-tree.overrides.scss b/web/pgadmin/static/scss/_pgadmin4-tree.overrides.scss index 99a68dec1..b4348c867 100644 --- a/web/pgadmin/static/scss/_pgadmin4-tree.overrides.scss +++ b/web/pgadmin/static/scss/_pgadmin4-tree.overrides.scss @@ -12,114 +12,117 @@ .file-tree > { div { - position: absolute !important; - height: 100% !important; - top: 0px !important; - } + position: absolute !important; + height: 100% !important; + top: 0px !important; + } } .file-entry { + font: inherit; + text-align: left; + display: flex; + align-items: center; + white-space: nowrap; + padding: 2px 0; + padding-left: 2px; + cursor: pointer !important; color: $tree-text-fg !important; - span.file-name { - color: $tree-text-fg !important; - white-space: nowrap; - } &:hover, &.pseudo-active { background-color: $tree-bg-hover !important; + color: $tree-fg-hover !important; } -} - -.file-entry -{ - font: inherit; - text-align: left; - display: flex; - align-items: center; - white-space: nowrap; - padding: 2px 0; - padding-left: 2px; - cursor: pointer !important; - &:hover, &.pseudo-active { - background-color: $tree-bg-hover !important; - } - &.active, &.prompt { - background-color: $tree-bg-selected !important; - border-color: $color-primary-light; - border-right: $active-border !important; + &.active, &.prompt { + background-color: $tree-bg-selected !important; + border-color: $color-primary-light; + border-right: $active-border !important; + color: $tree-text-hover-fg !important; + span.file-label { + span.file-name { + color: $tree-text-hover-fg !important; + } } - i { + } + i { + display: inline-block; + font: normal normal normal 18px/1 "default-icons"; + font-size: 18px; + text-align: center; + height: 21px !important; + width: 20px !important; + &:before { + height: inherit; + width: inherit; display: inline-block; - font: normal normal normal 18px/1 "default-icons"; - font-size: 18px; - text-align: center; - height: 21px !important; - width: 20px !important; - &:before { - height: inherit; - width: inherit; - display: inline-block; - } - &.directory-toggle { - &:before { - background-position: 6px center !important; - font-family: $font-family-icon; - content: "\f054" !important; - border-style: none; - margin-left: 5px; - font-weight: 900; - right: 15px; - top: 3px; - font-size: 0.6rem; - line-height: 2; - } - &.open:before { - background-position: -14px center !important; - font-family: $font-family-icon; - content: "\f078" !important; - border-style: none; - margin-left: 5px; - font-weight: 900; - transform: none !important; - } - &.loading:before { - background-position: 6px center !important; - font-weight: 900; - font-size: 0.6rem; - line-height: 2; - content: '' !important; - font-family: $font-family-icon; - margin-left: 5px; - border-style: none; - background: $loader-icon-small 0 0 no-repeat; - } - } } - span.file-label { - display: flex; - align-items: center; - padding:0 2px 0 2px; - border:1px solid transparent; - height:auto; - white-space:normal; - cursor:pointer !important; - margin-right:24px; - margin-left: 2px; + &.directory-toggle { + &:before { + background-position: 6px center !important; + font-family: $font-family-icon; + content: "\f054" !important; + border-style: none; + margin-left: 5px; + font-weight: 900; + right: 15px; + top: 3px; + font-size: 0.6rem; + line-height: 2; + } + &.open:before { + background-position: -14px center !important; + font-family: $font-family-icon; + content: "\f078" !important; + border-style: none; + margin-left: 5px; + font-weight: 900; + transform: none !important; + } + &.loading:before { + background-position: 6px center !important; + font-weight: 900; + font-size: 0.6rem; + line-height: 2; + content: '' !important; + font-family: $font-family-icon; + margin-left: 5px; + border-style: none; + background: $loader-icon-small 0 0 no-repeat; + } } - &.prompt.new .file-label, &.file .file-label { - margin-left: 18px; + } + span.file-label { + display: flex; + align-items: center; + padding:0 2px 0 2px; + border:1px solid transparent; + height:auto; + white-space:normal; + cursor:pointer !important; + margin-left: 2px; + width: 100%; + &:hover, &.pseudo-active { + color: $tree-fg-hover !important; } - span.file-name { - font: inherit; - flex-grow: 1; - user-select: none; - cursor: default; - color: #c1c1c1; - margin-left: 3px; - cursor: pointer !important; + } + &.prompt.new .file-label, &.file .file-label { + margin-left: 18px; + } + span.file-name { + font: inherit; + flex-grow: 1; + user-select: none; + cursor: default; + color: $tree-text-fg !important; + margin-left: 3px; + cursor: pointer !important; + white-space: nowrap; + &:hover, &.pseudo-active { + color: $tree-fg-hover !important; } + } } .children-count { - margin-left: 3px; + margin-left: 3px; } ^ permalink raw reply [nested|flat] 3+ messages in thread
* Re: [pgAdmin4][Patch] - RM #6847 - High Contrast theme hover issue @ 2021-10-04 07:40 Khushboo Vashi <[email protected]> parent: Khushboo Vashi <[email protected]> 0 siblings, 1 reply; 3+ messages in thread From: Khushboo Vashi @ 2021-10-04 07:40 UTC (permalink / raw) To: pgadmin-hackers Hi, Please find the attached patch to fix the hover issue. Thanks, Khushboo On Mon, Oct 4, 2021 at 11:36 AM Khushboo Vashi < [email protected]> wrote: > Hi, > > Please find the attached patch to fix the RM #6847 - [UI-Tree view][High > Contrast theme]: Hover on any node its label is not visible. > > Thanks, > Khushboo > Attachments: [application/octet-stream] RM_6847_v1.patch (608B, 3-RM_6847_v1.patch) download | inline diff: diff --git a/web/pgadmin/static/scss/_pgadmin4-tree.overrides.scss b/web/pgadmin/static/scss/_pgadmin4-tree.overrides.scss index b4348c867..0a7599050 100644 --- a/web/pgadmin/static/scss/_pgadmin4-tree.overrides.scss +++ b/web/pgadmin/static/scss/_pgadmin4-tree.overrides.scss @@ -32,6 +32,11 @@ &:hover, &.pseudo-active { background-color: $tree-bg-hover !important; color: $tree-fg-hover !important; + span.file-label { + span.file-name { + color: $tree-text-hover-fg !important; + } + } } &.active, &.prompt { background-color: $tree-bg-selected !important; ^ permalink raw reply [nested|flat] 3+ messages in thread
* Re: [pgAdmin4][Patch] - RM #6847 - High Contrast theme hover issue @ 2021-10-04 07:48 Akshay Joshi <[email protected]> parent: Khushboo Vashi <[email protected]> 0 siblings, 0 replies; 3+ messages in thread From: Akshay Joshi @ 2021-10-04 07:48 UTC (permalink / raw) To: Khushboo Vashi <[email protected]>; +Cc: pgadmin-hackers Thanks, the patch applied. On Mon, Oct 4, 2021 at 1:10 PM Khushboo Vashi < [email protected]> wrote: > Hi, > > Please find the attached patch to fix the hover issue. > > Thanks, > Khushboo > > On Mon, Oct 4, 2021 at 11:36 AM Khushboo Vashi < > [email protected]> wrote: > >> Hi, >> >> Please find the attached patch to fix the RM #6847 - [UI-Tree view][High >> Contrast theme]: Hover on any node its label is not visible. >> >> Thanks, >> Khushboo >> > -- *Thanks & Regards* *Akshay Joshi* *pgAdmin Hacker | Principal Software Architect* *EDB Postgres <http://edbpostgres.com>* *Mobile: +91 976-788-8246* ^ permalink raw reply [nested|flat] 3+ messages in thread
end of thread, other threads:[~2021-10-04 07:48 UTC | newest] Thread overview: 3+ messages (download: mbox mbox.gz follow: Atom feed) -- links below jump to the message on this page -- 2021-10-04 06:06 [pgAdmin4][Patch] - RM #6847 - High Contrast theme hover issue Khushboo Vashi <[email protected]> 2021-10-04 07:40 ` Khushboo Vashi <[email protected]> 2021-10-04 07:48 ` Akshay Joshi <[email protected]>
This inbox is served by agora; see mirroring instructions for how to clone and mirror all data and code used for this inbox