Re: [pgAdmin][RM4348] Theme options in pgAdmin and dark theme
Aditya Toshniwal <[email protected]> Wed, 13 Nov 2019 10:45:36 +0530
| Newsgroups | gmane.comp.db.postgresql.pgadmin.devel |
|---|---|
| Message-ID | <CAM9w-_=Jy6kpDyg-FGGz961-djDMKe6hKFa51A5jAbhoygKYVg@mail.gmail.com> |
Hi Hackers, Attached is the patch to set browser autofill color. I've used primary light color to highlight autofill. Note that, this works only on webkit browsers. Kindly review. On Wed, Nov 13, 2019 at 10:03 AM Aditya Toshniwal < [email protected]> wrote: > Hi Dave, > > On Tue, Nov 12, 2019 at 7:29 PM Dave Page <[email protected]> wrote: > >> >> >> On Tue, Nov 12, 2019 at 1:47 PM Aditya Toshniwal < >> [email protected]> wrote: >> >>> Hi Hackers, >>> >>> Attached is the patch to customize the scrollbar styling. A new SASS >>> variable added - $scrollbar-base-color is added to change the color as per >>> theme. >>> Please note, customization of scrollbar works only in webkit browsers >>> like Chrome, Safari. Mozilla does not have any way to customize. >>> >> >> That looks much nicer :-). >> >> One more issue I just spotted - I'm guessing it's specific to Alertify >> dialogues: >> >> [image: Screenshot 2019-11-12 at 13.57.34.png] >> > This is your browser autofill which is changing the color and not the > issue with the dialogs. > >> >> >> -- >> Dave Page >> Blog: http://pgsnake.blogspot.com >> Twitter: @pgsnake >> >> EnterpriseDB UK: http://www.enterprisedb.com >> The Enterprise PostgreSQL Company >> > > > -- > Thanks and Regards, > Aditya Toshniwal > Sr. Software Engineer | EnterpriseDB India | Pune > "Don't Complain about Heat, Plant a TREE" > -- Thanks and Regards, Aditya Toshniwal Sr. Software Engineer | EnterpriseDB India | Pune "Don't Complain about Heat, Plant a TREE"
Screenshot 2019-11-12 at 13.57.34.png
(image/png, 24.3 KB) - not displayed
RM4348.part5_autofill.patch
(application/octet-stream, 1022 B)
diff --git a/web/pgadmin/static/scss/_pgadmin.style.scss b/web/pgadmin/static/scss/_pgadmin.style.scss
index 2bdb77132..c87fa4d48 100644
--- a/web/pgadmin/static/scss/_pgadmin.style.scss
+++ b/web/pgadmin/static/scss/_pgadmin.style.scss
@@ -1035,6 +1035,8 @@ textarea {
background-color: $input-bg;
}
+/* Webkit customizations */
+
::-webkit-scrollbar, ::-webkit-scrollbar-corner {
width: $scrollbar-width;
height: $scrollbar-width;
@@ -1051,3 +1053,17 @@ textarea {
::-webkit-scrollbar-thumb:hover {
background-color: $scrollbar-base-color;
}
+
+input:-webkit-autofill,
+input:-webkit-autofill:hover,
+input:-webkit-autofill:focus,
+textarea:-webkit-autofill,
+textarea:-webkit-autofill:hover,
+textarea:-webkit-autofill:focus,
+select:-webkit-autofill,
+select:-webkit-autofill:hover,
+select:-webkit-autofill:focus {
+ -webkit-text-fill-color: $color-primary-light-fg;
+ -webkit-box-shadow: 0 0 0px 1000px $color-primary-light inset;
+ transition: background-color 5000s ease-in-out 0s;
+}