Skip to content

Latest commit

 

History

History
53 lines (40 loc) · 1.83 KB

README.md

File metadata and controls

53 lines (40 loc) · 1.83 KB
Raw

CSS Splitter

Splits Genesis child theme CSS, SCSS or Sass file into partials.

Basic script that separates standard Genesis child theme stylesheet into partial files. The script looks for section comments in the file starting with '/* # ' and will break these sections into separate files. It then moves the partials into a scss directory, renames them to match the name of the section and generates an index.scss file.

Requirements

Requirement How to Check How to Install
Bash 4.x bash --version Install Bash
Split split -h Split Manual

Instructions

From the Terminal, navigate into your theme's root directory:

cd project/wp-content/themes/theme

Copy the script to your theme file:

wget https://raw.githubusercontent.com/seothemes/css-splitter/master/split.sh

Pro Tip: Before splitting a file, you can convert CSS to SCSS either manually or using a tool such as http://css2sass.herokuapp.com/

Run the following command, changing 'style.css' if necessary. The Terminal will prompt you to enter the system user password.

sh split.sh style.css

To further split the partials into components, move the split.sh script into the scss/ directory. Edit the script in your favorite text editor and change the '/\*\ #\ ' regex string to '/\*\ ##\ '. This will target all smaller sections to be split.