Matt
Matt

Reputation: 273

How can I apply a UI framework explicitly rather than globally?

I want to use a UI framework for the admin backend in a Wordpress plugin. Unfortunately, most frameworks apply many styles globally rather than explicitly. These global resets and overrides work well for sites built from the ground up, but they can wreak havoc when implemented into an existing architecture such as the Wordpress backend.

I am looking for a UI framework that is (1) designed to be or (2) can be overridden to be applied only to a given region of the page such as by a class name on a parent div. This would allow me to apply the framework to my specific options regions, while leaving the rest of the backend untouched.

I recently started working with YUI's Pure.css, which has an almost non-existant global reset paired with explicit classes all starting with the 'pure-' prefix. However, this framework is a little more lightweight than I'd like. I am looking for something a little more feature-rich along the lines of Bootstrap or Semantic UI.

Upvotes: 1

Views: 114

Answers (1)

Hans Koch
Hans Koch

Reputation: 4491

You can prefix Bootstrap for example, either way you can handle it with less or prefix them yourself with this tool http://www.css-prefix.com/ since this should work for any framwork

for less you'll need something like this

.yourpluginname-bs {
  @import (less) url("bootstrap.css");
}

Upvotes: 1

Related Questions