Alternative to <div>
. Basically trying to codify the {} syntax
Inline Syntax via <span>
:
Good for styling content within a paragraph.
... [ inline content here ]{#id .Style attribute=value } ...
As usual, it’s pretty much the url syntax {}
... [ inline content here ](url){#id .Style attribute=value } ...
Examples
This my friend is a [ Cat ]{ .catStyle ] for all season
You can find it at [ here ]( www.google.com ){ .googleStyle }
You could just also do a normal link [like so]( www.google.com )
Counter examples
Should this be allowed? For some reason it looks dangerous to allow, but I could be wrong.
( www.google.com ){.googleStyle}
Possible HTML representation
<a href="http://example.net/">This link</a>
<span id="id" class="class" attribute=value >
<a href="http://example.net/">This link</a>
</span>
#Block Syntax via <div>
:
Quite simply its a block with content in it. Good for “note”, “warnings”, “tips”. Saw it used in the wild, not exactly sure how often however, but it’s out there.
Based on fenced code:
Since fenced code block is:
```ruby
require 'redcarpet'
markdown = Redcarpet.new("Hello World!")
puts markdown.to_html
```
then direct eqv is:
:::spoiler
spoiler content here
:::
syntax
:::<$className$>
... content of emphasis block ...
:::
{ #id .classOverride }
::: <$className$> : <$HeaderText$> :::
... content of emphasis block ...
:::
{ #id .classOverride }
:::
... content of emphasis block without header ...
:::
{ #id .classOverride }
##Example:
:::::::::::: Note :::::::::::::::
Please Don't Touch The Cake
:::::::::::::::::::::::::::::::::
:::::::::::: WARNING :::::::::::::
Well... its a warning message.
::::::::::::::::::::::::::::::::::
::::::::::::::::::::::::::::::::::
This block is used to style
a block of text. Using consistent
attribute syntax.
Allowing for handling of multiple
paragraphs too!
::::::::::::::::::::::::::::::::::
{ #id .class }
Possible HTML representation
In class representation, if $Key$ has spaces inside, perhaps just join it.
<div class=" <$className$> " >
<h1><$HeaderText$></h1>
... content here...
</div>
if no header text given, then key field is assumed to be a header
<div class=" <$className$> " >
<h1><$className$></h1>
... content here...
</div>