WPMU DEV Adding Styling via the Customizer Without Adding CSS to the Page

customizer_function.php

<?php
function wpmu_customize_register( $wp_customize ) {
}
add_action( 'customize_register', 'wpmu_customize_register' );

customizer_section.php

/*******************************************
Section
********************************************/
	
// colors section
$wp_customize->add_section( 'wpmu_colors' , array(
	'title' => __( 'Colors', 'wpmu')
) );

customizer_settings.php

/*******************************************
Color settings
********************************************/

//logo position
$wp_customize->add_setting( 'wpmu_nav_color' );
$wp_customize->add_control( 'wpmu_nav_color', array (
	'label' => 'Navigation Menu Color',
	'section' => 'wpmu_colors',
	'settings' => 'wpmu_header_color',
	'type' => 'radio',
	'choices' => array(
		'blue' => __( 'Blue', 'wpmu' ),
		'red' => __( 'Red', 'wpmu' ),
		'green' => __( 'Green', 'wpmu' ),
	)
));

functions.php

include( get_stylesheet_directory() . '/includes/customizer.php' );

nav_menu_after.php

<nav class="main <?php echo apply_filters( 'wpmu_header_color_css', 'blue' ); ?>">
	<?php wp_nav_menu( array(
		'theme_location' => 'header-menu',
		'container_class' => 'menu'
	) ); ?>
</nav>

nav_menu_before.php

<nav class="main">
	<?php wp_nav_menu( array(
		'theme_location' => 'header-menu',
		'container_class' => 'menu'
	) ); ?>
</nav>

style.css

nav.main.blue
nav.main.blue a {
	background: #312d72;
}
nav.main.red,
nav.main.red a {
	background: #8b1b1b;
}
nav.main.green,
nav.main.green a {
	background: #0e4813;
}

wpmu_header_color.php

function wpmu_header_color( $header_color ) {

	$header_color = get_theme_mod( 'wpmu_header_color', 'blue' );
	
	return $header_color;
		
}
add_filter( 'wpmu_header_color_css' , 'wpmu_header_color' );