Hi,

Please try this for the sidebar lists:

.sidebar .widget ul {
    padding-left: 18px;
    list-style: disc;
}

I can’t see any specific styling being applied to this text:

At Live Edge Wood Craft, we work hard to make sure our customers have a great experience. Whether you’re a craftsman looking for live edge slabs to use in your customer’s project, or a consumer looking for live edge slabs or custom furniture, you’ll get the best from us.

That means it will get the default styling of 13 pixels from the theme. If you want to change the default font size, then you can do so under Enfold->General Styling->Typography. If you want specific styling for that paragraph only, then you can do it manually like this:

<p style="font-size: 16px;">Your text goes here</p>

Best regards,
Rikard

Hey bhardy2022,

Thank you for the inquiry.

You can use this css code to adjust the style of the scroll-to top link.

#scroll-top-link {
    position: fixed;
    border-radius: 2px;
    height: 60px;
    width: 60px;
    line-height: 60px;
    text-decoration: none;
    text-align: center;
    opacity: 0;
    right: 50px;
    bottom: 50px;
    z-index: 1030;
    visibility: hidden;
    font-weight: bold;
    font-size: 30px;
}

Please make sure to toggle or temporarily disable the Enfold > Performance > File Compression settings after adding the css.

Best regards,
Ismael

Hi,

Thank you for the screenshot.

We can decrease the font size and adjust the word-wrap property to make sure that whole words break into the next line instead of single characters.

@media only screen and (max-width: 767px) {
  /* Add your Mobile Styles here */
  .avia-promocontent h1 span {
    word-break: break-word;
    font-size: 20px;
  }
}

Expected result: https://1drv.ms/u/s!AjjTfXSRbKTvwFtJsaq9EhFLeQzO?e=ZerX9i

Best regards,
Ismael

Hey Sabine,

Please add following code to Quick CSS field in Enfold theme options > General Styling tab and adjust the font size (“18px”) as needed

@media only screen and (max-width: 480px) {
#top .all_colors mark {
  font-size: 18px;
}
}

Regards,
Yigit

Hi,

Thank you for reporting this – and very sorry for the problems.

Icon Grid problem should be solved – please check your staging site. Was caused by a wrong selector to apply the selected font size (resulted in a wrong padding).

Widget problem also solved for ALB Widget area.

Already added for next update 4.9.2.2 which is planned in the next days.

If you do not want to wait you can copy the 2 modified files (do not forget to make backups of the original files for a fallback):

enfold\config-templatebuilder\avia-shortcodes\icongrid\icongrid.php
enfold\config-templatebuilder\avia-shortcodes\widgetarea\widgetarea.php

And you need to save theme options to invalidate the post css files and clear server and browser cache.

Best regards,
Günter

Hey Sabine,

I’m not sure I understand your question. Do want to replace the actual tag, or simply change the font size on mobile devices? If you need further help, then please post a link to where we can see the actual element.

Best regards,
Rikard

Hi,

Please try this in Quick CSS:

@media only screen and (max-width: 767px) {
.html_header_transparency #top .avia-builder-el-0 .slideshow_caption {
    padding-top: 30px;
}
.slideshow_caption h2.avia-caption-title {
    font-size: 26px; 
}
.slideshow_caption .avia-caption-content p {
    font-size: 18px;
}
}

Best regards,
Rikard

Hey virtualbis,
Try adding this code to your Header Phone Number/Extra Info area:

<ul class="account"><li class="login"><a href="/my-account/">[av_font_icon icon='ue824' font='entypo-fontello' size='20px'][/av_font_icon] Login</a></li><li class="logout"><a href="/my-account/customer-logout/">[av_font_icon icon='ue825' font='entypo-fontello' size='20px'][/av_font_icon] Logout</a></li></ul>

you may need to adjust the url to your specific login and logout urls.
Then add this code in the General Styling ▸ Quick CSS field or in the WordPress ▸ Customize ▸ Additional CSS field:

#top .account  {list-style: none;}
#top .account li { display: inline-block;}
#top.logged-in .account .login {display: none;}
#top:not(.logged-in) .account .logout {display: none;}

After applying the css, please clear your browser cache and check.

Best regards,
Mike

Hey MarynaKudzinava,
Are you using the masonry setting: Sorting ▸ Yes, display sort options and are referring to the “All” at the start?

try this css for the masonry sort of the blog and portfolio:

.av-portfolio-grid-sorting-container .all_sort_button,
.av-masonry-sort .all_sort_button {
	font-size: 16px;
    color: red !important; 
}

But if you mean the setting: Sorting ▸ Yes, display sort options and currently active taxonomy and are referring to the current sort title

then try this css for the masonry sort title of the blog and portfolio:

.av-portfolio-grid-sorting-container .all_sort_button,
.av-portfolio-grid-sorting-container .av-current-sort-title,
.av-masonry-sort .all_sort_button,
.av-masonry-sort .av-current-sort-title {
	font-size: 16px;
    color: red !important; 
}

After applying the css, please clear your browser cache and check, then link to your two elements and explain if you mean the “All” at the start or current sort title for replacing the words.
Please note that the current sort title changes depending on the sort clicked, it doesn’t always show “All” so replacing it with the word “Portfolio” or “Blog” would change this behavior.

Best regards,
Mike

Hi Michaela,

Which settings exactly are not applying? You haven’t set any sizes other than standard for all the headers in the Typography section. I see that you have added some custom CSS in Quick CSS as well, and that is applying to your h6 on the front page for example:

@media only screen and (max-width: 480px) {
h1 { font-size: 38px !important; }
h3 { font-size: 18px !important; }
h4 { font-size: 40px !important; }
h6 { font-size: 55px !important; }
}

If you use important in your CSS statements, then that will override the theme settings.

Best regards,
Rikard

Hey hmichaela,

Please try the following in Quick CSS under Enfold->General Styling:

@media only screen and (max-width: 767px) {
h6.avia-caption-title {
  font-size: 62px; 
}
}

If you are looking to set your headers to different sizes on mobile screens, then you can do so under Enfold->General Styling->Typography.

Best regards,
Rikard

Hi,
Thanks for the feedback, do you mean the title in the screenshot in the Private Content area?
Please try this code in the General Styling ▸ Quick CSS field or in the WordPress ▸ Customize ▸ Additional CSS field:

.html_modern-blog #main .avia-content-slider .slide-entry-title {
    font-size: 24px;
}

After applying the css, please clear your browser cache and check.
Please note that testing with Safari can be hard to clear the cache, often you need to also clear the history to fully purge the cache, following these steps for Safari and note Step 4 where you will Clear the History.

Best regards,
Mike

Hi Claudia,

Please try the following in Quick CSS under Enfold->General Styling:

.html_modern-blog .avia-content-slider .slide-entry-title {
    font-size: 24px;
}

Best regards,
Rikard

Hi,
Thanks for the link to your page, I found your border to not include the radius but it was working from what you added to the child theme stylesheet, I added the radius to your rule with a little padding and also testing it in your Quick CSS and it works in both places:

.av-masonry-sort a {
    border: solid 2px black;
	border-radius: 25px;
	padding: 0 10px;
}

so I imagine the issue was your caching plugins, which is a common issue, I recommend to disable your caching while building your site and when it is done then enable it.
As for the font size of your masonry content, in your Quick CSS had the size set to: font-size: 0.5em; which is very small, so I changed it to font-size: 1.5em; to match your title, so the Quick CSS is working, what size do you want it to be?
I test with Chrome on Windows, if you are testing with Safari it can be hard to clear the cache, often you need to also clear the history to fully purge the cache, following these steps for Safari and note Step 4 where you will Clear the History.

Best regards,
Mike

Hey rkshorty,
Thanks for the code but in my test I get the error OPWIDGET is not defined I tried to research on the openpetition.de site but couldn’t find a code example, are you sure this code is correct?

<script src="https://www.openpetition.de/javascript/widget.js"></script>
<noscript>Bitte aktivieren Sie JavaScript und laden die Seite neu.</noscript>
<script>
var OPWIDGET = {
"base_url": "https://www.openpetition.de",
"api_key": "3864e7409744603ac4147f7756deac6fcdee2be45a4c7d2deb6efa43591168f7",
"options": {
"primarycolor": "#e07d28", 
"secondarycolor": "#6c6c6c",
"backgroundcolor": "#ffffff",
"mainfontsize": "12px",
"language": "de_DE.utf8"
}
};
</script>

Best regards,
Mike