Skip to content

Commit

Permalink
Broke off chunks of README.md into docs/
Browse files Browse the repository at this point in the history
  • Loading branch information
@rstacruz
rstacruz committed Dec 29, 2009
1 parent e23784f commit 383504e
Show file tree
Hide file tree
Showing 3 changed files with 128 additions and 101 deletions.
100 changes: 1 addition & 99 deletions README.md
View file
Expand Up @@ -26,102 +26,4 @@ What it will do:
- Create a directory called `sparkup-<version>/`
- Put the packaged, ready-to-use plugins there
- Inject the version number (from the file `VERSION`) to the copies of sparkup.py in that directory
- Create a redistributable ZIP file (s`parkup-<version>.zip`)

Usage and installation
----------------------
You may download Sparkup from Github. [Download the latest version here](http://github.com/rstacruz/sparkup/downloads).

- **TextMate**: Simply double-click on the `Sparkup.tmbundle` package in Finder. This
will install it automatically. In TextMate, open an HTML file (orset the document type to
HTML) type in something (e.g., `#header > h1`), then press `Ctrl` + `E`. Pressing `Tab`
will cycle through empty elements.

- **VIM**: See the `vim/README.txt` file for details.

- **Others/command line use**: You may put `sparkup` in your `$PATH` somewhere. You may then
invoke it by typing `echo "(input here)" | sparkup`, or `sparkup --help` for a list of commands.


Examples
--------

**`div`** expands to:
<div></div>

**`div#header`** expands to:
<div id="header"></div>

**`div.align-left#header`** expands to:
<div id="header" class="align-left"></div>

**`div#header + div#footer`** expands to:
<div id="header"></div>
<div id="footer"></div>

**`#menu > ul`** expands to:
<div id="menu">
<ul></ul>
</div>

**`#menu > h3 + ul`** expands to:
<div id="menu">
<h3></h3>
<ul></ul>
</div>

**`#header > h1{Welcome to our site}`** expands to:
<div id="header">
<h1>Welcome to our site</h1>
</div>

**`a[href=index.html]{Home}`** expands to:
<a href="index.html">Home</a>

**`ul > li*3`** expands to:
<ul>
<li></li>
<li></li>
<li></li>
</ul>

**`ul > li.item-$*3`** expands to:
<ul>
<li class="item-1"></li>
<li class="item-2"></li>
<li class="item-3"></li>
</ul>

**`ul > li.item-$*3 > strong`** expands to:
<ul>
<li class="item-1"><strong></strong></li>
<li class="item-2"><strong></strong></li>
<li class="item-3"><strong></strong></li>
</ul>

**`table > tr*2 > td.name + td*3`** expands to:
<table>
<tr>
<td class="name"></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td class="name"></td>
<td></td>
<td></td>
<td></td>
</tr>
</table>

**`#header > ul > li < p{Footer}`** expands to:
<!-- The < symbol goes back up the parent; i.e., the opposite of >. -->
<div id="header">
<ul>
<li></li>
</ul>
<p>Footer</p>
</div>


- Create a redistributable ZIP file (`sparkup-<version>.zip`)
124 changes: 123 additions & 1 deletion docs/readme.html
View file
@@ -1 +1,123 @@
More to come here.
<h2>Usage and installation</h2>

<ul>
<li><p><strong>VIM, TextMate</strong>: See the <code>vim/</code> and <code>textmate/</code> folders</li>
<li><p><strong>Others/command line use</strong>: See <code>generic/</code></li>

</ul>


<h2>Examples</h2>

<p><strong><code>div</code></strong> expands to:</p>

<pre><code>&lt;div&gt;&lt;/div&gt;
</code></pre>

<p><strong><code>div#header</code></strong> expands to:</p>

<pre><code>&lt;div id="header"&gt;&lt;/div&gt;
</code></pre>

<p><strong><code>div.align-left#header</code></strong> expands to:</p>

<pre><code>&lt;div id="header" class="align-left"&gt;&lt;/div&gt;
</code></pre>

<p><strong><code>div#header + div#footer</code></strong> expands to:</p>

<pre><code>&lt;div id="header"&gt;&lt;/div&gt;
&lt;div id="footer"&gt;&lt;/div&gt;
</code></pre>

<p><strong><code>#menu &gt; ul</code></strong> expands to:</p>

<pre><code>&lt;div id="menu"&gt;

&lt;ul&gt;&lt;/ul&gt;
&lt;/div&gt;
</code></pre>

<p><strong><code>#menu &gt; h3 + ul</code></strong> expands to:</p>

<pre><code>&lt;div id="menu"&gt;

&lt;h3&gt;&lt;/h3&gt;
&lt;ul&gt;&lt;/ul&gt;
&lt;/div&gt;
</code></pre>

<p><strong><code>#header &gt; h1{Welcome to our site}</code></strong> expands to:</p>

<pre><code>&lt;div id="header"&gt;
&lt;h1&gt;Welcome to our site&lt;/h1&gt;
&lt;/div&gt;
</code></pre>

<p><strong><code>a[href=index.html]{Home}</code></strong> expands to:</p>

<pre><code>&lt;a href="index.html"&gt;Home&lt;/a&gt;
</code></pre>

<p><strong><code>ul &gt; li*3</code></strong> expands to:</p>

<pre><code>&lt;ul&gt;
&lt;li&gt;&lt;/li&gt;

&lt;li&gt;&lt;/li&gt;
&lt;li&gt;&lt;/li&gt;
&lt;/ul&gt;
</code></pre>

<p><strong><code>ul &gt; li.item-$*3</code></strong> expands to:</p>

<pre><code>&lt;ul&gt;
&lt;li class="item-1"&gt;&lt;/li&gt;
&lt;li class="item-2"&gt;&lt;/li&gt;
&lt;li class="item-3"&gt;&lt;/li&gt;
&lt;/ul&gt;

</code></pre>

<p><strong><code>ul &gt; li.item-$*3 &gt; strong</code></strong> expands to:</p>

<pre><code>&lt;ul&gt;
&lt;li class="item-1"&gt;&lt;strong&gt;&lt;/strong&gt;&lt;/li&gt;

&lt;li class="item-2"&gt;&lt;strong&gt;&lt;/strong&gt;&lt;/li&gt;
&lt;li class="item-3"&gt;&lt;strong&gt;&lt;/strong&gt;&lt;/li&gt;
&lt;/ul&gt;
</code></pre>

<p><strong><code>table &gt; tr*2 &gt; td.name + td*3</code></strong> expands to:</p>

<pre><code>&lt;table&gt;
&lt;tr&gt;
&lt;td class="name"&gt;&lt;/td&gt;
&lt;td&gt;&lt;/td&gt;
&lt;td&gt;&lt;/td&gt;

&lt;td&gt;&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td class="name"&gt;&lt;/td&gt;
&lt;td&gt;&lt;/td&gt;

&lt;td&gt;&lt;/td&gt;
&lt;td&gt;&lt;/td&gt;
&lt;/tr&gt;
&lt;/table&gt;
</code></pre>

<p><strong><code>#header &gt; ul &gt; li &lt; p{Footer}</code></strong> expands to:</p>

<pre><code>&lt;!-- The &lt; symbol goes back up the parent; i.e., the opposite of &gt;. --&gt;
&lt;div id="header"&gt;
&lt;ul&gt;
&lt;li&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Footer&lt;/p&gt;
&lt;/div&gt;
</code>

5 changes: 4 additions & 1 deletion plugins/textmate/readme.txt
View file
@@ -1,3 +1,6 @@
Instructions:

- double-click on the tmbundle.
Simply double-click on the Sparkup.tmbundle package in Finder. This will install Sparkup
automatically. In TextMate, open an HTML file (or set the document type to HTML) type in
something (e.g., #header > h1), then press Ctrl + E. Pressing Tab will cycle through empty
elements.

0 comments on commit 383504e

Please sign in to comment.