The Modifiers Update

The modifiers update marks the next major version of BaseWeb. There has been a re-write of how components and their modifiers are built.

One thing I’ve noticed while writing components is that there is something very similar about how they get modifiers. Typically a component will have a make-[component] mixin which would output the base styles and then some variation of add-[component]-style modifier mixins. This resulted in a lot of unique mixins over the span of components that essentially do the same thing—override or add on to the base styles.

So in an attempt to simplify this process and reduce the amount of mixin bloat across components, I’ve introduced two new mixins: add-styles and add-modifiers. This also led to a standardized way of writing component variable maps as well.

The Updates

• New add-styles mixin
• New add-modifiers mixin
• New chips element component
• New badges block component
• Added chips support for notices block
• Added chips support for off-canvas block
• Updated documentation to use new “contents” feature and format
• Dropped the settings directory and merged the core and settings files
• Simplified the settings file and moved media-query and grid system maps into their respective component files
• Added better demo for show-hide utiltiy classes
• Cleaned up the base styles component and moved the grid system call there
• Updated anchor styles

For more details, check out the dev blog: "The Modifiers Update".

The JavaScript Update

One of the biggest updates since the documentation reboot, say "hello" to the JavaScript update. Included in this update is an overhaul of all JavaScript components along with a brand new icons system.

For more info on this update, check out the dev blog.

Tooltips Have Arrived

I've added a simple component block for tooltips. This allows for very basic use of tooltips without any need for JavaScript. For me information, checkout the docs for tooltips.

Off-Canvas Component Block

This release unveils the new off-canvas component block. Read more about it's implementation and how to use it in the documentation here: http://getbaseweb.com/docs/blocks/off-canvas/

Overrides

The biggest feature in this release is the introduction of overrides! It introduces a new way to update the default component maps in BaseWeb without risking the lose of your customizations when updating to newer versions. For more details on overrides, checkout the docs: http://getbaseweb.com/docs/custom/

• Add source maps!
• Updated buttons to use a single variable for borders instead of the previous three
• Removed references to old button width variable and added one to button-groups map
• Improved the getting-started documentation
• Added build-scripts to documentation
• Update to custom documentation in include overrides feature

The Builds Update

The builds update is where I rewrote the entire build scripts from Jake to Gulp. We cleaned up a lot and fixed a lot of issues in this update. Here are a few:

• Switch task manager to Gulp [fixed #34]
• Created our distribution directory dist and move compiled files out of source [fixed #35]
• Removed the underscore from _baseweb.scss since it's only meant for scss partials. I did the same for the docs styles which were renamed docs.scss [fixed #33]
• Added autoprefixer into build scripts. I still need to purge mixins who's only purpose was to set prefixes [updated #30]
• Added a better way of managing project versioning using the gulp task gulp replace [fixed #31]

New Color Palette

This update introduces our new color palette! I've also gone and updated all components and docs with the updated palette.

Details can be found here: http://getbaseweb.com/docs/settings/palette.html
Inspired by: https://material.io/guidelines/style/color.html

Tabs Update

This update contains the tabs update! The new tabs block component adds the tabs map for customization, two mixins for building tabs and a default tabs output for class based usage.

BaseWeb 2.0 and Documentation Reboot

This has been a long awaited update and I'm so excited that it's finally here! BaseWeb 2.0 now features a freshly built Jekyll powered site and documentation. The time this update is going to save me in maintenance of BaseWeb is going to enable me to focus more on core features, components and keeping things well documented. So lets dive in and see what's new!

New Documentation

Most of the work done on the new documentation has been converting files from the old system to Jekyll. This was mainly taking HTML files and writing them in Markdown as well as creating a better presentation of data. So variables, mixins and functions are now more legible and easier to digest.

The new setup is an awesome foundation to build on top of. I'm hoping that I can make further improvements based on feedback and a few more tools to help navigate it's content more easily. I've already started plans for a table of contents, for instance.

Development Log

One of my favorite additions is finally having a development log. This will enable me to talk a lot more about project decisions, upcoming features, goals and communicate with users more easily. I also hope it can be a platform that enables me to track my journey working on this project. I have learned so much in the process of creating and maintaining BaseWeb. I really want to share that experience with others and grow from it in every way possible.

What's Next?

The main thing I'll be working on is expanding BaseWeb's component library. That's definitely the area that is lacking the most currently. But in addition to that, I'd like to expand on a few core features. For example, I want to add an option for using a grid system that utilizes the CSS flex property. I also want to explore some options for customizing BaseWeb while keeping it updatable and synced with the master branch. Currently, it's a pain to get new features and updates if you've modified component variables. I want to make that process better.

Upcoming Component Blocks

• Modals
• Tabs
• Pagination
• Tooltips

Other Improvements

• Including a way to use BaseWeb with package managers. This is something I'll need to research more of, but I think the easier I can make this project to up and running, the better.
• A way to create a custom download of BaseWeb with toggle-able components.
• I'd like to create a set of example templates using BaseWeb. This would function as both examples of how to put this project into practice, as well as unit tests that I can reference when larger changes are made.

---

I'm very passionate about this project. I've been pouring my knowledge of front-end development into it for years and it's been a huge learning experience for me. But I'm under no delusion in thinking that it's perfect, or even that it ever will be. I would love some input from my fellow developers and users. Let me know what you like about it, and what you hate. I'd love to hear what you think.

New Dropdowns Module!

Added the new dropdowns module! Also made updates to general build scripts and using the latest version of node-sass, node and Jake.