Skip to content

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

License

Notifications You must be signed in to change notification settings

seothemes/css-splitter

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

10 Commits
 
 
 
 
 
 

Repository files navigation

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.

About

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

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages