Text objects in Vim are very useful. They allow you to modify text by word, sentence, paragraph, HTML tag, and more. vim-textobj-user is a Vim plugin that lets you define your own text objects and this project builds on that one to let you work with CSS blocks more easily.
vic
Visually select inner CSS (inner rules)vac
Viscually select "all" CSS (entire block w/ selector(s))cic
Change inner CSScac
Change "all" CSSdic
Delete inner CSSdac
Delete "all" CSS
It's often handy to visually select a nested CSS block with vac
and then type ac
again to expand the selection to the parent block. This is shown in the above GIF.
vim-gitgutter supplies some text objects for dealing with hunks and these conflict with vim-textobj-css. As the vim-gitgutter README describes, you can override those settings with something like:
omap ih <Plug>GitGutterTextObjectInnerPending
omap ah <Plug>GitGutterTextObjectOuterPending
xmap ih <Plug>GitGutterTextObjectInnerVisual
xmap ah <Plug>GitGutterTextObjectOuterVisual
This plugin requires vim-textobj-user. Use your favorite plugin manager to add these lines.
Plug 'kana/vim-textobj-user'
Plug 'jasonlong/vim-textobj-css'
NeoBundle 'kana/vim-textobj-user'
NeoBundle 'jasonlong/vim-textobj-css'
Plugin 'kana/vim-textobj-user'
Plugin 'jasonlong/vim-textobj-css'