Skip to main content
Oregon.gov Homepage

Agency CSS Overwrites - Color Blocks

This page defines the additional modification options the Oregon Department of Education available in the Agency.CSS overwrites.

NOTE: as usual, to view any of the full code used to generate this page, right click and View Source - then look for the area you want to view (Chrome - others search View Source and the browser for directions).


ODE Custom Color Block Classes

These classes were created to help you draw attention to areas, without embedding Image Text - which are accessibility errors.

            
<a href="https://wildfire.oregon.gov/"> <div class="colorBlock-odeBlue odeH1"> <h2>Wildlife Resources</h2> </div> </a> <a href="/ode/accessibility/Pages/test"> <p class="colorBlock-odeBlueSub">Some test text goes here.</p></a>

Wildfire Resources

Some test text goes here.

            
<div class="colorBlock-odeBlue odeH1"> <h2>Wildfire Resources</h2> </div> <p class="colorBlock-odeBlueSub">Some test text goes here.</p>

Wildfire Resources

            
<h2 class="colorBlock-odeBlue odeH1">Wildfire Resources</h2>
            
<a href="https://wildfire.oregon.gov/"> <p class="colorBlock-odeBlue odeH1">Wildfire Resources</p></a>

Wildfire Resources

            
<p class="colorBlock-odeBlue odeH1">Wildfire Resources</p>

Bootstrap Color Classes

These are color classes built into the bootstrap templates. WATCH FOR CONTRAST ISSUES - especially look out for link related background and font color issues... if you find problems, use different (safer) combination.

bg-secondary text-white

The bootstrap color class for this section is inheriting from the mentioned title.

bg-success text-white

The bootstrap color class for this section is inheriting from the mentioned title.

bg-danger text-white

The bootstrap color class for this section is inheriting from the mentioned title.

bg-warning text-dark

The bootstrap color class for this section is inheriting from the mentioned title.

bg-info text-white

The bootstrap color class for this section is inheriting from the mentioned title.

bg-light text-dark

The bootstrap color class for this section is inheriting from the mentioned title.

bg-white text-dark

The bootstrap color class for this section is inheriting from the mentioned title.

NO LINK : bg-dark text-white

The NO LINK bootstrap color class for this section is inheriting from the mentioned title.

NO LINK : bg-primary text-white

The NO LINK bootstrap color class for this section is inheriting from the mentioned title.


Custom/Bootstrap Combo Classes

            
            
            
            
            <a href="https://wildfire.oregon.gov/"> <div class="odeH1"> <h2>Wildfire Resources</h2> </div></a><a href="/ode/accessibility/Pages/test"> <p class="colorBlockOrangeSub">Some test text goes here.</p></a>