Skip to content
Reflect Emmet HTML expansion in Sass/LESS
Python
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
messages v1.0.2 Apr 4, 2014
.no-sublime-package v1.0.0 Mar 24, 2014
LICENSE Initial commit Mar 24, 2014
README.md v1.0.2 Apr 4, 2014
YouTubeImage.jpg you tube image Mar 25, 2014
emmet_style_reflector.py v1.0.2 Apr 4, 2014
messages.json v1.0.2 Apr 4, 2014

README.md

emmet-style-reflector

Dependency

Obviously, [Emmet] (https://github.com/sergeche/emmet-sublime)

Description

Reflect Emmet HTML expansion in Sass/LESS

How to use

Alt text for your video

Changelogs

v1.0.2

  • tag without class and id will have ">"

Expansions tested

  • Child: #first>ul>li
#first {

    >ul {

        >li {

        }

    }

}
  • Sibling: div+p+blockquote
>div {

}

>p {

}

>blockquote {

}
  • Climb-up: #first+#second>p>span+em^blockquote
#first {

}

#second {

    >p {

        >span {

        }

        >em {

        }

    }

    >blockquote {

    }

}
  • Grouping: #first>(header>ul>li*2>a)+footer>p
#first {

    header {

        >ul {

            >li {

                >a {

                }

            }

        }

    }

    footer {

        >p {

        }

    }

}
  • Video demo: header>(ul#menu>li*5>a)^div#home>div.rensponsive960>div.box>div.title+div.body
header {

    #menu {

        >li {

            >a {

            }

        }

    }

}

#home {

    .rensponsive960 {

        .box {

            .title {

            }

            .body {

            }

        }

    }

}
  • Extreme: #first>(header[title="Hello world!"]>ul#menu>li.menuItem$@-*5>a)+footer{bla bla bla}^script
#first {

    header {

        #menu {

            .menuItem {

                >a {

                }

            }

        }

    }

    footer {

    }

}

script {

}
You can’t perform that action at this time.