How to custom bullet points – Affinity theme

  • Unknown's avatar

    Hi!
    I need some help on Affinity theme.
    I would like to custom bullet points which are on the right of the home page. I would like to remove these bullet points and replace them by an arrow to show that we need to scroll…
    Is it possible to do it with CSS and how?
    Thanks!
    C.

    The blog I need help with is: (visible only to logged in users)

  • Hi there,

    Are you speaking of the floating site menu along the right edge of the page?

    Those diamond shapes are not bullets, but text characters added within the HTML of the theme. It’s not possible to change those using CSS.

    From the other threads you created asking for help with this same theme:

    I would like to center the 3 widgets columns in the footer’s width. It looks like they are more on the right…

    This theme is designed to show the widget on the left at 50% of the available width, with the other two at 20%, but they’re already centered. What you can do is force them all to be the same width:

    /* Make footer widgets equal width */
    @media screen and (min-width: 58em) {
    	.footer-widgets .widget-areas .widget-area:nth-child(1):nth-last-child(3), .footer-widgets .widget-areas .widget-area:nth-child(2):nth-last-child(2), .footer-widgets .widget-areas .widget-area:nth-child(3):nth-last-child(1) {
        width: 30%;
      }
    }
    

    I would like to custom quote block (font-color, font-size, background-color, border radius…).

    Your site appears to currently be set to the classic editor, not the block editor. Can you please give a link to a post or page on your site where you have content added using a quote block?

    I would like to custom widget titles (color, size…).

    /* Change color and font size of footer widget titles */
    .footer-widgets .widget-title {
    	font-size: 200%;
    	color: blue;
    }

    I also wanted to change text color. It worked except for the recent posts text. I don’t know why… any idea?

    The text in the Recent Posts widget are all links, so you need to target the a element within the widget:

    /* Change text color of recent posts widget links */
    .widget_recent_entries a {
    	color: #ae2222;
    }

    If you have any other questions, feel free to add them to this thread, or else please wait for one CSS thread to be resolved before you start a new one. Also note that your premium plan gives you access to live chat support for help with questions like these.

  • Unknown's avatar

    Hi!
    Thank you sooooooo much!!!!
    Everything worked! I understand for the diamonds.
    I don’t use the new editor because it’s a beta version and it doesn’t work very well… It’s my opinion, if course.
    For the quote, I would like to customize the basic quote tag.
    Do you think it’s possible?
    I’m so grateful.
    Thanks,
    C.

  • Unknown's avatar

    Hi again!
    I found how to do it…

    blockquote {
    background-color: #ae2222;
    padding: 10px;
    border-radius: 8px;
    text-align: center;
    }

    Have a nice day!
    Thanks again,
    C.

  • Perfect :)

    Happy to help!

  • The topic ‘How to custom bullet points – Affinity theme’ is closed to new replies.