Using uk-background styling from the Uikit components

Hello all

I've just started updating my old Wordpress site with the beans child theme and am getting a little stuck on the header; i.e I haven't got very far yet! Bear with me - I'm only a few days into using Beans, but a few years ago I got the hang of Wordpress, PHP and CSS enough to get by.

As the same header is being used across my entire site I have been making the changes to my functions.php file. What I am trying to achieve is have a background image centered behind my site title. I've been trying to achieve this using the background utility classes from Uikit.. I'm well aware that I could simply style it using CSS but was hoping to just add the attributes into the beans header ID like this:

beans_add_attribute( 'beans_header', 'class', 'header-background uk-background-norepeat' );

In my style.css I'd add the image like this:

.header-background {
    background: url(images/bkgrnd_01.png);
    }

From what I've read, it appears that these background utitlity classes (such as .uk-background-norepeat and .uk-background-top-center fall into the category of Add-ons as described in the Beans Documentation.

So I've seen a bunch of examples here enqueueing UIkit components and thought that this would be enough to add to my functions.php:

add_action( 'beans_uikit_enqueue_scripts', 'beans_child_enqueue_uikit_assets' );

    function beans_child_enqueue_uikit_assets() {
    beans_compiler_add_fragment( 'uikit', get_stylesheet_directory_uri() . '/style.less', 'less' );
    beans_uikit_enqueue_components( 'background' );
}

It didn't work. I've also tried replacing "background" in the beans_uikit_enqueue_scripts with "add-ons", "grid", etc but no joy on any.

Then I happened to come across this example and I tried examing the source code for any hints as to what it was calling up: https://getuikit.com/assets/uikit/tests/background.html (funnily it only worked in my Firefox browser, not my Chrome browser). The styling for the background utility classes comes from within the uikit-core.css file. There's no sign of this within my wordpress beans, or beans-child themes.

So my question is, how can I call up and use these background utility classes?

Cheers,

Henry...