Return to previous page

Styling issue - by MJ - on WordPress WooCommerce support

This topic has 12 replies, 2 voices, and was last updated 4 years, 4 months ago ago by Olga Barlow

MJ

Participant

July 30, 2021 at 10:02

Hi,
1. can you please check global CSS you provided before? they are not working on the new theme. http://i.prntscr.com/7Wu7z_u0RoKfsD-Qa5XTqw.png
the menu is supposed to open full screen width and texts are in a middle.
And FYI, i noticed that if i use Nav menu element in widget area and select the custom menu with icons, the theme would not show the icons. however, if choose 8theme menu, then the icons are appearing.
2. i want to control the color of whole theme for buttons and hover color. can you guide?
3. i would like to create blue hover box around each products in shop. is it possible?
i can create shadow around normal items like below around a info box but not sure about product items.
.example > .vc_column-inner:hover {
box-shadow: 0 3px 25px rgba(0, 0, 0, 0.09);
Thanks

Please, contact administrator
for this information.

#296906 Copied Theme version: 8.0.2

11 Answers

MJ

Participant

August 2, 2021 at 07:08

on top of above, can i use different logo for my mobile view?
Thanks

#297276 Copied
Olga Barlow

Participant

August 2, 2021 at 14:28
Hello,

1) I don’t see the previous menu with icon on your site anymore.
2) Go to Theme Options > Styling > scroll to buttons sections and change the colors according to your needs. Buttons element in the page content you need to edit individually while editing the page using page builder.
3) Do you want something like this https://prnt.sc/1idckn5 ? Use the below custom

.content-product:hover { box-shadow: 0 3px 25px rgba(0, 0, 0, 0.09); }

4) We don’t have option to use a different logo for the mobile header, unfortunately, you can just change the width of the mobile logo using logo element settings.

Regards
#297341 Copied
MJ

Participant

August 3, 2021 at 03:52

Hi
1. the menu is there https://prnt.sc/1ij4ng7 . As i mentioned i used nav menu before (in widget area) but Nav menu does not work after update. So i changed to 8theme menu instead. to resolve this, either the CSS should change or have some ways to use old Nav menu.
2. thanks for this.
3. i just want the line around not shadow like this https://prnt.sc/1ijlz6t
4. ok.
5. and can you give me CSS for these as well:
a. https://prnt.sc/1ijmngr
b. https://prnt.sc/1ijmyxo

#297447 Copied

MJ

Participant

August 4, 2021 at 05:08

Hi,
Not sure why your responses delayed so much recently. This post started on 30th and still not closed.
Can you please speedup your responses?

#297620 Copied
Olga Barlow

Participant

August 4, 2021 at 12:55
Hello,

Sorry for the delay in answering.

1) I found that you use it for the mobile header only. I see.
Provide us with FTP access to your site. Because I found that the menu opens by click but did not close by click. We need to take a closer look at this.
3) If you just want to add the border then use the below custom

.content-product:hover { border: 5px solid #00acc1; }

5) a) We used custom class for the row in the column product-plan
and below custom CSS to move it up on hover

.product-plan:hover { transform: translateY(-30px); }

So, everything depends on where you want to apply that effect.
b) We used Massive Addons element infobox and its settings https://prnt.sc/1j06wgc

Regards
#297694 Copied
MJ

Participant

August 4, 2021 at 15:34

Thanks, here’s the details.

Please contact administrator
for this information.

#297734 Copied

MJ

Participant

August 4, 2021 at 15:38

For #1 I will use it on desktop as well. I’m doing experiment. Please check for both. You can add it in header if you need to for test. This is not the production site so you can change things. Just let me know the changes.
Thanks

#297735 Copied

Olga Barlow

Participant

August 4, 2021 at 16:19

Hello,

Check the mentioned menu now.
We use custom CSS to achieve styles you need, so it’s important to know exactly where you plan to use that because custom CSS may change depending on location. So, decide where exactly you plan to use it and show us the final version in case you need any other help with the custom CSS.

Regards

#297743 Copied
MJ

Participant

August 5, 2021 at 03:11
Thanks yes its working.
1. Can we make the menu closed when user click anywhere on screen? now the only way to close the menu is by clicking the menu icon.
2. i added animation to the menu:
a. the animation starts above header and continue down. can the animation start from below the header? (you can open the menu in mobile version and you will see the menu will cover whole header and then slide down.)
b. can i add slideup animation to the same menu?

3. and the CSS for menu icon size is not working (shown below.)

.mobile-header-wrapper .menu-item > .item-link i.gift{ font-size:1.5rem !important; }

4. and is it possible to Show Wishlist/Cart Quantity on the menu like https://prnt.sc/1j9m074 ?
5. i have added the menu to desktop as well. existing CSS that are not working.

.header-wrapper .et_connect-block .nav-sublist-dropdown { border-style:none !important; } .et_b_header-menu .menu li.menu-disable_titles .nav-sublist-dropdown { background: #333333; } .header-wrapper .et_connect-block .nav-sublist-dropdown .item-link{ color:#ffffff; } .et_b_header-menu .side-menu .nav-sublist-dropdown:not(.nav-sublist) { left:auto; right:0; top: 37px; background-color: #333333; } .et_b_header-menu .menu li.side-menu:hover .nav-sublist-dropdown:before { content: ''; height: 25px; position: absolute; width: 100%; top: -20px; }

Thanks
#297775 Copied
MJ

Participant

August 6, 2021 at 00:47

Any feedback?

#297894 Copied
Olga Barlow

Participant

August 6, 2021 at 12:44
Hello,

1) Menu opened by click means that submenu opens by click on the item link and closes that menu only by click on that item. There is no option to close it by click on the area out of the menu. If you want to customize that you can submit customization request here.
2) a) Check now.
b) It’s not possible to implement using custom CSS only. It requires JS customization. So, submit customization request here.
3) Use

.mobile-header-wrapper .menu-item > .item-link i.et-gift{ font-size: 1.5rem !important; }

4) We don’t have such option. It’s possible to implement only by additional customization.
5) Use the below code

.header-main-wrapper .etheme_widget_menu .nav-sublist-dropdown { border-style:none !important; } .header-main-wrapper .etheme_widget_menu .menu li.menu-disable_titles .nav-sublist-dropdown { background: #333333; } .header-main-wrapper .etheme_widget_menu .nav-sublist-dropdown .item-link{ color:#ffffff; } .header-main-wrapper .etheme_widget_menu .item-design-dropdown .nav-sublist-dropdown .item-link:hover{ color:#f1a01f; }

Regards
#297965 Copied
Viewing 12 results - 1 through 12 (of 12 total)