Source Files
If you are a CleanSlate developer, the WVU Design System is included in your theme files when you request a site. If you’re building a site on a different system, you can download our source files from the Github repo.
The following info is for reference, and can be used to build WVU-branded websites
on other systems.
CDN Links
CSS:
<link rel="stylesheet" href="https://static.wvu.edu/wvu-design-system/wvu-design-system-2.1.1.min.css" type="text/css">Javascript:
<!-- Goes in the <head> of your HTML doc -->
<script src="https://static.wvu.edu/wvu-design-system/meom-wvu-site-navigation--custom-1.0.0.min.js"></script><!-- Goes before the closing </body> tag of your HTML doc -->
<script src="https://static.wvu.edu/wvu-design-system/wvu-design-system-2.0.0.min.js"></script>Bootstrap
The WVU Design System is built on Bootstrap 5 (Version 5.1). See Bootstrap’s documentation for more info.
Fonts
To use our fonts, you must include a link to our font kit before your closing
</body> tag.
<script src="https://fast.fonts.net/jsapi/36d8cd92-7cc7-499b-b169-0eed9d670283.js"></script>Icons
We use
Font Awesome 6 Pro for our icons. You can include our icon kit by including
the following code into the
<head></head> of your HTML.
<script data-search-pseudo-elements defer src="https://kit.fontawesome.com/a140e17a00.js" crossorigin="anonymous"></script>Testing Fonts and Icons
If you’re testing on a domain that is not a *.wvu.edu domain, we need
to whitelist your domain. Contact
UR - Digital to set this up.
Can I use the WVU Design System 2.0 on an older theme?
No. While some new features have been applied to first-generation Liquid themes (those created before July 15, 2022), the Design System 2.0 isn’t backwards compatible, since Bootstrap 5 and FontAwesome 6 aren’t backwards compatible. For Shared CleanSlate Partials, we have several new components, as well as new region names for existing components, that could also break older sites.