Separator customisation

Okay so I’m using the Astrid Theme, but I’m using it primarily through the page block editor, rather than through widgets etc as the setup guide suggests.
The main problem I’m having is with the Separator block; it is entirely invisible because of the colour and line thickness imposed by the stylesheet.
I am also unable to utilise the options for short separator or full width separator. No matter what colour or separator style I choose using the block editor, it gets overridden to display the 1px #eeeeee full width theme default hr separator. While the theme separator looks pretty slick, its too thin and pale to show up on my pastel page background.

I had a wander through the code, but can’t seem to find a single thing to change that theme override.

I was wondering if there is any kind of code snippet i could insert, either to the overall theme additional CSS section, or to the individual block additional CSS to make it default back to the wordpress blocks separator, or is this the kinda thing that I have to dig into editing the code for?

Hello,

I would be glad to help you, but can you please first provide some explanatory screenshots and a link to your website in order to let me check it with the browser tools? You can use some link shortener if you don’t want to leave the link to your site in this topic.

Kind Regards, Roman.
aThemes Support

Hey Roman
My website is below;
shorturl.at/cquAJ
In both the commissioned works and personal projects sections, each entry has a separator between them, (as well as a seperator before the commissioned works) But they barely show on the coloured background.

That link doesn’t seem to be valid, can you please check it?

Kind Regards, Roman.
aThemes Support

Hello, and thank you for the link.

You can try to add this CSS code in the Customize → Additional CSS section:

.content-area hr {
    border-width: 3px;
    border-color: #000;
}

Please feel free to ask any other questions that you might have.

Kind Regards, Roman.
aThemes Support

Thank you Roman, this does make the separator visible, and Ive implemented it with some softer colours than pure #000;
Though it doesnt return control of the hr element to the block editor, this definitely works for now.
(im assuming that wrangling it back into the block editor would require making a child theme and removing from the code, rather than merely adding to the additional css box?)
Thanks~

You are welcome!

im assuming that wrangling it back into the block editor would require making a child theme and removing from the code, rather than merely adding to the additional css box?

I’m not sure what exactly you want to do, but I think that the child theme is always a good idea when you modify something.

Kind Regards, Roman.
aThemes Support