Kitchen Sink

Elementos

• Columnas
• Details
• Imagenes
• Textos
• Divisores
• Php
• Estilos Css y Javascript
• Tablas
• Listas de definición
• Notas al pié

Columnas

Las columnas tienen que sumar entre ellas 12, por ejemplo por defecto la columna tiene 6 asi que serian dos 6+6 tambien pueden ser 4+8, 8+4, 3+3+6 etc...

[Row]
  [Col]Columna[/Col]
  [Col]Columna[/Col]
[/Row]

[Row]
  [Col num=4]Columna[/Col]
  [Col num=4]Columna[/Col]
  [Col num=4]Columna[/Col]
[/Row]

[Row]
  [Col num=3]Columna[/Col]
  [Col num=3]Columna[/Col]
  [Col num=3]Columna[/Col]
  [Col num=3]Columna[/Col]
[/Row]

Otras:

Details

[Details title='Texto oculto']
  Markdown Hidden content 
[/Details]

[Row]
  [Col]
  [Details title='Texto oculto']
    Estoy escondidoo.
  [/Details]
  [/Col]
  [Col]
  [Details title='Texto oculto']
    Estoy escondidoo.
  [/Details]
  [/Col]
[/Row]

Imagenes

Normal:

[Img src='public/notfound.jpg']

Con clases css:

[Img class='clase css' src='public/notfound.jpg']

También añadir enlaces:

[Img url='//google.es' src='public/notfound.jpg']

O también añadir texto:

[Img title='Hello' src='public/notfound.jpg']

Si el enlace es de otro dominio

[Img title='Hello' ext='true' src='//monchovarela.es/public/proyectos/colectoxo.png']

Nota: Los enlaces de otro dominio no hace falta poner https: solo basta con poner // por ejemplo //example.com/image.png

Textos

A veces necesitamos añadir un texto o nota con un color diferente, para eso usaremos [Text]

[Text bg='blue' color='white']
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod 
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim 
veniam, quis nostrud exercitation  ullamco laboris nisi ut aliquip 
ex ea commodo consequat. Duis aute irure dolor in** reprehenderit 
in voluptate velit esse cillum dolore eu fugiat nulla pariatur**. 
[/Text]

Divisores (separadores)

<br/> // normal
<hr/> // linea normal

[Divider] // numero de espacios 1
[Divider type='br'] // sin linea // numero de espacios 1
[Divider color='Khaki'] // color
[Divider class=demo6] // clase opcional
[Divider num='2'] // numero de espacios maximo 3
[Divider type='br' num='2'] // sin linea numero de espacios maximo 3

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Php

[Php]
  function sayName($name)[
    print($name);
  ]
  sayName('Hello World');
[/Php]

Estilos Css y Javascript

Podemos incluir en cada pagina un Css o Jvascript personalizado. El Css se añadirá automaticamente al head y el Javascript al footer.

Css normal:

[Styles]
body[
  background:red;
  color:white;
]
[/Styles]

Css en archivo:

// no hace falta incluir https
[Style href='linkto.css']

Javascript normal:

[Scripts]
function sayName(name)[
  console.log(name);
]
[/Scripts]

Javascript en archivo:

// no hace falta incluir https
[Script src='linkto.js']

Tablas

Alineación:

Listas de definición

First Term

This is the definition of the first term.

Second Term

This is one definition of the second term.

This is another definition of the second term.

Notas al pié

Here's a simple footnote,¹ and here's a longer one.²

↑ Volver arriba