Globals is Bellevue College's unified style and reusable content library. Globals is deployed across all production and test web servers.
Based on Bootstrap 2, Globals 2 was our first Bootstrap-based version of Globals. Globals 2 does not use any build framework, and exists entirely within the /g/2/
directory.
Based on Bootstrap 3, Globals 3 is our current primary framework for public-facing sites. Globals 3 uses the Bootstrap Sass official fork of Bootstrap 3, with Gulp being used as a build system.
Deprecated: While Globals 3 is still maintained, any new projects should be built on Globals 4, and older projects should be converted where possible.
- Bootstrap Sass is the core of Globals 3
- Bootstrap Accessibility Plugin. Globals 3 uses significant parts of the Bootstrap Accessibility Plugin, but does not include the entire project.
- Modernizr is used for feature detection to provide fallback for elements like FlexBox.
- Respond JS Media Query polyfill
- In addition, the following development tools are used:
- Node Package Manager for package management
- Gulp for build tasks
- Gulp Notify - desktop notifications
- Gulp Sourcemaps - sourcemaps to allow for troubleshooting
- Gulp Autoprefixer - browser prefixing
- Gulp Concat - merge files
- Gulp Rename - rename files
- Gulp Uglify - minify CSS and JS
- Uglify Save License - save license comments when minifying
Based on Bootstrap 4, Globals 4 is ready for production use. Globals 4 Boostrap's native Sass implementation, with Gulp being used as a build system.
- Bootstrap is the core of Globals 4
- FontAwesome Free provides icons (replacing Glyphicons in Globals 3)
- In addition, the following development tools are used:
- Node Package Manager for package management
- Gulp for build tasks
- Gulp Notify - desktop notifications
- Gulp Sourcemaps - sourcemaps to allow for troubleshooting
- Gulp Autoprefixer - browser prefixing
- Gulp Concat - merge files
- Gulp Rename - rename files
- Gulp Uglify - minify CSS and JS
- Uglify Save License - save license comments when minifying
- Modernizr, Respond JS and Bootstrap Accessibility Plugin have been removed from Globals 4
- browserlist-stats.json - contains browser usage from Google Analytics
- This can be generated using BrowserList-GA by running
npx browserslist-ga
- This can be generated using BrowserList-GA by running
- /src/{version}/gulpfile.js - Gulp processes
- package.json - npm dependancies
-
src/{version}/javascripts/
jquery.swiftype.autocomplete.js
- forked version of Swiftype Autocomplete.custom.js
- Custom JS
-
src/{version}/sass/
g.scss
- master SCSS file; calls all partialspartials/
- all SCSS partials_base.scss
- includes and configures variables and outside libraries_bootstrap-overrides.scss
- core over-rides of bootstrap- ... etc
g/
- production files2/
- legacy globals 2 files3/
- globals 3 filesc/
- cssg.css
- primary CSS filep.css
- print CSS
f/
- fonts from Bootstraph/
- HTML assetsi/
- Image assetsj/
- JavaScript assetsbootstrap.min.js
- bootstrap jsg.js
- globals footer scripts (without bootstrap included)gfoot-full.js
/ gfoot-full.min.js - combined footer scriptsghead-full.js
/ ghead-full.min.js - combined header scriptsghead.js
- Modernizrrespond.js
- respond library
4/
- globals 4 filesc/
- cssg.css
- primary CSS file
f/
- fonts from FontAwesomeh/
- HTML assetsi/
- Image assetsj/
- JavaScript assetsgfoot-full.js
/gfoot-full.min.js
- combined footer scriptsghead-full.js
/ghead-full.min.js
- combined header scripts
Globals 3 and 4 depend on NPM and Gulp for dependency and build management.
- Install Node.js on your computer (needed for npm)
- Mac: If you have Homebrew installed, try
brew install node
- Mac: If you have Homebrew installed, try
- From the command line,
cd
to the repository and runnpm install
to install dependencies- Windows: It is recommended that you use Command Prompt or PowerShell (not Git Bash)
- Install Gulp globally so that your commands work-
npm install gulp-cli -g
- The following commands will now be available from within
/src/3
and/src/4
:gulp
- Compiles for productiongulp dev
- Compiles for devgulp watch
- Watches for changes in SCSS files, and compiles to CSS and JS.
Commands are all configured in gulpfile.js. Dependencies (and versions) are listed in package.json. Note that Gulp is configured separately for Globals 3 and 4, but package management is centralized.
Example Commands
cd src/4
gulp watch