From 75ad7e4bd7d69243e7e5281c2642f00478fb072d Mon Sep 17 00:00:00 2001 From: Filipp Lepalaan Date: Wed, 19 Feb 2014 18:02:09 +0200 Subject: Added tags, jquery UI --- apps/it/static/js/ui/demos/dialog/animated.html | 52 +++++++ apps/it/static/js/ui/demos/dialog/default.html | 33 +++++ apps/it/static/js/ui/demos/dialog/index.html | 19 +++ .../js/ui/demos/dialog/modal-confirmation.html | 46 ++++++ apps/it/static/js/ui/demos/dialog/modal-form.html | 157 +++++++++++++++++++++ .../static/js/ui/demos/dialog/modal-message.html | 49 +++++++ apps/it/static/js/ui/demos/dialog/modal.html | 38 +++++ 7 files changed, 394 insertions(+) create mode 100644 apps/it/static/js/ui/demos/dialog/animated.html create mode 100644 apps/it/static/js/ui/demos/dialog/default.html create mode 100644 apps/it/static/js/ui/demos/dialog/index.html create mode 100644 apps/it/static/js/ui/demos/dialog/modal-confirmation.html create mode 100644 apps/it/static/js/ui/demos/dialog/modal-form.html create mode 100644 apps/it/static/js/ui/demos/dialog/modal-message.html create mode 100644 apps/it/static/js/ui/demos/dialog/modal.html (limited to 'apps/it/static/js/ui/demos/dialog') diff --git a/apps/it/static/js/ui/demos/dialog/animated.html b/apps/it/static/js/ui/demos/dialog/animated.html new file mode 100644 index 0000000..7bc2620 --- /dev/null +++ b/apps/it/static/js/ui/demos/dialog/animated.html @@ -0,0 +1,52 @@ + + + + + jQuery UI Dialog - Animation + + + + + + + + + + + + + + + + + + +
+

This is an animated dialog which is useful for displaying information. The dialog window can be moved, resized and closed with the 'x' icon.

+
+ + + +
+

Dialogs may be animated by specifying an effect for the show and/or hide properties. You must include the individual effects file for any effects you would like to use.

+
+ + diff --git a/apps/it/static/js/ui/demos/dialog/default.html b/apps/it/static/js/ui/demos/dialog/default.html new file mode 100644 index 0000000..4c45d62 --- /dev/null +++ b/apps/it/static/js/ui/demos/dialog/default.html @@ -0,0 +1,33 @@ + + + + + jQuery UI Dialog - Default functionality + + + + + + + + + + + + + + + +
+

This is the default dialog which is useful for displaying information. The dialog window can be moved, resized and closed with the 'x' icon.

+
+ +
+

The basic dialog window is an overlay positioned within the viewport and is protected from page content (like select elements) shining through with an iframe. It has a title bar and a content area, and can be moved, resized and closed with the 'x' icon by default.

+
+ + diff --git a/apps/it/static/js/ui/demos/dialog/index.html b/apps/it/static/js/ui/demos/dialog/index.html new file mode 100644 index 0000000..6aaa3ec --- /dev/null +++ b/apps/it/static/js/ui/demos/dialog/index.html @@ -0,0 +1,19 @@ + + + + + jQuery UI Dialog Demos + + + + + + + diff --git a/apps/it/static/js/ui/demos/dialog/modal-confirmation.html b/apps/it/static/js/ui/demos/dialog/modal-confirmation.html new file mode 100644 index 0000000..4bcc234 --- /dev/null +++ b/apps/it/static/js/ui/demos/dialog/modal-confirmation.html @@ -0,0 +1,46 @@ + + + + + jQuery UI Dialog - Modal confirmation + + + + + + + + + + + + + + +
+

These items will be permanently deleted and cannot be recovered. Are you sure?

+
+ +

Sed vel diam id libero rutrum convallis. Donec aliquet leo vel magna. Phasellus rhoncus faucibus ante. Etiam bibendum, enim faucibus aliquet rhoncus, arcu felis ultricies neque, sit amet auctor elit eros a lectus.

+ +
+

Confirm an action that may be destructive or important. Set the modal option to true, and specify primary and secondary user actions with the buttons option.

+
+ + diff --git a/apps/it/static/js/ui/demos/dialog/modal-form.html b/apps/it/static/js/ui/demos/dialog/modal-form.html new file mode 100644 index 0000000..b7bc8f9 --- /dev/null +++ b/apps/it/static/js/ui/demos/dialog/modal-form.html @@ -0,0 +1,157 @@ + + + + + jQuery UI Dialog - Modal form + + + + + + + + + + + + + + + + + + +
+

All form fields are required.

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

Existing Users:

+ + + + + + + + + + + + + + + +
NameEmailPassword
John Doejohn.doe@example.comjohndoe1
+
+ + +
+

Use a modal dialog to require that the user enter data during a multi-step process. Embed form markup in the content area, set the modal option to true, and specify primary and secondary user actions with the buttons option.

+
+ + diff --git a/apps/it/static/js/ui/demos/dialog/modal-message.html b/apps/it/static/js/ui/demos/dialog/modal-message.html new file mode 100644 index 0000000..f463ee8 --- /dev/null +++ b/apps/it/static/js/ui/demos/dialog/modal-message.html @@ -0,0 +1,49 @@ + + + + + jQuery UI Dialog - Modal message + + + + + + + + + + + + + + + + +
+

+ + Your files have downloaded successfully into the My Downloads folder. +

+

+ Currently using 36% of your storage space. +

+
+ +

Sed vel diam id libero rutrum convallis. Donec aliquet leo vel magna. Phasellus rhoncus faucibus ante. Etiam bibendum, enim faucibus aliquet rhoncus, arcu felis ultricies neque, sit amet auctor elit eros a lectus.

+ +
+

Use a modal dialog to explicitly acknowledge information or an action before continuing their work. Set the modal option to true, and specify a primary action (Ok) with the buttons option.

+
+ + diff --git a/apps/it/static/js/ui/demos/dialog/modal.html b/apps/it/static/js/ui/demos/dialog/modal.html new file mode 100644 index 0000000..af290d0 --- /dev/null +++ b/apps/it/static/js/ui/demos/dialog/modal.html @@ -0,0 +1,38 @@ + + + + + jQuery UI Dialog - Basic modal + + + + + + + + + + + + + + + +
+

Adding the modal overlay screen makes the dialog look more prominent because it dims out the page content.

+
+ +

Sed vel diam id libero rutrum convallis. Donec aliquet leo vel magna. Phasellus rhoncus faucibus ante. Etiam bibendum, enim faucibus aliquet rhoncus, arcu felis ultricies neque, sit amet auctor elit eros a lectus.

+ +
+

A modal dialog prevents the user from interacting with the rest of the page until it is closed.

+
+ + -- cgit v1.2.3