@@ -158,57 +159,43 @@
Usage
- The plugin must be initialized once before methods can be accessed
-
-
- $('.shape')
- .shape()
- ;
-
-
+
The plugin must be initialized once before methods can be accessed
+
$('.shape')
+ .shape()
+;
- Transitions automatically assume next side is the next sibling (or first if last element)
-
-
- $('.shape')
- .shape('flip.up')
- ;
-
-
+
Transitions automatically assume next side is the next sibling (or first if last element)
+
$('.shape')
+ .shape('flip.up')
+;
- To manually set the next side to appear use a selector or jQuery object
-
-
- $('.shape')
- .shape('set.nextSide', '.second')
- .shape('flip.up')
- ;
-
-
+
To manually set the next side to appear use a selector or jQuery object
+
$('.shape')
+ .shape('set.nextSide', '.second')
+ .shape('flip.up')
+;
- Any internal method can be invoked programmatically
-
-
- $('.shape')
- .shape('repaint')
- ;
-
-
+
Any internal method can be invoked programmatically
+
$('.shape')
+ .shape('repaint')
+;
Settings
-
Settings can be modified in three different ways.
+
Changing Settings
- A settings object can be passed in when initializing the plugin
-
$('.foo').shape({ moduleName: 'Godzilla'});
+
$('.foo').shape({ moduleName: 'Godzilla'});
- Default settings for the module can be overridden by modifying $.fn.shape.settings.
-
$.fn.shape.settings.moduleName = 'Godzilla';
+
$.fn.shape.settings.moduleName = 'Godzilla';
- Settings can be changed after a module is initialized by calling the 'settings' method on the module with either a settings object or a name, value pair.
-
$('.foo').shape('setting', 'moduleName', 'Godzilla');
+
$('.foo').shape('setting', 'moduleName', 'Godzilla');
-
Settings can also be read programmatically: $('.foo').shape('setting', 'moduleName');
+
Reading Settings
+
Settings can also be read programmatically:
$('.foo').shape('setting', 'moduleName');
+
Defaults
| Setting |
@@ -234,22 +221,22 @@
| selector |
- {
+ {
shape : '.shape',
side : '.side'
-}
+}
|
Object containing selectors used by module. |
| className |
-{
+{
css : 'css',
animating : 'animating',
hidden : 'hidden',
active : 'active'
-}
+}
|
Object containing class names used by module. |
@@ -296,13 +283,12 @@
| errors |
-
- {
- side : 'You tried to switch to a side that does not exist.',
- method : 'The method you called is not defined'
- }
+ |
+ {
+ side : 'You tried to switch to a side that does not exist.',
+ method : 'The method you called is not defined'
+}
|
- Object containing localized error messages. |
diff --git a/docs/stylesheets/example.css b/docs/stylesheets/example.css
index 87b1dd3b5..1f4746519 100755
--- a/docs/stylesheets/example.css
+++ b/docs/stylesheets/example.css
@@ -85,7 +85,7 @@ a:hover {
padding-top: 0px;
}
#example h2 {
- margin: 35px 0px 0px;
+ margin: 35px 0px 30px;
padding-bottom: 10px;
border-bottom: 1px solid #DDDDDD;
}
@@ -102,6 +102,7 @@ a:hover {
background-color: #F0F0F0;
}
#example code {
+ position: relative;
background-color: #F0F0F0;
border: 1px solid #DDDDDD;
padding: 3px 5px;
@@ -131,7 +132,7 @@ a:hover {
#example .segment {
margin: 0px 0px 46px;
padding: 65px 0px 20px;
- background-color: #FAFAFA;
+ background-color: #FFFFFF;
border-bottom: 1px solid #DDDDDD;
}
#example .segment .text {
@@ -217,6 +218,61 @@ a:hover {
#example .settings.table td:first-child {
font-weight: bold;
}
+#example .settings.table td:nth-child(2n) {
+ width: 300px;
+}
+
+#example .code {
+ position: relative;
+ width: 100%;
+ height: 200px;
+ overflow: hidden;
+ top: 0;
+ bottom: 0;
+ left: 0;
+ right: 0;
+}
+#example .code {
+ font-size: 14px;
+ margin: 5px 0px 20px;
+ padding: 5px 0px;
+ border: 1px solid #F0F0F0;
+ border: 1px solid rgba(0, 0, 0, 0.1);
+ border-radius: 3px;
+ background-color: #FFFFFF;
+ background-color: rgba(255, 255, 255, 0.8);
+}
+#example .code .ace_bracket {
+ background-color: rgba(0, 0, 0, 0.05);
+ border: 1px solid rgba(0, 0, 0, 0.1);
+}
+#example .code .ace_scroller {
+ margin: 15px 10px;
+}
+#example .code .ace_content {
+}
+#example .code .ace_string {
+ color: #e82d2d;
+}
+#example .code .ace_cursor {
+ border-left: 1px solid #AAAAAA;
+}
+#example .code .ace_paren {
+ color: #555555;
+}
+#example .code .ace_keyword {
+ color: #555555;
+}
+#example .code .ace_identifier {
+ color: #247992;
+}
+#example .code .ace_scrollbar {
+ overflow: hidden;
+ background-color: #FFFFFF;
+}
+#example .code .ace_punctuation {
+ color: #555555;
+}
@@ -234,7 +290,7 @@ a:hover {
#example .container {
width: auto;
- margin: 0px 0px 0px 395px;
+ margin: 0px 100px 0px 395px;
}
#example .sticky-wrapper.stuck .peek {
margin-left: 0px;
diff --git a/src/modules/ui/shape.js b/src/modules/ui/shape.js
index 7b959924c..bd62597a5 100755
--- a/src/modules/ui/shape.js
+++ b/src/modules/ui/shape.js
@@ -92,7 +92,6 @@ $.fn.shape = function(parameters) {
callback = callback || function() {
module.reset();
module.set.active();
- module.queue.perform();
$.proxy(settings.onChange, $nextSide)();
};
if(settings.useCSS) {
diff --git a/src/ui/flat/button.css b/src/ui/flat/button.css
index aa7c1023f..5eb0e477d 100755
--- a/src/ui/flat/button.css
+++ b/src/ui/flat/button.css
@@ -171,7 +171,7 @@
width: 100%;
height: 100%;
content: '';
- background: #EEEEEE url(../images/throbber-blue-tiny.gif) no-repeat 50% 50%;
+ background: #EEEEEE url(../images/throbber-tiny.gif) no-repeat 50% 50%;
background-position: 50% 50%;
background-repeat: no-repeat;
@@ -194,13 +194,13 @@
/* blue */
.ui.huge.button.loading:after {
- background-image: url(../images/throbber-blue-small.gif);
+ background-image: url(../images/throbber-small.gif);
}
.ui.massive.buttons .button.loading:after,
.ui.gigantic.buttons .button.loading:after,
.ui.massive.button.loading:after,
.ui.gigantic.button.loading:after {
- background-image: url(../images/throbber-blue-medium.gif);
+ background-image: url(../images/throbber-medium.gif);
}
/* grey */
@@ -233,6 +233,7 @@
cursor: default;
position: relative;
+ background-color: #EE141D;
color: #FFFFFF;
text-shadow: none;
@@ -242,25 +243,6 @@
-ms-transition: all 0s linear;
transition: all 0s linear;
}
-.ui.buttons .button.error:after,
-.ui.buttons .button.error.hover:after,
-.ui.buttons .button.error.down:after,
-.ui.button.error:after,
-.ui.button.error.hover:after,
-.ui.button.error.down:after {
- position: absolute;
- top: 0px;
- left: 0px;
- width: 100%;
- height: 100%;
- content: '';
- /* standard */
- background: #EE141D url(../images/button-error.gif) no-repeat 50% 50%;
- -moz-border-radius: 5px;
- -webkit-border-radius: 5px;
- border-radius: 5px;
-}
-
.ui.button.success,
.ui.button.success.hover,
.ui.button.success.down {
@@ -441,6 +423,11 @@
font-weight: bold;
}
+.ui.mini.button,
+.ui.tiny.button {
+ font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
+}
+
/*--------------
Containing Icon
diff --git a/src/ui/images/throbber-tiny.gif b/src/ui/images/throbber-tiny.gif
index 1ca21e60e..c65ee55fd 100755
Binary files a/src/ui/images/throbber-tiny.gif and b/src/ui/images/throbber-tiny.gif differ