User Tools


Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Next revision
Previous revision
en:wiki:syntax [2019/08/13 10:22] – created cbuehleren:wiki:syntax [2023/04/25 10:59] (current) – external edit 127.0.0.1
Line 524: Line 524:
  
 ~~INFO:syntaxplugins~~ ~~INFO:syntaxplugins~~
 +
 +====== Color Plugin ======
 +
 +Place this code sample in your playground:
 +
 +<code>
 +<color green>text</color>
 +<color blue/lightgrey>text</color>
 +<color #FF0000>text</color>
 +<color /#FFff00>text</color>
 +<color rgb(80%,0%,0%)/rgb(100%,80%,100%)>text</color>
 +<color hsl(120,100%,30%)/hsl(180,50%,90%)>text</color>
 +</code>
 +
 +and you will see something like this:
 +
 +{{https://folk.ntnu.no/hanche/tmp/dokuwiki_color_plugin.png|Color plugin in action}}
 +
 +This plugin supports the [[wp>X11_color_names#Color_name_chart|X11 color names]],
 +hex triples (like #123 or #123456 for rgb),
 +hex quadruples (#1234 or #12345678 for rgba),
 +[[https://developer.mozilla.org/en-US/docs/Web/CSS/color_value|rgb, rgba, hsl, and hsla]]
 +color specifications.
 +This plugin does not try hard to catch syntax errors in your color specifications, however.
 +If you use these specifications wrong, you may simply notice that they won't work.
 +Beware that not all color specifications work on all browsers.
 +Check [[https://caniuse.com/|Can I Use]] if in doubt.
 +
 +====== Cell Background Plugin ======
 +
 +===== Syntax and Usage =====
 +
 +A background color is introduced by ''@'' and ended by '':''.\\ 
 +You can use all names and color codes from HTML.\\ 
 +If you don't specify a color, yellow is used.\\ 
 +See examples below:
 +
 +===== Examples =====
 +
 +This code :
 +<code>
 +^  Header 1          Header 2  ^  Header 3        ^
 +|  @lightgreen:**Span**         ||                  |
 +|  @#6495ed:Ligne 1 |  Oui        Oui, à valider  |
 +|  Ligne 2          |  Oui        @orange: Oui    |
 +|  @:Ligne 3        |  Oui       | @red:Non         |
 +</code>
 +looks like : \\ 
 +^  Header 1          Header 2  ^  Header 3        ^
 +|  @lightgreen:**Span**         ||                  |
 +|  @#6495ed:Ligne 1 |  Oui        Oui, à valider  |
 +|  Ligne 2          |  Oui        @orange: Oui    |
 +|  @:Ligne 3        |  Oui       | @red:Non         |
 +
 +This one :
 +<code>
 +|  @palegreen:Validé  |  @orange:À valider  |  @red:Non fonctionnel  |
 +</code>
 +looks like : \\ 
 +|  @palegreen:Validé  |  @orange:À valider  |  @red:Non fonctionnel  |
 +
 +
 +
 +
 +===== Features =====
 +  * Uses HTML color codes and names [[http://html-color-codes.info/|HTML Color Code Chart]]
 +  * Works with other table formatting (alignment, bold, ...)
 +