Documentation

Appearance

Return to top
On this page

Overview

The overview is your entry point into Style Manager.
Here, you can see all of your selectors that are currently loaded in your project.
This is also where complete imports and exports are made, and also the Project Clean Up

The Overview

Selector List

The selector list gives you a broad overview of your selectors. It displays everything initially, but you can filter the list by the categories found in Project Info.

list

Project Info

Selectors

Displays all standard selectors. These are what are added when you add a class to a component in Oxygen

Custom Selectors

These are added when you manually create a selector in the right-hand panel in Oxygen. These are generally for CSS declarations that can't exist as a standard selector. For example..

h1 + * {
  /*Add margin to h1 element if another block element follows it*/
  margin-bottom: 1em;
}

Active Selectors

Displays Selectors that are currently active and being output to Oxygen's Universal CSS

Unused Selectors

Selectors That aren't currently being used on any component in your project

Missing

Selectors that are currently missing from your project.

Inactive

Selectors that are disabled and not being output in Oxygen's universal CSS

WARNING

This feature relies on the new JSON format in Oxygen 4. Results will not be accurate unless you have converted your shortcodes to JSON.

Project Cleanup

Project Cleanup gives you two operations.

project Cleanup

Quarantine Unused

This will take all unused selectors and place them in a disabled 'Quarantine' folder. This folder is specially created by Style Manager and works a little different to a standard disabled folder in Oxygen. When quarantined, your selectors will maintain a relationship with their original folder, meaning your nicely organised framework will remain intact if they need to be reactivated.

Delete Inactive

Although simply quarantining unused selectors will optimize your site, if you're certain the project does not need the inactive selectors anymore and you have checked the front end to make sure everything is ok, you can completely remove them with this option.

TIP

You can easily make a backup of your selectors before you do this, so completely removing them dosen't have to be so destructive.

File Management

File Management is where you can save your selectors, or import a previously exported set

File management

Import Selectors

This will import a previously exported batch of selectors, including custom selectors and folder. This will overwrite everything currently in Style Manager.

Export Selectors

Exports all selectors, custom selectors and folders currently in the project.

Merge Selectors

This will Import selectors, custom selectors and folder but merge them with existing selectors. If duplicates are found, the original will be preserved.