https://github.com/surdu/selector-to-tag

:hourglass_flowing_sand: Atom package that allows you to create HTML tag elements using CSS selectors in HTML files
https://github.com/surdu/selector-to-tag

atom atom-editor atom-package hacktoberfest

Last synced: 4 months ago
JSON representation

:hourglass_flowing_sand: Atom package that allows you to create HTML tag elements using CSS selectors in HTML files

• Host: GitHub
• URL: https://github.com/surdu/selector-to-tag
• Owner: surdu
• License: mit
• Created: 2015-03-15T21:35:33.000Z (about 11 years ago)
• Default Branch: master
• Last Pushed: 2023-03-05T13:37:31.000Z (about 3 years ago)
• Last Synced: 2023-03-22T22:27:48.263Z (about 3 years ago)
• Topics: atom, atom-editor, atom-package, hacktoberfest
• Language: JavaScript
• Homepage: https://atom.io/packages/selector-to-tag
• Size: 157 KB
• Stars: 45
• Watchers: 2
• Forks: 7
• Open Issues: 3
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGELOG.md
  • License: LICENSE.md

Awesome Lists containing this project

README

          
# Selector to Tag

[![Actions Status](https://github.com/surdu/selector-to-tag/workflows/Tests/badge.svg)](https://github.com/surdu/selector-to-tag/actions)

[![Buy me a coffee](https://raw.githubusercontent.com/surdu/surdu/master/ko-fi.svg)](https://ko-fi.com/surdu)

Selector to Tag is an [Atom editor](https://atom.io/) package that allows you to create HTML tag elements using CSS selectors in HTML files.

Just type a CSS selector and press TAB :

![Demo animation](https://cloud.githubusercontent.com/assets/11520795/6700058/1b18986a-cd11-11e4-9d6a-848b808197c6.gif)

## Supported selectors

For now the following selectors are possible:

Selector          | Output

------------------|------

`foo`             | `` (when `Solve Plain Tags` option is enabled (default `true`))

`foo#bar`         | ``

`#foo`            | `
`

`.foo`            | `
`

`foo.bar`         | ``

`foo.bar.baz`     | ``

`foo#bar.baz`     | ``

`foo#bar.baz.qux` | ``


## Options

 - **File Extensions** - comma separated file extensions in which this package should be active *(Default: "htm, html, kit, shtml, tmpl, tpl, xhtml")*

 - **Only On HTML Grammar** - extension solves tags in any file that have the HTML grammar active. `File extensions` option will be ignored if this is enabled *(Default: false)*

 - **Solve Plain Tags** - this will indicate if this package should also solve to tags when there is no id or class specified in the selector. *(Default: true)*

 - **Close Self-Closing Tags** - Add a backslash before the end of self-closing tags. For example `` will be solved to `` *(Default: false)*

 - **Expand Block Tags To Multiple Lines** - Puts the cursor and end tag on new lines. *(Default: false)*

 - **Block-Level Elements** - If "Expand block tags to multiple lines" is checked, these tags will count as block tags. *(Default: address, article, aside, audio, blockquote, canvas, dd, div, dl, fieldset, figcaption, figure, footer, form, header, hgroup, hr, main, nav, noscript, ol, output, p, pre, section, table, tfoot, ul, video)*

## Support

If you have any sugestions for other selectors or sugestions in general, please submit an issue on GitHub.