-
AuthorPosts
-
December 21, 2023 at 12:08 am #1428634
Hello everybody,
I have a customer with some special needs.First of all, I put a link in the main menue which leads the user to the footer section of the start page. Problem: now is the active item always the one item with the footer link… :-( Have you an idea how to fix it, so that the active item changes according to the browsed page?
The overview of the portfolio on the start page: every item should have a red background in the text section – just like it is used in the old customer page: My CSS skills are not good enough to do that. Have you a solution?
And in the head of the website, e-mail adress and phone number should be in the same row. I tried, but it didn’t work. Can you fix it, please?
Last but not least: the image of each team member should be a little bit bigger on mouseover. Is that possible and how?
Thank you very much for your help.
Kind regards,
KatiDecember 24, 2023 at 2:55 pm #1428850Hey Katja,
Thank you for the link to your test site, it looks like your footer link has been added as a custom menu item with a full url, please try to use only the footer ID like this:
In my test on my site this solves the issue you are having.
For the portfolio section try this CSS in your Enfold Theme Options ▸ General Styling ▸ Quick CSS field:#portfoliobeschriftung .main_color .grid-content, #portfoliobeschriftung .main_color .grid-content * { background-color: #e2001a; color: #fff; }
Your email link and phone number in the header has two line break tags (BR), try to remove these and then add this css:
.phone-info .infos a { display: inline; } .phone-info .infos a .avia-icon-pos-left { float: none; display: inline; }
If you can’t remove the line break tags, then try this css:
.phone-info .infos br { display: none; } .phone-info .infos a { display: inline; } .phone-info .infos a .avia-icon-pos-left { float: none; display: inline; }
To have the team membert images increase in size on hover, try this css:
#team .avia-team-member img { animation: growout 2s; animation-fill-mode: forwards; } #team .avia-team-member:hover img { animation: growin 2s; animation-fill-mode: forwards; } @keyframes growin { from {transform: scale(1)} to {transform: scale(1.2)} } @keyframes growout { from {transform: scale(1.2)} to {transform: scale(1)} }
Best regards,
MikeJanuary 3, 2024 at 7:07 pm #1429204Hello Mike,
happy new year and thanks a lot – nearly everything is working! That’s great!!!
Perhaps can we have a little less height for the “portfoliobeschriftung”? The height of the red area is a bit too much.
The only thing that still causes trouble is ‘Anfahrt’. It is still active permanently in Google Chrome and Firefox – Safari works. Do you have any ideas how to solve that?
Best regards,
Kati- This reply was modified 11 months, 3 weeks ago by KittenAdmin.
January 4, 2024 at 2:05 am #1429224Hi,
Thank you for the update.
Perhaps can we have a little less height for the “portfoliobeschriftung”? The height of the red area is a bit too much.
You can adjust the space around the portfolio title with this css code.
.grid-content { padding: 10px; }
The only thing that still causes trouble is ‘Anfahrt’.
Please edit the menu items in the Appearance > Menus panel and try to replace the anchor #anfahrt with #footer. Let us know if this helps.
Best regards,
IsmaelJanuary 4, 2024 at 8:34 am #1429243Hello Ismael,
thank you for the reply – that solved all problems! :-)
Can I have a little more space between the pic and the text with red background color in the portfolio grid?
And the last little thing for this post: could you change the screenshot image?
Best regards,
Kati- This reply was modified 11 months, 3 weeks ago by KittenAdmin.
January 4, 2024 at 11:26 am #1429254Hi,
If I understand what you mean, you can’t have more space between the image and the red block because together they make one portfolio grid element, changing the height will break the portfolio grid layout.
I think your last question is asking to remove the screenshot above, so I did.Best regards,
Mike -
AuthorPosts
- You must be logged in to reply to this topic.