From fd1641fe544f659d3768d34b5af4bd0fc87c45e3 Mon Sep 17 00:00:00 2001 From: Cagatay Civici Date: Sun, 11 Oct 2020 22:14:14 +0300 Subject: [PATCH] Fixed #545 - Galleria and Carousel highlight item visual improvement on PrimeOne Themes --- public/themes/arya-blue/theme.css | 14 ++++++++++++-- public/themes/arya-green/theme.css | 14 ++++++++++++-- public/themes/arya-orange/theme.css | 14 ++++++++++++-- public/themes/arya-purple/theme.css | 14 ++++++++++++-- public/themes/saga-blue/theme.css | 7 +++++++ public/themes/saga-green/theme.css | 7 +++++++ public/themes/saga-orange/theme.css | 7 +++++++ public/themes/saga-purple/theme.css | 7 +++++++ public/themes/vela-blue/theme.css | 14 ++++++++++++-- public/themes/vela-green/theme.css | 14 ++++++++++++-- public/themes/vela-orange/theme.css | 14 ++++++++++++-- public/themes/vela-purple/theme.css | 14 ++++++++++++-- 12 files changed, 124 insertions(+), 16 deletions(-) diff --git a/public/themes/arya-blue/theme.css b/public/themes/arya-blue/theme.css index 6ef2cdd4d..9b0b1e818 100644 --- a/public/themes/arya-blue/theme.css +++ b/public/themes/arya-blue/theme.css @@ -1731,7 +1731,7 @@ border-radius: 0; } .p-carousel .p-carousel-indicators .p-carousel-indicator button:hover { - background: rgba(255, 255, 255, 0.03); + background: #4c4c4c; } .p-carousel .p-carousel-indicators .p-carousel-indicator.p-highlight button { background: rgba(100, 181, 246, 0.16); @@ -4134,7 +4134,7 @@ border-radius: 50%; } .p-galleria .p-galleria-indicators .p-galleria-indicator button:hover { - background: rgba(255, 255, 255, 0.1); + background: #4c4c4c; } .p-galleria .p-galleria-indicators .p-galleria-indicator.p-highlight button { background: rgba(100, 181, 246, 0.16); @@ -4305,3 +4305,13 @@ } /* Customizations to the designer theme should be defined here */ +.p-carousel .p-carousel-indicators .p-carousel-indicator.p-highlight button { + background-color: #64B5F6; +} + +.p-galleria .p-galleria-indicators .p-galleria-indicator.p-highlight button { + background-color: #64B5F6; +} +.p-galleria.p-galleria-indicator-onitem .p-galleria-indicators .p-galleria-indicator.p-highlight button { + background: #64B5F6; +} diff --git a/public/themes/arya-green/theme.css b/public/themes/arya-green/theme.css index 98d7c5658..9b033a1b8 100644 --- a/public/themes/arya-green/theme.css +++ b/public/themes/arya-green/theme.css @@ -1731,7 +1731,7 @@ border-radius: 0; } .p-carousel .p-carousel-indicators .p-carousel-indicator button:hover { - background: rgba(255, 255, 255, 0.03); + background: #4c4c4c; } .p-carousel .p-carousel-indicators .p-carousel-indicator.p-highlight button { background: rgba(129, 199, 132, 0.16); @@ -4134,7 +4134,7 @@ border-radius: 50%; } .p-galleria .p-galleria-indicators .p-galleria-indicator button:hover { - background: rgba(255, 255, 255, 0.1); + background: #4c4c4c; } .p-galleria .p-galleria-indicators .p-galleria-indicator.p-highlight button { background: rgba(129, 199, 132, 0.16); @@ -4305,3 +4305,13 @@ } /* Customizations to the designer theme should be defined here */ +.p-carousel .p-carousel-indicators .p-carousel-indicator.p-highlight button { + background-color: #81C784; +} + +.p-galleria .p-galleria-indicators .p-galleria-indicator.p-highlight button { + background-color: #81C784; +} +.p-galleria.p-galleria-indicator-onitem .p-galleria-indicators .p-galleria-indicator.p-highlight button { + background: #81C784; +} diff --git a/public/themes/arya-orange/theme.css b/public/themes/arya-orange/theme.css index 9e69a70c2..688ea74a0 100644 --- a/public/themes/arya-orange/theme.css +++ b/public/themes/arya-orange/theme.css @@ -1731,7 +1731,7 @@ border-radius: 0; } .p-carousel .p-carousel-indicators .p-carousel-indicator button:hover { - background: rgba(255, 255, 255, 0.03); + background: #4c4c4c; } .p-carousel .p-carousel-indicators .p-carousel-indicator.p-highlight button { background: rgba(255, 213, 79, 0.16); @@ -4134,7 +4134,7 @@ border-radius: 50%; } .p-galleria .p-galleria-indicators .p-galleria-indicator button:hover { - background: rgba(255, 255, 255, 0.1); + background: #4c4c4c; } .p-galleria .p-galleria-indicators .p-galleria-indicator.p-highlight button { background: rgba(255, 213, 79, 0.16); @@ -4305,3 +4305,13 @@ } /* Customizations to the designer theme should be defined here */ +.p-carousel .p-carousel-indicators .p-carousel-indicator.p-highlight button { + background-color: #FFD54F; +} + +.p-galleria .p-galleria-indicators .p-galleria-indicator.p-highlight button { + background-color: #FFD54F; +} +.p-galleria.p-galleria-indicator-onitem .p-galleria-indicators .p-galleria-indicator.p-highlight button { + background: #FFD54F; +} diff --git a/public/themes/arya-purple/theme.css b/public/themes/arya-purple/theme.css index 7dbf3ccf3..7712e7f1d 100644 --- a/public/themes/arya-purple/theme.css +++ b/public/themes/arya-purple/theme.css @@ -1731,7 +1731,7 @@ border-radius: 0; } .p-carousel .p-carousel-indicators .p-carousel-indicator button:hover { - background: rgba(255, 255, 255, 0.03); + background: #4c4c4c; } .p-carousel .p-carousel-indicators .p-carousel-indicator.p-highlight button { background: rgba(186, 104, 200, 0.16); @@ -4134,7 +4134,7 @@ border-radius: 50%; } .p-galleria .p-galleria-indicators .p-galleria-indicator button:hover { - background: rgba(255, 255, 255, 0.1); + background: #4c4c4c; } .p-galleria .p-galleria-indicators .p-galleria-indicator.p-highlight button { background: rgba(186, 104, 200, 0.16); @@ -4305,3 +4305,13 @@ } /* Customizations to the designer theme should be defined here */ +.p-carousel .p-carousel-indicators .p-carousel-indicator.p-highlight button { + background-color: #BA68C8; +} + +.p-galleria .p-galleria-indicators .p-galleria-indicator.p-highlight button { + background-color: #BA68C8; +} +.p-galleria.p-galleria-indicator-onitem .p-galleria-indicators .p-galleria-indicator.p-highlight button { + background: #BA68C8; +} diff --git a/public/themes/saga-blue/theme.css b/public/themes/saga-blue/theme.css index 93ef255ff..51d29b707 100644 --- a/public/themes/saga-blue/theme.css +++ b/public/themes/saga-blue/theme.css @@ -4305,3 +4305,10 @@ } /* Customizations to the designer theme should be defined here */ +.p-carousel .p-carousel-indicators .p-carousel-indicator.p-highlight button { + background-color: #2196F3; +} + +.p-galleria .p-galleria-indicators .p-galleria-indicator.p-highlight button { + background-color: #2196F3; +} diff --git a/public/themes/saga-green/theme.css b/public/themes/saga-green/theme.css index 07a099477..517ac868f 100644 --- a/public/themes/saga-green/theme.css +++ b/public/themes/saga-green/theme.css @@ -4305,3 +4305,10 @@ } /* Customizations to the designer theme should be defined here */ +.p-carousel .p-carousel-indicators .p-carousel-indicator.p-highlight button { + background-color: #4CAF50; +} + +.p-galleria .p-galleria-indicators .p-galleria-indicator.p-highlight button { + background-color: #4CAF50; +} diff --git a/public/themes/saga-orange/theme.css b/public/themes/saga-orange/theme.css index 31e176e58..f2a9be488 100644 --- a/public/themes/saga-orange/theme.css +++ b/public/themes/saga-orange/theme.css @@ -4305,3 +4305,10 @@ } /* Customizations to the designer theme should be defined here */ +.p-carousel .p-carousel-indicators .p-carousel-indicator.p-highlight button { + background-color: #FFC107; +} + +.p-galleria .p-galleria-indicators .p-galleria-indicator.p-highlight button { + background-color: #FFC107; +} diff --git a/public/themes/saga-purple/theme.css b/public/themes/saga-purple/theme.css index bd9db5ecc..ccde48182 100644 --- a/public/themes/saga-purple/theme.css +++ b/public/themes/saga-purple/theme.css @@ -4305,3 +4305,10 @@ } /* Customizations to the designer theme should be defined here */ +.p-carousel .p-carousel-indicators .p-carousel-indicator.p-highlight button { + background-color: #9C27B0; +} + +.p-galleria .p-galleria-indicators .p-galleria-indicator.p-highlight button { + background-color: #9C27B0; +} diff --git a/public/themes/vela-blue/theme.css b/public/themes/vela-blue/theme.css index 5376a2d5b..e72a611b5 100644 --- a/public/themes/vela-blue/theme.css +++ b/public/themes/vela-blue/theme.css @@ -1731,7 +1731,7 @@ border-radius: 0; } .p-carousel .p-carousel-indicators .p-carousel-indicator button:hover { - background: rgba(255, 255, 255, 0.03); + background: #3c567a; } .p-carousel .p-carousel-indicators .p-carousel-indicator.p-highlight button { background: rgba(100, 181, 246, 0.16); @@ -4134,7 +4134,7 @@ border-radius: 50%; } .p-galleria .p-galleria-indicators .p-galleria-indicator button:hover { - background: rgba(255, 255, 255, 0.1); + background: #3c567a; } .p-galleria .p-galleria-indicators .p-galleria-indicator.p-highlight button { background: rgba(100, 181, 246, 0.16); @@ -4305,3 +4305,13 @@ } /* Customizations to the designer theme should be defined here */ +.p-carousel .p-carousel-indicators .p-carousel-indicator.p-highlight button { + background-color: #64B5F6; +} + +.p-galleria .p-galleria-indicators .p-galleria-indicator.p-highlight button { + background-color: #64B5F6; +} +.p-galleria.p-galleria-indicator-onitem .p-galleria-indicators .p-galleria-indicator.p-highlight button { + background: #64B5F6; +} diff --git a/public/themes/vela-green/theme.css b/public/themes/vela-green/theme.css index 254de2013..c65492c89 100644 --- a/public/themes/vela-green/theme.css +++ b/public/themes/vela-green/theme.css @@ -1731,7 +1731,7 @@ border-radius: 0; } .p-carousel .p-carousel-indicators .p-carousel-indicator button:hover { - background: rgba(255, 255, 255, 0.03); + background: #3c567a; } .p-carousel .p-carousel-indicators .p-carousel-indicator.p-highlight button { background: rgba(129, 199, 132, 0.16); @@ -4134,7 +4134,7 @@ border-radius: 50%; } .p-galleria .p-galleria-indicators .p-galleria-indicator button:hover { - background: rgba(255, 255, 255, 0.1); + background: #3c567a; } .p-galleria .p-galleria-indicators .p-galleria-indicator.p-highlight button { background: rgba(129, 199, 132, 0.16); @@ -4305,3 +4305,13 @@ } /* Customizations to the designer theme should be defined here */ +.p-carousel .p-carousel-indicators .p-carousel-indicator.p-highlight button { + background-color: #81C784; +} + +.p-galleria .p-galleria-indicators .p-galleria-indicator.p-highlight button { + background-color: #81C784; +} +.p-galleria.p-galleria-indicator-onitem .p-galleria-indicators .p-galleria-indicator.p-highlight button { + background: #81C784; +} diff --git a/public/themes/vela-orange/theme.css b/public/themes/vela-orange/theme.css index 486338cb3..379fcf390 100644 --- a/public/themes/vela-orange/theme.css +++ b/public/themes/vela-orange/theme.css @@ -1731,7 +1731,7 @@ border-radius: 0; } .p-carousel .p-carousel-indicators .p-carousel-indicator button:hover { - background: rgba(255, 255, 255, 0.03); + background: #3c567a; } .p-carousel .p-carousel-indicators .p-carousel-indicator.p-highlight button { background: rgba(255, 213, 79, 0.16); @@ -4134,7 +4134,7 @@ border-radius: 50%; } .p-galleria .p-galleria-indicators .p-galleria-indicator button:hover { - background: rgba(255, 255, 255, 0.1); + background: #3c567a; } .p-galleria .p-galleria-indicators .p-galleria-indicator.p-highlight button { background: rgba(255, 213, 79, 0.16); @@ -4305,3 +4305,13 @@ } /* Customizations to the designer theme should be defined here */ +.p-carousel .p-carousel-indicators .p-carousel-indicator.p-highlight button { + background-color: #FFD54F; +} + +.p-galleria .p-galleria-indicators .p-galleria-indicator.p-highlight button { + background-color: #FFD54F; +} +.p-galleria.p-galleria-indicator-onitem .p-galleria-indicators .p-galleria-indicator.p-highlight button { + background: #FFD54F; +} diff --git a/public/themes/vela-purple/theme.css b/public/themes/vela-purple/theme.css index 1d64a377f..d0f193f1a 100644 --- a/public/themes/vela-purple/theme.css +++ b/public/themes/vela-purple/theme.css @@ -1731,7 +1731,7 @@ border-radius: 0; } .p-carousel .p-carousel-indicators .p-carousel-indicator button:hover { - background: rgba(255, 255, 255, 0.03); + background: #3c567a; } .p-carousel .p-carousel-indicators .p-carousel-indicator.p-highlight button { background: rgba(186, 104, 200, 0.16); @@ -4134,7 +4134,7 @@ border-radius: 50%; } .p-galleria .p-galleria-indicators .p-galleria-indicator button:hover { - background: rgba(255, 255, 255, 0.1); + background: #3c567a; } .p-galleria .p-galleria-indicators .p-galleria-indicator.p-highlight button { background: rgba(186, 104, 200, 0.16); @@ -4305,3 +4305,13 @@ } /* Customizations to the designer theme should be defined here */ +.p-carousel .p-carousel-indicators .p-carousel-indicator.p-highlight button { + background-color: #BA68C8; +} + +.p-galleria .p-galleria-indicators .p-galleria-indicator.p-highlight button { + background-color: #BA68C8; +} +.p-galleria.p-galleria-indicator-onitem .p-galleria-indicators .p-galleria-indicator.p-highlight button { + background: #BA68C8; +}