Welcome to LungoJS KitchenSink

The first Mobile Framework that uses the actual features of #HTML5, #CSS3 and #JavaScript.

The main premise in Lungo is to create a semantic structure in the whole project, starting from the markup language HTML, through a well organized CSS< and ending with the JavaScript API

Author
Javi Jiménez Villar CEO & Creative Lead at Tapquo

CoreTeam
Guillermo Pascual @pasku1
Iker Perez Albeniz @ikalneniz

Contributors
Jorge Casar jorgecasar
Dave Winders daithiw44
GermanDZ GermanDZ
Juan Gallego Galisteo nickel
John McLear johnyma22

default disabled red lightgreen green blue articblue orange magenta pink yellow twitter facebook

You can view other examples push in the next button

View other Examples

<class> icon: everything is a vector!

In the listed examples you are seeing a attribute "data-icon", this attribute only need the semantic name of the icon you want to show and LungoJS will do the rest of the work.

anchor
box
cloudup
deny
storm
feed
group
help
info
join
heart
index
music
note
folder
pencil
chat
reset
search
time
u
camera
message
setting
config
label
link
twitter
cloud
cancel
view
document
earth
home
inbox
compact
key
radar
mail
wallpaper
suitcase
picture
on
external
star
plane
user
video
write
truck
graph
piechart
expand
redo
accept
check
play
pause
stop
forward
backward
player
refresh
minus
battery
left
right
calendar
shuffle
wifi
dashboard
points
printer
download
exclamation
pushpin
trash
cart
saving
flag
add
multiply
lock
unlock
substract
plus
up
down
viewport
alarm
quote
volume_down
volume_up
help

The data-attributes

data-icon Creates an icon LungoJS vectorized
data-image Instance a <img> automatically
data-search Creates a search input form

Others

data-title Relationship field between <header> and <a>
data-count Creates counters of different <elements>
data-back Creates a button that goes to the previous section.

Test events ... in each row.
Common Events
Touchstart me!
Touchend me!
Tap me!
Double-Tap me!
Special Events
Swipe me! Drag in any direction
Swipe-Left me! Drag in any direction
Swipe-Right me! Drag in any direction
Swipe-Up me! Drag in any direction
Swipe-Down me! Drag in any direction

With icon Text

Example of inputs
type="text"
type="password"

Example of search
It's a special form element you must set the attribute data-search="Placeholder text"

Example of textarea

Example of select
Select a number:
It's a special form element you must set the label with class "select"

Example of checkbox

Example of radio

Example of radio

Tips examples

Examples of tips
Lorem Ipsum is simply dummy text...
Lorem Ipsum is simply dummy text...
Lorem Ipsum is simply dummy text...
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's...
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's...
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's...

Anchor & Label example

Example of anchor
Example of label

Coming Soon...