public inbox for [email protected]
help / color / mirror / Atom feedFrom: Khushboo Vashi <[email protected]>
To: pgadmin-hackers <[email protected]>
Subject: [pgAdmin4][Patch] - RM #6847 - High Contrast theme hover issue
Date: Mon, 4 Oct 2021 11:36:21 +0530
Message-ID: <CAFOhELdrs6own195ah+L0g6F5B-OsCEY=CoYXCTRcPvSDq7yog@mail.gmail.com> (raw)
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;
}
view thread (3+ 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: [pgAdmin4][Patch] - RM #6847 - High Contrast theme hover issue
In-Reply-To: <CAFOhELdrs6own195ah+L0g6F5B-OsCEY=CoYXCTRcPvSDq7yog@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