From 573040a6281a1b25a9c808abb96c61db9aef2ad0 Mon Sep 17 00:00:00 2001 From: jlukic Date: Mon, 24 Nov 2014 02:18:51 -0500 Subject: [PATCH] Update kitchen sink example --- examples/kitchensink.css | 45 +- examples/kitchensink.html | 6476 ++++++++++++++++++++++++++++++------- 2 files changed, 5374 insertions(+), 1147 deletions(-) diff --git a/examples/kitchensink.css b/examples/kitchensink.css index 182afc33b..c2f461730 100644 --- a/examples/kitchensink.css +++ b/examples/kitchensink.css @@ -9,44 +9,41 @@ #sink { background-color: #FFFFFF; } -#sink .demo h4 { - margin: 2em 0em 1em; + +#sink .demo.container { + width: 700px; + margin: 0px auto; } +#sink .demo.container .example { + padding: 2em 0em; + margin: 2em 0em; + border-top: 1px solid #DDD; +} -/* Awkwardly ported from docs */ -#sink .demo.row { - margin: 0 auto !important; - max-width: 1400px; -} -#sink .demo.row .button.demo > .buttons, -#sink .demo.row .button.demo > .button, -#sink .demo.row .button.demo > .segment > .button { - margin-bottom: 0.5em; +#sink .demo h4 { + font-size: 1.5em; + margin: 2em 0em 1em; } -#sink .demo.row .ui.menu, -#sink .demo.row .ui.card { - width: 100%; +#sink .demo.container .button.demo > .buttons, +#sink .demo.container .button.demo > .button, +#sink .demo.container .button.demo > .segment > .button { + margin-bottom: 0.5em; } -#sink .demo.row h4 { +#sink .demo.container h4:first-child { font-weight: bold !important; margin: 0em 0em 1em !important; } -#sink .demo.row .example { - clear: both; - padding-top: 3em; - margin-top: 3em; -} -#sink .demo.row .example:first-child { +#sink .demo.container .example:first-child { margin-top: 0; padding-top: 0; } -#sink .demo.row .segment.example { +#sink .demo.container .segment.example { z-index: 1; } -#sink .demo.row .ui.label:not(.empty) { +#sink .demo.container .ui.label:not(.empty) { margin-bottom: 1em; } -#sink .demo.row .segment .ui.label { +#sink .demo.container .segment .ui.label { margin-bottom: 0em; } diff --git a/examples/kitchensink.html b/examples/kitchensink.html index 5c79f10ab..d011555ce 100644 --- a/examples/kitchensink.html +++ b/examples/kitchensink.html @@ -13,1189 +13,5419 @@ + + + -
-
-
-

Kitchen Sink

-
-
We need your help
-

- These kitchen sink demos are very incomplete. If you have time, please help us out by adding examples for missing elements and submitting a pull request. -

-
-
+ +
+ +

+ Elements +

+
+

+ Button +

+
+
+ View +
+
+ Add to Cart +
+
+ Save for Later +
+
+ + Rate +
+
Basic
+ + + +
+
Horizontal
+ +
+
+
Vertical
+ +
+
+
Fade In
+ +
+ + + + + +
+ + Google Plus +
+ + +
+
1
+
2
+
3
+
+ + +
+
Cancel
+
+
Save
+
+ +
+
+
+
+
+
+ +
Blue
+
Red
+
Teal
+
Blue
+
Red
+
Teal
+ +
+
Inverted
+
Blue
+
Red
+
Basic
+
Blue
+
Red
+
+ + + +
+
Feed
+
Messages
+
Events
+
Photos
+
+ +
+
1
+
2
+
3
+
+ +
+
+
+
+
+
+ +
+ +
+
+

+ Divider +

+
+
A
+
and
+
B
+
+ +
+
+
A
+
+
or
+
+
B
+
+
+ +
+ +
+ +
+ + Specifications +
+ +
+

A

+
+

B

+
+
+
+

+ Flag +

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+
+

+ Header +

+
+ +
+

H1

+

H2

+

H3

+

H4

+
H5
+ +
+ +
+ Icon Header +
Sub-header
-
-
-
-

- Button -

-
-
- View -
-
- Add to Cart -
-
- Save for Later -
-
- - Rate -
-
Basic
- +
+ +
+ Header +
Sub-header
+
+
+
+
+
+ +
+ Block +
Sub-header
+
+
+ +
+ +
+ Dividing +
Sub-header
+
+
+ +
+ +
+ Color +
Sub-header
+
+
+ +
Attached
+
+
Attached
+
+
+
+
+

+ Icon +

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ +
+ + + + + + + + + + + + + + + + + + + + + +
+
+

+ Image +

+ The partial "examples/image" was not found, as such it will not be rendered. +
+
+

+ Input +

+
+ + +
Search
+
+ + +
+ +
+ +
+
+ + +
+
+ http:// +
+ + +
+ + +
+ + Label + + +
+ +
+ + + Label + +
+
+
+

+ Label +

+
+ + email@address.com + +
+ + Some Name + Group + + + Icon + +Tag +
+
+
+ +
+
+
+
+ +
+ Pointing Label +
+
+
+
+ Pointing below label +
+ +
+
+
+ + +
+ + Item + + + Item +
141
+ +
-
-
Horizontal
- +
+

+ List +

+
+
+
+
+ +
+
Header
+ Description +
+
+ +
+ Sub Header +
Sub Description
+
+
+
+ +
+ Sub Header +
Sub Description
-
-
Vertical
- +
+
+
+ +
+
Header
+ Description +
+
+ +
+ Sub Header +
Sub Description
-
-
Fade In
- +
+
+
+ +
+
+ +
+
Header
+ Description +
+
+
+ +
+
Header
+ Description +
+
+
+ +
+
Header
+ Description +
+
+
+ +
+
+ +
+
Header
+ Description +
+
+
+ +
+
Header
+ Description +
+
+
+ +
+
Header
+ Description +
+
+
+ +
+ +
+
+ Link + Link + Link + Link + Link +
+ +
+ Selection + Selection + Selection + Selection + Selection +
+ +
+
+
+
Header
+ Description +
+
+
+ Sub-header +
+
+ Sub-header +
+
+ Sub-header +
+
+
+
+
+
Header
+ Description +
+
+
+
+
Header
+ Description +
+
+
+ +
+ Getting Started + Introduction +
+ Languages +
+ HTML + Javascript + CSS +
+
+ Review +
+
+
+ + + +
+
+ +
+
Header
+ Description +
+
+
+ +
+
Header
+ Description +
+
+
+ +
+
Header
+ Description +
+
+
+ + + +
+
+ +
+
Header
+ Description +
+
+
+ +
+
Header
+ Description +
+
+
+ +
+
Header
+ Description +
+
+
+ + + +
+
+ +
+
Steve Jobes
+ 50 Points +
+
+
+ +
+
Stevie Feliciano
+ 44 Points +
+
+
+ +
+
Jenny Hess
+ 11 Points +
+
+
+
+
+

+ Loader +

+
+
+
+
+
+
+

+

+

+
+
+
+
+
+
+
+

+

+

+
+
+
+
+
+
+
+

+

+

+
+
+
+
+
+
+
+

+

+

+
+
+
+
+
+
+
+
+ Loading +
+
+

+

+

+
+
+
+
+
+
+ Loading +
+
+

+

+

+
+
+
+
+
+
+ Loading +
+
+

+

+

+
+
+
+
+
+
+ Loading +
+
+

+

+

+
+
+
+
+
+
+
+
+
+

+

+

+
+
+
+
+
+
+
+

+

+

+
+
+
+
+
+
+
+

+

+

+
+
+
+
+
+
+
+

+

+

+
+
+
+
+
+
+
+
+ Loading +
+
+

+

+

+
+
+
+
+
+
+ Loading +
+
+

+

+

+
+
+
+
+
+
+ Loading +
+
+

+

+

+
+
+
+
+
+
+ Loading +
+
+

+

+

+
+
+
+ + + +
+
+
+ Preparing... +
+
+

+

+

+
+ +
+
+
+
+

+

+

+
+ +
+
+

+ Reveal +

+
+
+ +
+ +
+
+
+ +
+ +
+
+
+ +
+ +
+
+
+ +
+ +
+ +
+
+ +
+ +
+
+
+ +
+ +
+
+
+ +
+ +
+
+
+ +
+ +
+ +
+
+ +
+ +
+
+
+ +
+ +
+ +
+
+

+ Segment +

+
+
+
+
+
+
+
+
+
+
+
+

+ Step +

+
+ +
+
Step
+
Description
+
+ + +
+
Step
+
Description
+
+ +
+ +
+ +
+
Previous Step
+
Description
+
+ + +
+
Active Step
+
Description
+
+ + +
+
Disabled Step
+
Description
+
+ +
+ + + +
+ + +
+
Previous Step
+
Description
+
+ + + +
+
Active Step
+
Description
+
+ + + +
+
Disabled Step
+
Description
+
+ +
+
+ +

+ Collections +

+ +
+

+ Breadcrumb +

+
+ Home +
/
+ Store +
/
+
T-Shirt
+
+ +
+ Home + + Registration + +
Personal Information
+
+
+
+

+ Form +

+
+
+
+ +
+
Select
+ + +
+
Choice 1
+
Choice 2
+
+
+
+
+ + +
+
+
+ + +
+
+
+ + +
+
+ + +
+
+ + +
+
+
+ +
+
+ + +
+
+
+
+ + +
+
+
+
+ + +
+
+
+
+ + +
+
+
+
+ +
+ + +
+
+
+
+ + +
+
+
+ +
+
+ + +
+
+
+
+ + +
+
+
+
+ + +
+
+
+
+ + +
+
+
+
+
+ + +
+
+ +
+
+ +
+
+
+ + +
+

Sub-header

+
+
+ + +
+
+
+
+ + +
+
+
Submit
+
+ +
+
+
Warning Message
+
    +
  • Problem #1
    • +
  • Problem #2
    • +
+
+
+
+ + +
+
+ + +
+
+
Submit
+
+
+
+
Error Message
+

Error message long description

+
+
+
+ + +
+
+ + +
+
+
Submit
+
+
+
+

+ Grid +

+
+ +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ +
+ +
+ +
+ +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ +
+ + +
+
+

+ Menu +

+
+ + A + + + B + + + C + +
+
+ + A + + + B +
1
+ +
+
+ + +
+
+
+
+ + Tab + + + Tab + +
+
+ + A + + + B + + + C + +
+
+ + A + + + B + + + C + +
+
+ + A + + + B + + + C + +
+
+ + A + + + B + + + C + +
+
+ + A + + + B + + + C + +
+ + +
+
+

+ Message +

+
+ + Closable message +
+
+
+
Warning Message
+
    +
  • List item
    • +
  • List item
    • +
+
+
+
+
+ List Message +
+
    +
  • List item 1
    • +
  • List item 2
    • +
  • List item 3
    • +
+
+
+
Info Message
+

Example description

+
+
+
+
Positive Message
+

Example description

+
+
+
+ +
+
Negative Message
+

Example description

+
+
+
+ Top attached +
+
+ Bottom attached +
+ + +
+
+

+ Table +

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ Files +
+ folder + Comment10 hours ago
+ folder2 + Comment10 hours ago
+ folder3 + Comment10 hours ago
+ package.json + Comment10 hours ago
+ Gruntfile.js + Comment10 hours ago
+ + + + + + + + + + + + + + + + + + + +
Header 1Header 2
Definition1A1B
Definition2A2B
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameRegistration DateE-mail addressPremium Plan
+
+ +
+
+
+ +
+
+
+ +
+
+
+ Primary +
+
+ Button +
+
+ Disabled +
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameStatusNotes
User 1ValueComment
User 1SelectedData
User 1ValueComment
User 2ValueData
User 1Value + + Warning +
User 3ValueData
User 1Value + +
User 2 + + Warning + Data
User 2 + Data
User 2ValueData
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameStatusNotes
User 1DataData
User 3DataData
User 2DeniedData
FooterFooter
+
+ +

+ Views +

+ +
+

+ Card +

+
+
+
+
+
+
Add Friend
+
+
+
+ +
+
+
Title
+
+ Meta +
+
One or two sentence description that may go to several lines
+
+
+ Arbitrary + + Arbitrary +
+
+
+
+
+ + Abbreviated Header +
+
+ Short Description +
+
+
+
+ Action 1 +
+
+ Action 2 +
+
+
+
+
+
+ + +
+
+
+
+ + +
+
+
+
+ + +
+
+
+
+ + +
+
+
+
+
+
+ +
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+ +
+
+
+
+
+
+ + + +
+
+

+ Feed +

+
+
+
+
+
+ +
+
+
+ + Username + added you as a friend +
+
+
+
+
+ +
+
+ You added Username to the group Group Name +
+
+
+
+ +
+
+
+ Time period ago +
+
+ Userrname added new photos +
+
+ +
+
+ +
+
+
+
+
+
+
+
+
+ +
+
+
+ You wrote something +
+ Time period ago +
+
+
+ Blockquote +
+
+ Metadata + Metadata +
+
+
+
+
+ +
+
+
+ You uploaded a photo +
+ Time period ago +
+
+
+ Metadata + Metadata +
+
+
+
+ +
+
+
+
+ Elliot Fu added Jenny Hess as a friend +
+
+
+
+
+
+ Stevie Feliciano added Elliot Fu as a friend +
+
+
+
+
+
+ Helen Troy added Christian Rocha as a friend +
+
+
+
+
+
+ Christian Rocha signed up for the site. +
+
+
+
+
+
+
+
+

+ Item +

+
+
+
+ +
+
+ Content Header +
+ Date + Category +
+
+ A description which may flow for several lines and give context to the content. +
+
+ Username +
+
+
+
+
+ +
+
+ Content Header +
+ Date + Category +
+
+ A description which may flow for several lines and give context to the content. +
+
+
+ Primary + +
+
Limited
+
+
+
+
+
+ +
+
+ Content Header +
+ Date + Category +
+
+ A description which may flow for several lines and give context to the content. +
+
+
+ Primary + +
+
+
+
+
+ + + +
+
+
+ +
+
+ Content Header +
+ A description which may flow for several lines and give context to the content. +
+
+
+
+
+ +
+
+ Content Header +
+ A description which may flow for several lines and give context to the content. +
+
+
+
+
+ +
+
+ Content Header +
+ A description which may flow for several lines and give context to the content. +
+
+
+
+
+
+

+ Statistic +

+
+
+ Top Label +
+
+ 4:05 +
+
+ +
+ +
+
+ 22 +
+
+ Bottom Label +
+
+ +
+ +
+
+ Eighty
+ Two +
+
+ Text +
+
+
+
+ 5 +
+
+ Labeled Icon +
+
+ +
+ +
+
+
+ + 22 +
+
+ Horizonal Label +
+
+
+
+ + 51 +
+
+ Horizonal Label +
+
+
+
+ + 81 +
+
+ Horizonal Label +
+
+
+
+ + +

+ Modules +

+ +
+

+ Accordion +

+
+
+ + + Menu Item + +
+
+
+
+
+ + +
+
+
+
+ + +
+
+
+
+ + +
+
+
+
+ + +
+
+
+
+
+
+
+ + + Menu Item + +
+
+
+
+
+ + +
+
+
+
+ + +
+
+
+
+ + +
+
+
+
+ + +
+
+
+
+
+
+
+ +
+ +
+
+ + FAQ Question 1? +
+
+ +
+
+ + FAQ Question 2? +
+
+ +
+
+ + FAQ Question 3? +
+
+ +
+
+ +
+ +
+
+ + Title +
+
+ +
+
+ + Title +
+
+ +
+
+ + Title +
+
+ +
+
+ + +
+
+

+ Checkbox +

+
+ + +
+ + +
+
+
+
+ + +
+
+
+
+ + +
+
+
+
+ + +
+
+
+
+ + +
+
+
+
+ + +
+ + +
+ + +
+ + +
+ + +
+
+

+ Dimmer +

+
+
+

+ Dimmable Section +

+
+ + + +
+ +
+
+
+
+
+
+
+
+
+

+ Inverted Dimmer +

+
+ + + +
+ +
+
+
+
+
+
+
+
+
+

+ Dimmer With Content +

+
+ + + +
+ +
+
+
+

+ + Dimmed Message! +

+
+
+
+
+
+
+
+
+
+
+
+ Page Dimmer +
+
+ + + +
+
+

+ Dropdown +

+
+ + Select Language +
+
Arabic
+
Chinese
+
Danish
+
Dutch
+
English
+
French
+
German
+
Greek
+
Hungarian
+
Italian
+
Japanese
+
Korean
+
Lithuanian
+
Persian
+
Polish
+
Portuguese
+
Russian
+
Spanish
+
Swedish
+
Turkish
+
Vietnamese
+
+
+
+ + +
Select Country
+
+
Andorra
+
U.A.E
+
Afghanistan
+
Antigua
+
Anguilla
+
Albania
+
Armenia
+
Netherlands Antilles
+
Angola
+
Argentina
+
American Samoa
+
Austria
+
Australia
+
Aruba
+
Aland Islands
+
Azerbaijan
+
Bosnia
+
Barbados
+
Bangladesh
+
Belgium
+
Burkina Faso
+
Bulgaria
+
Bahrain
+
Burundi
+
Benin
+
Bermuda
+
Brunei
+
Bolivia
+
Brazil
+
Bahamas
+
Bhutan
+
Bouvet Island
+
Botswana
+
Belarus
+
Belize
+
Canada
+
Cocos Islands
+
Congo
+
Central African Republic
+
Congo Brazzaville
+
Switzerland
+
Cote Divoire
+
Cook Islands
+
Chile
+
Cameroon
+
China
+
Colombia
+
Costa Rica
+
Serbia
+
Cuba
+
Cape Verde
+
Christmas Island
+
Cyprus
+
Czech Republic
+
Germany
+
Djibouti
+
Denmark
+
Dominica
+
Dominican Republic
+
Algeria
+
Ecuador
+
Estonia
+
Egypt
+
Western Sahara
+
Eritrea
+
Spain
+
Ethiopia
+
European Union
+
Finland
+
Fiji
+
Falkland Islands
+
Micronesia
+
Faroe Islands
+
France
+
Gabon
+
England
+
Grenada
+
Georgia
+
French Guiana
+
Ghana
+
Gibraltar
+
Greenland
+
Gambia
+
Guinea
+
Guadeloupe
+
Equatorial Guinea
+
Greece
+
Sandwich Islands
+
Guatemala
+
Guam
+
Guinea-Bissau
+
Guyana
+
Hong Kong
+
Heard Island
+
Honduras
+
Croatia
+
Haiti
+
Hungary
+
Indonesia
+
Ireland
+
Israel
+
India
+
Indian Ocean Territory
+
Iraq
+
Iran
+
Iceland
+
Italy
+
Jamaica
+
Jordan
+
Japan
+
Kenya
+
Kyrgyzstan
+
Cambodia
+
Kiribati
+
Comoros
+
Saint Kitts and Nevis
+
North Korea
+
South Korea
+
Kuwait
+
Cayman Islands
+
Kazakhstan
+
Laos
+
Lebanon
+
Saint Lucia
+
Liechtenstein
+
Sri Lanka
+
Liberia
+
Lesotho
+
Lithuania
+
Luxembourg
+
Latvia
+
Libya
+
Morocco
+
Monaco
+
Moldova
+
Montenegro
+
Madagascar
+
Marshall Islands
+
MacEdonia
+
Mali
+
Burma
+
Mongolia
+
MacAu
+
Northern Mariana Islands
+
Martinique
+
Mauritania
+
Montserrat
+
Malta
+
Mauritius
+
Maldives
+
Malawi
+
Mexico
+
Malaysia
+
Mozambique
+
Namibia
+
New Caledonia
+
Niger
+
Norfolk Island
+
Nigeria
+
Nicaragua
+
Netherlands
+
Norway
+
Nepal
+
Nauru
+
Niue
+
New Zealand
+
Oman
+
Panama
+
Peru
+
French Polynesia
+
New Guinea
+
Philippines
+
Pakistan
+
Poland
+
Saint Pierre
+
Pitcairn Islands
+
Puerto Rico
+
Palestine
+
Portugal
+
Palau
+
Paraguay
+
Qatar
+
Reunion
+
Romania
+
Serbia
+
Russia
+
Rwanda
+
Saudi Arabia
+
Solomon Islands
+
Seychelles
+
Sudan
+
Sweden
+
Singapore
+
Saint Helena
+
Slovenia
+
Svalbard, I Flag Jan Mayen
+
Slovakia
+
Sierra Leone
+
San Marino
+
Senegal
+
Somalia
+
Suriname
+
Sao Tome
+
El Salvador
+
Syria
+
Swaziland
+
Caicos Islands
+
Chad
+
French Territories
+
Togo
+
Thailand
+
Tajikistan
+
Tokelau
+
Timorleste
+
Turkmenistan
+
Tunisia
+
Tonga
+
Turkey
+
Trinidad
+
Tuvalu
+
Taiwan
+
Tanzania
+
Ukraine
+
Uganda
+
Us Minor Islands
+
United States
+
Uruguay
+
Uzbekistan
+
Vatican City
+
Saint Vincent
+
Venezuela
+
British Virgin Islands
+
Us Virgin Islands
+
Vietnam
+
Vanuatu
+
Wallis and Futuna
+
Samoa
+
Yemen
+
Mayotte
+
South Africa
+
Zambia
+
Zimbabwe
+
+
+ + + +
+ + Filter Posts +
+
+ Filter +
+
+
+ Tag A +
+
+
+ Tag B +
+
+
+ Tag C +
+
+
+ Tag D +
+
+
+ + + +Show me posts trending +
+
today
+ +
+
Today
+
This Week
+
This Month
+
+
+ + + +
+ +
+
+ + +
+
+
+ + Filter by tag +
+
+
+ Important +
+
+
+ Announcement +
+
+
+ Discussion +
+
+
+ + + +
+ + Home + +
+ + Shopping +
+
Categories
+
+ + Clothing +
+
Mens
+
Shirts
+
Pants
+
Jeans
+
Shoes
+
+
Womens
+
Dresses
+
Shoes
+
Bags
+
+
+
Home Goods
+
Bedroom
+
+
Order
+
Status
+
Cancellations
+
+
+ + Forums + + + Contact Us + +
+ + + +
+
+ + Home + +
+ + Messages +
+
Inbox
+
Starred
+
Sent Mail
+
Drafts (143)
+
+
Spam (1009)
+
Trash
+
+
+ + Browse + + + Help + +
+
+ + + +
+
+ +
+
Edit User
+
Remove User
+
Make Invisible
+
+
+
+ +
+
Edit Group
+
Remove Group
+
Hide from Group
+
+
+
+ +
+
Edit
+
Remove
+
Hide
+
+
+
+ + +
+
+

+ Modal +

+
Standard Modal
+
Basic Modal
+
Full-Screen Modal
+ + + + + + + + + +
+
+

+ Popup +

+
+ + + + +
Fluid Popup
+
+
+
1
+
2
+
3
+
4
+
+
+ +
HTML Content
+
Basic Popup
+
+ Basic pop-up +
+
Small
+
+ Small pop-up +
+
Large
+
+ Large pop-up +
+
+ Inverted +
+
+ + Link + + + + Popup Link + +
+
+
+

Fabrics

+
+ Cashmere + Linen + Cotton + Viscose +
+
+
+

Sizes

+
+ Small + Medium + Large + Plus Sizes +
+
+
+

Colors

+
+ Neutrals + Brights + Pastels +
+
+
+

Types

+
+ Knitwear + Outerwear + Pants + Shoes +
+
+
+
+
+ +
+
+ + + + + + + + +
+
+ +
+ + +
+
+

+ Progress +

+
+
+
+
+
Uploading Files
+
+ + +
+
+
Funding
+
+ +
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+ + +
+
+

+ Rating +

+
+
+
+
+
+
+ + Choice #1 +
+
+
+
+
+
+
+ + Choice #2 +
+
+
+
+
+
+
+ + Choice #3 +
+
+
+
+ +
+ +
+
+
+ +
+
+ Content Header +
+ A description which may flow for several lines and give context to the content. +
+
+ 11
+
+
+
+
+
+ +
+
+ Content Header +
+ A description which may flow for several lines and give context to the content. +
+
+ 42
+
+
+
+
+
+ +
+
+ Content Header +
+ A description which may flow for several lines and give context to the content. +
+
+ 16
+
+
+
+
+ + + +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ + + +
+
+

+ Search +

+
+ +
+
+ + +
+
+
+ + - -
-
1
-
2
-
3
-
+
+
+ + +
+
+
-
-
Cancel
-
-
Save
-
+ -
-
-
-
-
-
+
+
+ + +
+
+
- -
Blue
-
Red
-
Teal
- - -
Blue
-
Red
-
Teal
- -
-
Inverted
-
Blue
-
Red
- -
Basic
-
Blue
-
Red
-
-
- -
-
-

- Menu -

-
- - A - - - B - -
-
- - A - - - B -
1
- -
-
- - -
-
-
-
- - Tab - - - Tab - -
-
- - A - - - B - - - C - -
-
- - A - - - B - - - C - -
+
- -
-
-

- Divider -

-
-
A
-
and
-
B
-
-
-
-
A
-
-
or
-
-
B
-
+ +
+ +
+

+ Shape +

+
+ +
+
+
+
+
+
-
-
-

- Accordion -

-
-
- - - Menu Item - -
-
-
-
-
- - -
-
-
-
- - -
-
-
-
- - -
-
-
-
- - -
-
-
-
-
-
-
- - - Menu Item - -
-
-
-
-
- - -
-
-
-
- - -
-
-
-
- - -
-
-
-
- - -
-
-
-
-
-
+
+
+
+
-
-
- - Title -
-
- -
-
- - Title -
-
- -
-
- - Title -
-
- -
-
+ - -
-
-

- Message -

-
- - Closable message -
-
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
-
Warning Message
-
    -
  • List item
    • -
  • List item
    • -
+
+ 1 +
-
-
Info Message
-

Example description

-
-
+
-
Positive Message
-

Example description

+
+ 2 +
-
- +
-
Negative Message
-

Example description

-
-
-
- Top attached -
-
- Bottom attached -
- - -
-
-
-
-

- Feed -

-
-
-
- -
-
-
- - Username - added you as a friend -
-
-
-
-
- -
-
- You added Username to the group Group Name -
-
-
-
- -
-
-
- Time period ago -
-
- Userrname added new photos -
-
- -
-
- -
+
+ 3
- -
-
-
- -
-
-
- You wrote something -
- Time period ago -
-
-
- Blockquote -
-
- Metadata - Metadata -
-
-
-
-
- -
-
-
- You uploaded a photo -
- Time period ago -
-
-
- Metadata - Metadata -
+
+
+
+ 4
- -
-
-
-
- Elliot Fu added Jenny Hess as a friend -
-
-
-
-
-
- Stevie Feliciano added Elliot Fu as a friend -
-
-
-
-
-
- Helen Troy added Christian Rocha as a friend -
+
+
+
+ 5
-
-
-
- Christian Rocha signed up for the site. -
+
+
+
+
+ 6
-
-
-

- Label -

-
- - email@address.com - -
- - Some Name - Group - - - Icon - - Tag - - -
- - Item -
2
- - - Item -
141
- -
+
+
- -
- - - - -
-
- - - - -
-
- - - - -
+ - -
-
Top Labeled
-
Bottom Labeled
-
-
-
Top Left
-
Top Right
-
Bottom Left
-
Bottom Right
-
-
- Ribbon -
-
-
-

- Step -

-
- -
-
Step
-
Description
-
- - -
-
Step
-
Description
-
- -
- -
- -
-
Previous Step
-
Description
-
- - -
-
Active Step
-
Description
-
- - -
-
Disabled Step
-
Description
-
- -
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
Did you know? This side starts visible.
+
Help, its another side!
+
This is the last side
+
+
- + -
- - -
-
Previous Step
-
Description
-
- - - -
-
Active Step
-
Description
-
- - - -
-
Disabled Step
-
Description
-
- -
-
-
-

- Card -

-
-
- - -
-
-
Title
-
- Meta -
-
One or two sentence description that may go to several lines
-
-
- Arbitrary - - Arbitrary -
-
-
-
-
- - Abbreviated Header -
-
- Short Description -
-
-
-
- Action 1 -
-
- Action 2 -
-
-
+
+
+
+
+
+
+
+
+
+
- - -
-
-
-
-

- Dropdown -

-
- - -
Select country
-
-
Andorra
-
United Arab Emirates
-
Afghanistan
-
Antigua
-
Anguilla
-
Albania
-
Armenia
-
Netherlands Antilles
-
Angola
-
Argentina
-
American Samoa
-
Austria
-
Australia
-
Aruba
-
Aland Islands
-
Azerbaijan
-
Bosnia
-
Barbados
-
Bangladesh
-
Belgium
-
Burkina Faso
-
Bulgaria
-
Bahrain
-
Burundi
-
Benin
-
Bermuda
-
Brunei
-
Bolivia
-
Brazil
-
Bahamas
-
Bhutan
-
Bouvet Island
-
Botswana
-
Belarus
-
Belize
-
Canada
-
Cocos Islands
-
Congo
-
Central African Republic
-
Congo Brazzaville
-
Switzerland
-
Cote Divoire
-
Cook Islands
-
Chile
-
Cameroon
-
China
-
Colombia
-
Costa Rica
-
Serbia
-
Cuba
-
Cape Verde
-
Christmas Island
-
Cyprus
-
Czech Republic
-
Germany
-
Djibouti
-
Denmark
-
Dominica
-
Dominican Republic
-
Algeria
-
Ecuador
-
Estonia
-
Egypt
-
Western Sahara
-
Eritrea
-
Spain
-
Ethiopia
-
European Union
-
Finland
-
Fiji
-
Falkland Islands
-
Micronesia
-
Faroe Islands
-
France
-
Gabon
-
England
-
Grenada
-
Georgia
-
French Guiana
-
Ghana
-
Gibraltar
-
Greenland
-
Gambia
-
Guinea
-
Guadeloupe
-
Equatorial Guinea
-
Greece
-
Sandwich Islands
-
Guatemala
-
Guam
-
Guinea-Bissau
-
Guyana
-
Hong Kong
-
Heard Island
-
Honduras
-
Croatia
-
Haiti
-
Hungary
-
Indonesia
-
Ireland
-
Israel
-
India
-
Indian Ocean Territory
-
Iraq
-
Iran
-
Iceland
-
Italy
-
Jamaica
-
Jordan
-
Japan
-
Kenya
-
Kyrgyzstan
-
Cambodia
-
Kiribati
-
Comoros
-
Saint Kitts and Nevis
-
North Korea
-
South Korea
-
Kuwait
-
Cayman Islands
-
Kazakhstan
-
Laos
-
Lebanon
-
Saint Lucia
-
Liechtenstein
-
Sri Lanka
-
Liberia
-
Lesotho
-
Lithuania
-
Luxembourg
-
Latvia
-
Libya
-
Morocco
-
Monaco
-
Moldova
-
Montenegro
-
Madagascar
-
Marshall Islands
-
MacEdonia
-
Mali
-
Burma
-
Mongolia
-
MacAu
-
Northern Mariana Islands
-
Martinique
-
Mauritania
-
Montserrat
-
Malta
-
Mauritius
-
Maldives
-
Malawi
-
Mexico
-
Malaysia
-
Mozambique
-
Namibia
-
New Caledonia
-
Niger
-
Norfolk Island
-
Nigeria
-
Nicaragua
-
Netherlands
-
Norway
-
Nepal
-
Nauru
-
Niue
-
New Zealand
-
Oman
-
Panama
-
Peru
-
French Polynesia
-
New Guinea
-
Philippines
-
Pakistan
-
Poland
-
Saint Pierre
-
Pitcairn Islands
-
Puerto Rico
-
Palestine
-
Portugal
-
Palau
-
Paraguay
-
Qatar
-
Reunion
-
Romania
-
Serbia
-
Russia
-
Rwanda
-
Saudi Arabia
-
Solomon Islands
-
Seychelles
-
Sudan
-
Sweden
-
Singapore
-
Saint Helena
-
Slovenia
-
Svalbard, I Flag Jan Mayen
-
Slovakia
-
Sierra Leone
-
San Marino
-
Senegal
-
Somalia
-
Suriname
-
Sao Tome
-
El Salvador
-
Syria
-
Swaziland
-
Caicos Islands
-
Chad
-
French Territories
-
Togo
-
Thailand
-
Tajikistan
-
Tokelau
-
Timorleste
-
Turkmenistan
-
Tunisia
-
Tonga
-
Turkey
-
Trinidad
-
Tuvalu
-
Taiwan
-
Tanzania
-
Ukraine
-
Uganda
-
Us Minor Islands
-
United States
-
Uruguay
-
Uzbekistan
-
Vatican City
-
Saint Vincent
-
Venezuela
-
British Virgin Islands
-
Us Virgin Islands
-
Vietnam
-
Vanuatu
-
Wallis and Futuna
-
Samoa
-
Yemen
-
Mayotte
-
South Africa
-
Zambia
-
Zimbabwe
-
-
+
+
+
-
-
- - Filter Posts -
-
- Filter -
-
-
- Tag A -
-
-
- Tag B -
-
-
- Tag C -
-
-
- Tag D -
-
-
- -
-
-

- Progress -

-
-
-
-
-
86% Complete
-
+ } + } + }; + // attach events + $demo + .shape() + ; + $directionButton + .on('click', handler.rotate) + .popup({ + position : 'bottom center' + }) + ; + }) +; + +
-
-
-
Completed!
-
+
+

+ Sidebar +

+
-
-
-
-
-
20 Files Uploaded!
-
+
+ + +
-
-
-
-
-
-
-
-
+ - -
-
-

- Segment -

-
-
-
-
-
-
-
-
-
-
-
-

- Input -

-
- - -
Search
-
+
+
+ Left +
+
+ Right +
+
+ Top +
+
+ Bottom +
+
- -
- -
- -
-
+ - -
-
- http:// -
- - -
+
Animation
+
+ Overlay +
+
+ Push +
+
+ Scale Down +
- -
- - Label - - -
- -
- - - Label - -
-
-
-

- Checkbox -

-
- - -
+
Horizontal-Only Animation
+
+ Uncover +
+
+ Slide Along +
+
+ Slide Out +
+
- -
-
-
-
- - -
-
-
-
- - -
-
-
-
- - -
-
-
-
- - -
-
-
-
- -
- - -
+
+ File Permissions + Share on Social + Share by E-mail + Edit Permissions + Delete Permanently +
- -
- - -
+
+ + + Home + + + + Topics + + + + Friends + + + + History + + + + Messages + + + + Discussions + + + + Achievements + + + + Store + + + + Settings + +
- -
+
+
+
+
+

New Content Awaits

+
+
+
+
+
+
+ +
+
+ +
+
+
+
+ +
+ + + Home + + + + Topics + + + + Friends + + + + History + + + + Messages + + + + Discussions + + + + Achievements + + + + Store + + + + Settings + +
+ + + + +
+ +
+

+ Tab +

+
+
+ First + Second + Third +
+
+
+ 1A + 1B + 1C +
+
1A
+
1B
+
1C
+
+
+
+ 2A + 2B + 2C +
+
2A
+
2B
+
2C
+
+
+
+ 3A + 3B + 3C +
+
3A
+
3B
+
3C
+
+
+ + + +
+ +
+

+ Transition +

+
+ +
+ + + + +
+ +
Flash
+
Shake
+
Pulse
+
Tada
+
Bounce
+
Drop
+
Browse
+
Horizontal Flip
+
Vertical Flip
+
Fade
+
Fade Up
+
Fade Down
+
Scale
+
Slide Down
+
Slide Up
+ +
+ + +