Dark theme settings

How to change the background color to:
1) products, icons
2) on the main menu (2 drop-down lists)
3) change the color of the icons
4) change the background color and text color of tooltips for buttons?

Hello,

I saw the screenshots you attached.

1) Please try adding the following Custom CSS in the Global Custom CSS area under Theme Settings >> Custom CSS.

.color-scheme-light .woodmart-buttons, .woodmart-dark .woodmart-buttons {
    background-color: green;
}

.woodmart-dark .woodmart-hover-tiled .product-element-bottom {
    background-color: green;
}

2) Please try adding the following Custom CSS in the Global Custom CSS area under Theme Settings >> Custom CSS.

.vertical-navigation .item-level-0.menu-item-has-children:not(.menu-simple-dropdown) {
    background: green;
}

.sub-menu-dropdown.color-scheme-light {
    background-color: green;
}

3) Please try adding the following Custom CSS in the Global Custom CSS area under Theme Settings >> Custom CSS.

.color-scheme-light .wd-action-btn>a, .woodmart-dark .wd-action-btn>a {
    color: rebeccapurple;
}

4)Please try adding the following Custom CSS in the Global Custom CSS area under Theme Settings >> Custom CSS.

.woodmart-tltp .woodmart-tooltip-label {

    background-color: green;
}

Regards.
Xtemos Studios

1) On the store page, the icons when hovering over the product are white. How to make from black and green on hover?
2) Pasted the code:
.woodmart-tltp .woodmart-tooltip-label {

background-color: green;
}
But hints are still with white text (need black), and black background (need white).

3) You need to change the color of the product short description text from white to black.
4) How do I change the text color of the price and filter widget on store pages?

Hello,

I saw the screenshots you attached.

1) Please try using the following Custom CSS for that.

.wd-action-btn.wd-add-cart-btn>a:before {
    color: black;
}

.wd-action-btn.wd-wishlist-btn>a:before {
    color: black;
}

.wd-action-btn.wd-quick-view-btn>a:before {
    color: black;
}

2) Please try adding the following Custom CSS for that.

.woodmart-tltp span.woodmart-tooltip-label, div.tooltip-inner {
    background: white;
    color: black;
}

3) Please try adding the following Custom CSS for that.

.woodmart-more-desc-inner {
    color: black;
}

4) Please try adding the following Custom CSS for that.

.woodmart-products-per-page .per-page-title {
    color: white;
}

.woodmart-products-per-page .per-page-variation {
    color: white;
}

.woodmart-products-shop-view .shop-view svg {
    fill: white !important;
}

.woodmart-filter-buttons .open-filters {
    color: white;
}

.woodmart-filter-buttons .open-filters:after, .woodmart-filter-buttons .open-filters:before {
    background-color: white;
}

.widget_price_filter .price_slider_amount .price_label {
    color: white;
}

.widget_price_filter .price_slider_amount .price_label>span {
    color: white;
}

Regards.
Xtemos Studios

Thanks you.
I did point 1
”
1) Please try using the following Custom CSS for that.

.wd-action-btn.wd-add-cart-btn>a:before {
color: black;
}

.wd-action-btn.wd-wishlist-btn>a:before {
color: black;
}

.wd-action-btn.wd-quick-view-btn>a:before {
color: black;
} ”

, the green color disappeared when you hover over the icons, the wishlist, basket, quick view. I need the icons of these buttons to turn green on hover. Thanks

Hello,

You are Most Welcome.

Please try adding the following Custom CSS for that.

.wd-action-btn.wd-add-cart-btn>a:hover:before {
    color: green;
}

.wd-action-btn.wd-wishlist-btn>a:hover:before {
    color: green;
}

.wd-action-btn.wd-quick-view-btn>a:hover:before {
    color: green;
}

Regards.
Xtemos Studios

Thanks.
1) How do I edit the shopping cart popup?
2) How do I change the text colors on the store page?
3) How can I change the text color and background color of the active menu item (screenshot No. 1), the color of menu items (screenshot No. 2), the text color and background color of the menu item on hover (screenshot No. 3) on the account page?
Thanks.

Hello,

You are Most Welcome.

I saw the screenshots you attached.

1) Please try adding the following Custom CSS for that.

.widget_shopping_cart .total strong {
    color: green;
}

.widget-heading .widget-title {
    color: green;
}

2) Please try adding the following Custom CSS for that.

.product-grid-item .product-title a {
    color: white;
}

.product-grid-item .price .amount {
    color: white;
}

.categories-accordion-on .widget_product_categories .count {
    color: white;
}

.widget_product_categories .product-categories li.current-cat>a {
    color: white;
}

.widget_product_categories .product-categories li.current-cat>a {
    color: white;
}

3)Please try adding the following Custom CSS for that.

 .woocommerce-MyAccount-navigation ul li.is-active>a {
    color: white;
    background-color: rgba(136,136,136,.12);
}

.woocommerce-MyAccount-navigation ul li a {
    color: red;
}

.woocommerce-MyAccount-navigation ul li a:focus, .woocommerce-MyAccount-navigation ul li a:hover {
    color: green;
    background-color: aqua;
}

Regards.
Xtemos Studios.

How do I change the color of the text and link on the Terms and Conditions page?

Hello,

I saw the screenshot you attached.

Please try adding the following Custom CSS in the Global Custom CSS area under Theme Settings >> Custom CSS.

span.woocommerce-terms-and-conditions-checkbox-text {
    color: green;
}

span.woocommerce-terms-and-conditions-checkbox-text a {
    color: green;
}

Regards.
Xtemos Studios

1.1) How can I remove unnecessary fields when placing an order? I work in the same city and I don’t need them. You need to remove the fields: “Company name”, “Country”, “State / province”, “City”, “Postal code”. And I need to remove the same fields from the “Addresses” page in the user’s account (https://demo38.ipixstudio.ru/my-account/edit-address/billing/ https://demo38.ipixstudio.ru/my-account/edit-address/shipping/)
1.2) How do I style a “Privacy Policy” link like “Terms and Conditions”? On hover green

2) Users with Russian logins cannot register on the new user registration page. How to make the login (username) in Cyrillic?
3) How do I change the color of the privacy warning?
4) How to style the “authorize” button like the “register” button?

Hello,

1.1) Sorry but there is no option in Theme Settings available for that. Because the checkout is woocommerce functionality and our theme doesn’t influence.

1.2) Please try adding the following Custom CSS for that.

.woocommerce-privacy-policy-text a:hover:last-child {
    color: green;
}

2) Sorry but there is no option in Theme Settings available for that.

3) Please try adding the following Custom CSS for that.

.woocommerce-privacy-policy-text p:last-child {
color: white;
}

4) Please try adding the following Custom CSS for that.

.btns-default-dark .woodmart-switch-to-register {
    color: white;
}

.woodmart-switch-to-register {
    background-color: #83b735;
}

Regards.
Xtemos Studios

1) I changed the color of the privacy policy warning on the registration page (see last answer), but I don’t need to change the color on the checkout page (leave black here). How can I change the declension and cases of the links “Privacy Policy and Terms and Conditions”? Since it is not literate in Russian. https://prnt.sc/115f4b0

Hello,

Ok then please delete the old given custom CSS and use this instead:

.woocommerce-account .woocommerce-privacy-policy-text p:last-child {
color: white;
}

Best Regards

How do I change the color of buttons and text in buttons on hover and at rest? On the pop-up cart window.

Hello,

I saw the screenshot you attached.

Please try using the following Custom CSS for that.

For the Cart button:

a.button.btn-cart.wc-forward {
    background: orange;
}

a.button.btn-cart.wc-forward:hover {
    background: orange;
}

For the Checkout button:

a.button.checkout.wc-forward {
    background: red;
}

a.button.checkout.wc-forward:hover {
    background: red;
}

Best Regards

Thank you. I changed the text color to white again. How do I change the text color to black only in the login pop-up window?

Hello,

You are Most Welcome.

Please try adding the following Custom CSS for that.

p.form-row-wide label {
    color: black;
}

Best Regards.

Okay. Thank you. How to add a placeholder in the “username” and “password” fields in the registration form?

Hello,

You are Most Welcome.

Sorry but there is no option in Theme Settings available for that.

It requires customizations and this is beyond our limitations and support policy.

Regards.
Xtemos Studios

Hello, after some styling changes, some code stopped working. Please tell me how to change only the styles that I show, so that the styles of other text on other pages do not change. Thank you.
Screenshots and links in attachment

1) How do I change the background when hovering over a product on the category page and home page (1.1)? How do I change the color of the old product price (1.2)? How do I change the color of the “Add to cart” button in rest and on hover (1.3)? How do you close the gap that separates the thousands in the price (1.4)?

2) How do I change the color of the active menu item when the mouse pointer moves over a submenu? Как сделать пункты меню в темной теме как в светлой https://i.imgur.com/QIVvO9Z.png?

3) How do I change the color of the “Add to cart” button in rest and on hover?

Hello,

I saw the screenshot you attached.

1.1) Please try adding the following Custom CSS for that.

.wd-hover-base .content-product-imagin {
    background-color: green;
}

1.2) Please try adding the following Custom CSS for that.

[class*="color-scheme-light"] del .amount {
    color: red;
}

1.3) & 3 Please try adding the following Custom CSS for that.

.wd-hover-base .wd-bottom-actions:not(.wd-add-small-btn) .wd-add-btn>a {
    background-color: red;
}

1.4) This space is coming from the price. Please try removing any space from the price then clear cache and check back.

2) Please try adding the following Custom CSS for that.

.wd-nav-vertical>li>a {
    color: #333 !important;
}

Best Regards

On the product page, in the “similar products” block, I need to change the color of the “Add to cart” icon and its color on hover. I tried changing the .wd-action-btn class, but it changes the color of other buttons as well. How to change only the button in this “Similar Products” block on the product page? Thank you.

Hello,

Please try adding the following Custom CSS for that.

.single-product .wd-carousel-container .wd-action-btn.wd-style-icon>a:hover:before {
    color: #808080;
}

.single-product .wd-carousel-container .wd-action-btn.wd-style-icon>a:hover:before {
    color: green;
}

Regards.
Xtemos Studios

Thank you. How do I change the color of the pattern on the Checkout page?

Hello,

You are Most Welcome.

Please try adding the following Custom CSS for That.

.global-color-scheme-light .checkout-order-review:before {
    background-image: radial-gradient(farthest-side, rgba(0,0,0,0) 6px, #fff 0);
}

Best Regards

Thanks, but the bottom picture hasn’t changed. I thought one css code is responsible for them. How do I change the color of the bottom picture?

Hello,

You are Most Welcome.

Please replace the previous Custom CSS with the following in the Global Custom CSS area under Theme Settings >> Custom CSS.

.global-color-scheme-light .checkout-order-review:after, .global-color-scheme-light .checkout-order-review:before {
    background-image: radial-gradient(farthest-side, rgba(0,0,0,0) 6px, #fff 0);
}

Best Regards

Hello. I just have to make some styling changes. Thanks for the support.
1) On the product page, you need to change the color of the “add to wishlist” button icon, but you need to change only this place so that in other places this button remains gray (for example, in the “similar products” block on the product page, on category pages and on the main page, the should remain gray)
2) How to remove the “Compare” menu button in mobile.
3) How can I change the type of receipt on the checkout page? I have a dark theme, but I need a check style as on a light theme (see image 123123 in the attachment). You need a white and gray background, text color (black) and prices (green), color of links “Privacy Policy” and “Terms and Conditions” when hovering green. But the color of the text of the Privacy Policy should be changed to gray only on this page so that it remains white on the registration page.

Hello,

I saw the screenshot you attached.

1) Please try adding the following Custom CSS for that.

.single-product-page .wd-action-btn.wd-wishlist-btn>a:before {
    color: white;
}

2) Please try adding the following Custom CSS for that.

.wd-nav-mobile li.menu-item-compare {
    display: none;
}

3) Please try adding the following Custom CSS for that.

.global-color-scheme-light .checkout-order-review {
    background-color: white;
}

#order_review_heading {
    color: black;
}

.woocommerce-checkout-review-order-table th {
 color: black;
}

.global-color-scheme-light .woocommerce-terms-and-conditions-wrapper .woocommerce-privacy-policy-text {
    color: black;
}

span.woocommerce-terms-and-conditions-checkbox-text {
    color: black;
}

Note: Please create separate topics for your questions to make sure that one topic not takes too long and avoid any confusion.

Best Regards.

[Author]

Posts