Skip to content

Postcss-hocus fixes a tiny but annoying part of CSS: That you have to repeat yourself whenever you want to specify both `:hover` and `:focus`.

License

Notifications You must be signed in to change notification settings

Kilian/postcss-hocus

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

2 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Postcss-hocus PostCSS Logo

Postcss-hocus fixes a tiny but annoying part of CSS: That you have to repeat yourself whenever you want to specify both :hover and :focus. Instead, you write a:hocus:

/* before */
a:hocus {
	color: red;
}

/* after */
a:hover,a:focus {
	color: red;
}

Additionally, you can write a:pocus to include the :active style:

/* before */
a:pocus {
	color: red;
}

/* after */
a:hover,a:active,a:focus {
	color: red;
}

Usage

Add postcss-hocus using npm:

npm install postcss-hocus --save-dev

Then add in your PostCSS Config:

postcss([
	require('postcss-hocus')
]);

About

Postcss-hocus fixes a tiny but annoying part of CSS: That you have to repeat yourself whenever you want to specify both `:hover` and `:focus`.

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages