Sublime Forum

Strip classes from html code

#1

Hi,

I was wondering if there is any plugin available which makes it possible to strip all classes from a piece of (selected) html content. As a front-end developer I spent a lot of my time writing out classnames in html and then afterwards, write those some classnames again in CSS/LESS. So I was wondering if there is any plugin available which makes it possible to stripdown html content, and the reformat it to empty css code.

Example HTML

<aside class="leftmenu">
     <article class="leftmenu-block">
            <header class="leftmenu-block-header">
                  <span class="leftmenu-block-title">List header</span>
            </header>
            <section class="leftmenu-block-content">
                  <ul class="leftmenu-list">
                         <li class="leftmenu-list-item">
                                  <a href="#">Item 1</a>
                         </li>
                         <li class="leftmenu-list-item">
                                  <a href="#">Item 2</a>
                         </li>
                         <li class="leftmenu-list-item">
                                  <a href="#">Item 3</a>
                         </li>
                  </ul>
            </section>
     </article>
</aside>

What I would like to have is that I will able to select this html, parse it, and get something as follows:

.leftmenu {}
.leftmenu-block {}
.leftmenu-block-header {}
.leftmenu-block-title {}
.leftmenu-block-content {}
.leftmenu-list {}
.leftmenu-list-item {}
0 Likes

#2

Yes, helpful, I added this feature to “Tag” package. CTRL+SHIFT+P “Tag: Get CSS Clases”

0 Likes

#3

Hi Tito,

Thank you very much, tried it out for a few days now and it works splendidly. You`re awesome :smiley: !

0 Likes

#4

Is there a way to modify this so zzz (which I renamed to mySnippet) is highlighted (not .sublime-snippet) so you can just start typing snippet and name and hit enter to save?

0 Likes