Modal

Open the modal

(:modal my_modal This is modal size=:)
Place the body of your modal here
(:modalfooter:)
(:bs-button button secondary Close size= data-dismiss="modal":)
(:bs-button button primary Save size=:)
(:endmodal:)

(:bs-button button warning Open the modal size= data-toggle="modal" data-target="#my_modal":)

Form

alphabetagamma

Let's go

(:bs-form-entry text email email label=Email address value= placeholder=michelfra@michel.fra help_text=Enter your email address so we can spam you label_placement= addon=@:)
(:bs-form-entry password password password label=Password value= placeholder= help_text= label_placement= addon=:)
(:bs-form-entry number age age label=Age value=21 placeholder= help_text=How old are you ? label_placement= addon=:)

(:input select name=abc value=1 label=alpha class="custom-select":)
(:input select name=abc value=2 label=beta  :)
(:input select name=abc value=3 label=gamma :)

(:bs-button submit success Let's go size=lg:)

Card

Example

01/01/1970
Description of the card

(:card class="" style="width: 300px":)

[[ {Examples.Card$FullName} | (:imgcard src="/pub/skins/skingi/images/ingi_square.svg" height="50" fit="contain":)]]

(:cardblock class="":)
(:cardtitle class="":)

%apply=link color="inherit"% [[ {Examples.Card$FullName} | Example]]\\

(:cardtitleend:)
(:cardtext class="":)

''01/01/1970'' \\
Description of the card (:fadeout height=(:if ! equal  "":)  (:else:)20px (:ifend:) color="(:if ! equal  "":)  (:else:) white (:ifend:)":) 

(:cardtextend:)
(:cardblockend:)
(:cardend:)

---

Horizontal Card

Example

01/01/1970
Description of the card

(:card class="newslistitem" style="width: 500px" :)

(:div class="row":) \

(:div2 class="col-md-3":)
(:imgcard src="/pub/skins/skingi/images/ingi_square.svg" height="50" fit="contain" direction=row:)
(:div2end:)

(:cardblock class="":)
(:cardtitle class="":)

%apply=link color="inherit"% [[ {Examples.CardHorizontal$FullName} | Example]]\\

(:cardtitleend:)
(:cardtext class="":)

''01/01/1970'' \\
Description of the card (:fadeout height=(:if ! equal  "":)  (:else:)20px (:ifend:) color="(:if ! equal  "":)  (:else:) white (:ifend:)":) 

(:cardtextend:)
(:cardblockend:)
(:divend:)
(:cardend:)

---

Carousel

I love code

I am a 12 year full stack JS coder

Don't look, its secret code!

\°o°/

Previous Next

(:carousel id=my_car slides=3 interval=2000 pause=hover ride=carousel wrap=true:)
(:carouselitem img=[=https://static.pexels.com/photos/330771/pexels-photo-330771.jpeg?fit=crop&w=1920&h=1280=] title=I love code text=I am a 12 year full stack JS coder:)
(:carouselitem img=[=https://static.pexels.com/photos/247791/pexels-photo-247791.png?fit=crop&w=1920&h=1280=] title= text=Don't look, its secret code!:)
(:carouselitem img=[=https://images.pexels.com/photos/97077/pexels-photo-97077.jpeg?fit=crop&w=1920&h=1280=] title=\°o°/ text=:)
(:endcarousel id=my_car:)