Codebase

Version 4.0.11

Codebase 4 has been superceded by Codebase 5. See https://github.com/codebase-frontend-library/codebase-5

Features

Designed as a frontend CSS/JS codebase for content management system themes and static site generator projects
Just use it in your HTML: no NPM or other installation required – no config – no need to purge unused CSS
Small but powerful CSS:
- Base (default light theme only): codebase.css (38 KB)
- With dark and light theme CSS classes: codebase-l-d.css (64 KB)
JS options:
- Use Codebase’s own vanilla JavaScript activator.js (3 KB) for dropdowns, modals, tabs etc. (jQuery version also available for older browsers)
- Alternatively, use AlpineJS for more component functionality
Sass (SCSS) library
Responsive layouts and typography
Does most things most web designers want:
- Columnar grid system (uses CSS grid)
- Flexbox system
- Utility classes for layout positioning, dimensions, overflows, etc.
- Utility classes for decoration and enhanced typography, using a soft element grid (0.5rem units)
- “Utility first” approach for building HTML components.
Highly customizable
Modern browser compatible
Extensive documentation

Production Codebase CSS and Activator JS (ES5) are in the Docs dist/ folder - see https://github.com/codebase-frontend-library/codebase-4/tree/master/docs/dist

Codebase SCSS and Activator JS ES6 are in the Source codebase/ folder - see https://github.com/codebase-frontend-library/codebase-4/tree/master/src/codebase

If you still need to support Internet Explorer 11 – Codebase can do that, although IE11 is not officially supported by Codebase. There are some things with IE11 that you can’t do; and if you want to use Activator then you need to switch to using jQuery v.2.x and alpine.jquery.js. For more information See Codebase and Internet Explorer 11.

Codebase CSS and Activator JS have been built using Gulp with plugins for Sass and Babel. Documentation has been built using Eleventy. Docs demo icons are from Tabler icons.