With CSS injection, the styles are immediately reflected even in that open modal. Without CSS injection, in order to see those new styles you’d have to refresh the page, thus closing the modal (probably) and then you’d have to open click to open the modal again. Boomerang) isn’t nearly as fast as just ripping out some styles and plopping in new ones. From the editor to the PRO views like Live View. ![]() We’re doing this on CodePen now! Everywhere, too. The injection part means that the page doesn’t refresh when the styles change, which is cool because 1) it’s fast and 2) the state of the page is maintained. It’s a setup in which you author CSS while looking at a live preview of a page, and that preview updates as you change things. I bet a lot of you front end developers know all about CSS injection (or “ Style Injection“). Get in touch with support if you have further questions. CodePen is an ever changing place, so if this post references features, you're probably better off checking the docs. Search for livestyle-atom plugin and install it.Heads up! This blog post hasn't been updated in over 2 years.In the end, your file structure should look like this:Ītom plugin is available for beta-testing so it must be installed manually (no installation from LiveStyle app yet).Download and unpack plugin code archive into newly created LiveStyle folder.Create LiveStyle folder in opened Packages one.It will open Packages folder in your file browser. In Sublime Text, pick Preferences > Browse Packages.If you can’t or don’t want to use Package Control, you can try a completely manual installation: Manual installation of Sublime Text plugin You may want to restart Sublime Text to ensure that everything works fine. ![]() In a moment LiveStyle plugin will be installed. Type livestyle to find LiveStyle package and hit Enter. When loaded, you’ll see a dialog window with list of available packages.Wait for a few seconds while Package Control loads list of available packages.In opened dialog, type install package to find Package Control: Install Package menu item.In Sublime Text, pick Tools > Command Palette.Install Package Control as described (if you didn’t installed it yet).This is a preferred way to install Sublime Text plugins: Package Control will manage all installation process and automatic updates for you. The easiest way to install Sublime Text plugin is via Package Control. ![]() When installed, you’ll see a LiveStyle icon in Chrome toolbar:
0 Comments
Leave a Reply. |