Adjust product widget list button styling

Voog · Mar 8, 2022 · a491afd · a491afd
1 parent 0946e85
commit a491afd
Show file tree

Hide file tree

Showing 5 changed files with 32 additions and 26 deletions.
diff --git a/components/template-cs-style-rules.tpl b/components/template-cs-style-rules.tpl
@@ -579,7 +579,7 @@ body {
 .dark-background .content-area a {
   color: var(--third-color);
 }
-.content-area a.custom-btn:not(.custom-btn-disabled), .content-area div.custom-btn:not(.custom-btn-disabled) {
+.content-area a.custom-btn:not(.custom-btn-disabled), .content-area div.custom-btn:not(.custom-btn-disabled), .content-area .edy-product-widget-list .edy-product-widget-item-wrap .edy-product-widget-item .edy-product-widget-item-details-wrap .edy-product-widget-item-btn-wrap .edy-product-widget-item-btn {
   padding: calc(var(--button-padding) - 22px) calc(var(--button-padding) - 10px);
   font-size: var(--button-font-size);
   border-color: var(--button-background-color);
@@ -590,15 +590,15 @@ body {
           text-decoration: var(--button-text-decoration);
   text-transform: var(--button-text-transform);
 }
-.content-area a.custom-btn:not(.custom-btn-disabled):hover, .content-area div.custom-btn:not(.custom-btn-disabled):hover {
+.content-area a.custom-btn:not(.custom-btn-disabled):hover, .content-area div.custom-btn:not(.custom-btn-disabled):hover, .content-area .edy-product-widget-list .edy-product-widget-item-wrap .edy-product-widget-item .edy-product-widget-item-details-wrap .edy-product-widget-item-btn-wrap .edy-product-widget-item-btn:hover {
   opacity: .7;
 }
-.dark-background .content-area a.custom-btn:not(.custom-btn-disabled), .dark-background .content-area div.custom-btn:not(.custom-btn-disabled) {
+.dark-background .content-area a.custom-btn:not(.custom-btn-disabled), .dark-background .content-area a.custom-btn:not(.custom-btn-disabled):hover, .dark-background .content-area div.custom-btn:not(.custom-btn-disabled), .dark-background .content-area div.custom-btn:not(.custom-btn-disabled):hover, .dark-background .content-area .edy-product-widget-list .edy-product-widget-item-wrap .edy-product-widget-item .edy-product-widget-item-details-wrap .edy-product-widget-item-btn-wrap .edy-product-widget-item-btn, .dark-background .content-area .edy-product-widget-list .edy-product-widget-item-wrap .edy-product-widget-item .edy-product-widget-item-details-wrap .edy-product-widget-item-btn-wrap .edy-product-widget-item-btn:hover {
   border-color: var(--button-background-color);
   background-color: var(--button-background-color);
   color: var(--third-color);
 }
-.light-background .content-area a.custom-btn:not(.custom-btn-disabled), .light-background .content-area div.custom-btn:not(.custom-btn-disabled) {
+.light-background .content-area a.custom-btn:not(.custom-btn-disabled), .light-background .content-area a.custom-btn:not(.custom-btn-disabled):hover, .light-background .content-area div.custom-btn:not(.custom-btn-disabled), .light-background .content-area div.custom-btn:not(.custom-btn-disabled):hover, .light-background .content-area .edy-product-widget-list .edy-product-widget-item-wrap .edy-product-widget-item .edy-product-widget-item-details-wrap .edy-product-widget-item-btn-wrap .edy-product-widget-item-btn, .light-background .content-area .edy-product-widget-list .edy-product-widget-item-wrap .edy-product-widget-item .edy-product-widget-item-details-wrap .edy-product-widget-item-btn-wrap .edy-product-widget-item-btn:hover {
   border-color: var(--button-background-color);
   background-color: var(--button-background-color);
   color: var(--third-color);

diff --git a/sources/components/custom-styles/template-cs-style-rules.scss b/sources/components/custom-styles/template-cs-style-rules.scss
@@ -822,7 +822,7 @@ body {
   }
 
   // Code blocks and preformatted content.
-  a.custom-btn:not(.custom-btn-disabled), div.custom-btn:not(.custom-btn-disabled) {
+  a.custom-btn:not(.custom-btn-disabled), div.custom-btn:not(.custom-btn-disabled), .edy-product-widget-list .edy-product-widget-item-wrap .edy-product-widget-item .edy-product-widget-item-details-wrap .edy-product-widget-item-btn-wrap .edy-product-widget-item-btn {
     padding: calc(var(--button-padding) - 22px) calc(var(--button-padding) - 10px);
     font-size: var(--button-font-size);
     border-color: var(--button-background-color);
@@ -837,15 +837,19 @@ body {
     }
 
     .dark-background & {
-      border-color: var(--button-background-color);
-      background-color: var(--button-background-color);
-      color: var(--third-color);
+      &, &:hover {
+        border-color: var(--button-background-color);
+        background-color: var(--button-background-color);
+        color: var(--third-color);
+      }
     }
 
     .light-background & {
-      border-color: var(--button-background-color);
-      background-color: var(--button-background-color);
-      color: var(--third-color);
+      &, &:hover {
+        border-color: var(--button-background-color);
+        background-color: var(--button-background-color);
+        color: var(--third-color);
+      }
     }
   }
 

diff --git a/sources/stylesheets/content/_text.scss b/sources/stylesheets/content/_text.scss
@@ -319,7 +319,8 @@
     }
   }
 
-  .custom-btn {
+  .custom-btn,
+  .edy-product-widget-list .edy-product-widget-item-wrap .edy-product-widget-item .edy-product-widget-item-details-wrap .edy-product-widget-item-btn-wrap .edy-product-widget-item-btn {
     display: inline-block;
     background-color: $blue;
     border-color: $blue;

diff --git a/stylesheets/main.css b/stylesheets/main.css
@@ -5100,7 +5100,7 @@ a img {
 .map .content-area iframe {
   margin-top: 0;
 }
-.content-area .custom-btn {
+.content-area .custom-btn, .content-area .edy-product-widget-list .edy-product-widget-item-wrap .edy-product-widget-item .edy-product-widget-item-details-wrap .edy-product-widget-item-btn-wrap .edy-product-widget-item-btn {
   display: inline-block;
   background-color: #0083ba;
   border-color: #0083ba;
@@ -5120,51 +5120,52 @@ a img {
   text-decoration: none;
   border-radius: 6px;
 }
-.publicmode .content-area .custom-btn {
+.publicmode .content-area .custom-btn,
+.publicmode .content-area .edy-product-widget-list .edy-product-widget-item-wrap .edy-product-widget-item .edy-product-widget-item-details-wrap .edy-product-widget-item-btn-wrap .edy-product-widget-item-btn {
   cursor: pointer;
 }
-.site-header .content-area .custom-btn {
+.site-header .content-area .custom-btn, .site-header .content-area .edy-product-widget-list .edy-product-widget-item-wrap .edy-product-widget-item .edy-product-widget-item-details-wrap .edy-product-widget-item-btn-wrap .edy-product-widget-item-btn {
   margin-top: 30px;
   margin-bottom: 30px;
 }
-.site-header .content-area .custom-btn:first-child {
+.site-header .content-area .custom-btn:first-child, .site-header .content-area .edy-product-widget-list .edy-product-widget-item-wrap .edy-product-widget-item .edy-product-widget-item-details-wrap .edy-product-widget-item-btn-wrap .edy-product-widget-item-btn:first-child {
   margin-top: 0;
 }
-.site-header .content-area .custom-btn:last-child {
+.site-header .content-area .custom-btn:last-child, .site-header .content-area .edy-product-widget-list .edy-product-widget-item-wrap .edy-product-widget-item .edy-product-widget-item-details-wrap .edy-product-widget-item-btn-wrap .edy-product-widget-item-btn:last-child {
   margin-bottom: 0;
 }
-.dark-background .content-area .custom-btn {
+.dark-background .content-area .custom-btn, .dark-background .content-area .edy-product-widget-list .edy-product-widget-item-wrap .edy-product-widget-item .edy-product-widget-item-details-wrap .edy-product-widget-item-btn-wrap .edy-product-widget-item-btn {
   border: 2px solid #0083ba;
   background-color: #0083ba;
   color: #fff;
 }
-.light-background .content-area .custom-btn {
+.light-background .content-area .custom-btn, .light-background .content-area .edy-product-widget-list .edy-product-widget-item-wrap .edy-product-widget-item .edy-product-widget-item-details-wrap .edy-product-widget-item-btn-wrap .edy-product-widget-item-btn {
   border: 2px solid #0083ba;
   background-color: #0083ba;
   color: #fff;
 }
-.dark-background .content-area .custom-btn-disabled, .dark-background .content-area .custom-btn.edy-buy-button-disabled, .light-background .content-area .custom-btn-disabled, .light-background .content-area .custom-btn.edy-buy-button-disabled {
+.dark-background .content-area .custom-btn-disabled, .dark-background .content-area .custom-btn.edy-buy-button-disabled, .light-background .content-area .custom-btn-disabled, .light-background .content-area .custom-btn.edy-buy-button-disabled, .dark-background .content-area .edy-product-widget-list .edy-product-widget-item-wrap .edy-product-widget-item .edy-product-widget-item-details-wrap .edy-product-widget-item-btn-wrap .edy-product-widget-item-btn-disabled, .dark-background .content-area .edy-product-widget-list .edy-product-widget-item-wrap .edy-product-widget-item .edy-product-widget-item-details-wrap .edy-product-widget-item-btn-wrap .edy-product-widget-item-btn.edy-buy-button-disabled, .light-background .content-area .edy-product-widget-list .edy-product-widget-item-wrap .edy-product-widget-item .edy-product-widget-item-details-wrap .edy-product-widget-item-btn-wrap .edy-product-widget-item-btn-disabled, .light-background .content-area .edy-product-widget-list .edy-product-widget-item-wrap .edy-product-widget-item .edy-product-widget-item-details-wrap .edy-product-widget-item-btn-wrap .edy-product-widget-item-btn.edy-buy-button-disabled {
   background-color: transparent;
 }
-.dark-background .content-area .custom-btn-disabled, .dark-background .content-area .custom-btn-disabled:hover, .dark-background .content-area .custom-btn.edy-buy-button-disabled, .dark-background .content-area .custom-btn.edy-buy-button-disabled:hover, .light-background .content-area .custom-btn-disabled, .light-background .content-area .custom-btn-disabled:hover, .light-background .content-area .custom-btn.edy-buy-button-disabled, .light-background .content-area .custom-btn.edy-buy-button-disabled:hover {
+.dark-background .content-area .custom-btn-disabled, .dark-background .content-area .custom-btn-disabled:hover, .dark-background .content-area .custom-btn.edy-buy-button-disabled, .dark-background .content-area .custom-btn.edy-buy-button-disabled:hover, .light-background .content-area .custom-btn-disabled, .light-background .content-area .custom-btn-disabled:hover, .light-background .content-area .custom-btn.edy-buy-button-disabled, .light-background .content-area .custom-btn.edy-buy-button-disabled:hover, .dark-background .content-area .edy-product-widget-list .edy-product-widget-item-wrap .edy-product-widget-item .edy-product-widget-item-details-wrap .edy-product-widget-item-btn-wrap .edy-product-widget-item-btn-disabled, .dark-background .content-area .edy-product-widget-list .edy-product-widget-item-wrap .edy-product-widget-item .edy-product-widget-item-details-wrap .edy-product-widget-item-btn-wrap .edy-product-widget-item-btn-disabled:hover, .dark-background .content-area .edy-product-widget-list .edy-product-widget-item-wrap .edy-product-widget-item .edy-product-widget-item-details-wrap .edy-product-widget-item-btn-wrap .edy-product-widget-item-btn.edy-buy-button-disabled, .dark-background .content-area .edy-product-widget-list .edy-product-widget-item-wrap .edy-product-widget-item .edy-product-widget-item-details-wrap .edy-product-widget-item-btn-wrap .edy-product-widget-item-btn.edy-buy-button-disabled:hover, .light-background .content-area .edy-product-widget-list .edy-product-widget-item-wrap .edy-product-widget-item .edy-product-widget-item-details-wrap .edy-product-widget-item-btn-wrap .edy-product-widget-item-btn-disabled, .light-background .content-area .edy-product-widget-list .edy-product-widget-item-wrap .edy-product-widget-item .edy-product-widget-item-details-wrap .edy-product-widget-item-btn-wrap .edy-product-widget-item-btn-disabled:hover, .light-background .content-area .edy-product-widget-list .edy-product-widget-item-wrap .edy-product-widget-item .edy-product-widget-item-details-wrap .edy-product-widget-item-btn-wrap .edy-product-widget-item-btn.edy-buy-button-disabled, .light-background .content-area .edy-product-widget-list .edy-product-widget-item-wrap .edy-product-widget-item .edy-product-widget-item-details-wrap .edy-product-widget-item-btn-wrap .edy-product-widget-item-btn.edy-buy-button-disabled:hover {
   color: #999;
   cursor: default;
   border: 2px solid #999;
 }
-.dark-background .content-area .custom-btn-disabled:hover, .dark-background .content-area .custom-btn.edy-buy-button-disabled:hover, .light-background .content-area .custom-btn-disabled:hover, .light-background .content-area .custom-btn.edy-buy-button-disabled:hover {
+.dark-background .content-area .custom-btn-disabled:hover, .dark-background .content-area .custom-btn.edy-buy-button-disabled:hover, .light-background .content-area .custom-btn-disabled:hover, .light-background .content-area .custom-btn.edy-buy-button-disabled:hover, .dark-background .content-area .edy-product-widget-list .edy-product-widget-item-wrap .edy-product-widget-item .edy-product-widget-item-details-wrap .edy-product-widget-item-btn-wrap .edy-product-widget-item-btn-disabled:hover, .dark-background .content-area .edy-product-widget-list .edy-product-widget-item-wrap .edy-product-widget-item .edy-product-widget-item-details-wrap .edy-product-widget-item-btn-wrap .edy-product-widget-item-btn.edy-buy-button-disabled:hover, .light-background .content-area .edy-product-widget-list .edy-product-widget-item-wrap .edy-product-widget-item .edy-product-widget-item-details-wrap .edy-product-widget-item-btn-wrap .edy-product-widget-item-btn-disabled:hover, .light-background .content-area .edy-product-widget-list .edy-product-widget-item-wrap .edy-product-widget-item .edy-product-widget-item-details-wrap .edy-product-widget-item-btn-wrap .edy-product-widget-item-btn.edy-buy-button-disabled:hover {
   background-color: transparent;
 }
-.content-area .custom-btn:hover {
+.content-area .custom-btn:hover, .content-area .edy-product-widget-list .edy-product-widget-item-wrap .edy-product-widget-item .edy-product-widget-item-details-wrap .edy-product-widget-item-btn-wrap .edy-product-widget-item-btn:hover {
   -webkit-transition: 500ms;
   -o-transition: 500ms;
   transition: 500ms;
 }
-.dark-background .content-area .custom-btn:hover {
+.dark-background .content-area .custom-btn:hover, .dark-background .content-area .edy-product-widget-list .edy-product-widget-item-wrap .edy-product-widget-item .edy-product-widget-item-details-wrap .edy-product-widget-item-btn-wrap .edy-product-widget-item-btn:hover {
   border: 2px solid #015477;
   background-color: #015477;
   color: #fff;
 }
-.light-background .content-area .custom-btn:hover {
+.light-background .content-area .custom-btn:hover, .light-background .content-area .edy-product-widget-list .edy-product-widget-item-wrap .edy-product-widget-item .edy-product-widget-item-details-wrap .edy-product-widget-item-btn-wrap .edy-product-widget-item-btn:hover {
   border: 2px solid #015477;
   background-color: #015477;
   color: #fff;

diff --git a/stylesheets/main.min.css b/stylesheets/main.min.css