From c67d97d9fa9083f8f13b8fc9200acb60d65e62a4 Mon Sep 17 00:00:00 2001 From: jlukic Date: Wed, 21 Aug 2013 18:18:08 -0400 Subject: [PATCH] Fixes sidebar direction issues Former-commit-id: a0678058b341317abf4a2328fb423cb31c445b3f Former-commit-id: 42ce40d14f1c4691b450d6d00ad5c1a2b179ba3a --- build/minified/modules/sidebar.js | 30 ++++++++++--------- build/packaged/modules/sidebar.js | 30 ++++++++++--------- build/uncompressed/elements/button.css | 2 +- build/uncompressed/modules/sidebar.css | 22 +++++++++----- build/uncompressed/modules/sidebar.js | 30 ++++++++++--------- node/docpad.coffee | 7 +++-- node/src/documents/modules/sidebar.html | 19 ++++++++---- .../components/semantic/elements/button.css | 2 +- .../components/semantic/modules/sidebar.css | 22 +++++++++----- .../components/semantic/modules/sidebar.js | 30 ++++++++++--------- node/src/files/stylesheets/semantic.css | 6 ++-- src/elements/button.less | 2 +- src/modules/sidebar.js | 30 ++++++++++--------- src/modules/sidebar.less | 23 ++++++++------ 14 files changed, 145 insertions(+), 110 deletions(-) diff --git a/build/minified/modules/sidebar.js b/build/minified/modules/sidebar.js index 58a9f9d58..35528e6d0 100644 --- a/build/minified/modules/sidebar.js +++ b/build/minified/modules/sidebar.js @@ -141,13 +141,15 @@ $.fn.sidebar = function(parameters) { ? $module.outerHeight() : $module.outerWidth() ; - style = '' - + '' - ; + if(direction !== className.bottom) { + style = '' + + '' + ; + } $head.append(style); module.refresh(); module.debug('Adding body css to head', $style); @@ -187,17 +189,17 @@ $.fn.sidebar = function(parameters) { get: { direction: function() { - if($module.hasClass('top')) { - return 'top'; + if($module.hasClass(className.top)) { + return className.top; } - else if($module.hasClass('right')) { - return 'right'; + else if($module.hasClass(className.right)) { + return className.right; } - else if($module.hasClass('bottom')) { - return 'bottom'; + else if($module.hasClass(className.bottom)) { + return className.bottom; } else { - return 'left'; + return className.left; } }, transitionEvent: function() { diff --git a/build/packaged/modules/sidebar.js b/build/packaged/modules/sidebar.js index 58a9f9d58..35528e6d0 100644 --- a/build/packaged/modules/sidebar.js +++ b/build/packaged/modules/sidebar.js @@ -141,13 +141,15 @@ $.fn.sidebar = function(parameters) { ? $module.outerHeight() : $module.outerWidth() ; - style = '' - + '' - ; + if(direction !== className.bottom) { + style = '' + + '' + ; + } $head.append(style); module.refresh(); module.debug('Adding body css to head', $style); @@ -187,17 +189,17 @@ $.fn.sidebar = function(parameters) { get: { direction: function() { - if($module.hasClass('top')) { - return 'top'; + if($module.hasClass(className.top)) { + return className.top; } - else if($module.hasClass('right')) { - return 'right'; + else if($module.hasClass(className.right)) { + return className.right; } - else if($module.hasClass('bottom')) { - return 'bottom'; + else if($module.hasClass(className.bottom)) { + return className.bottom; } else { - return 'left'; + return className.left; } }, transitionEvent: function() { diff --git a/build/uncompressed/elements/button.css b/build/uncompressed/elements/button.css index 38eca5bb0..d4a063afe 100644 --- a/build/uncompressed/elements/button.css +++ b/build/uncompressed/elements/button.css @@ -258,7 +258,7 @@ .ui.disabled.button.hover, .ui.disabled.button.down { cursor: default; - color: #DDDDDD; + color: #DDDDDD !important; background-color: rgba(50, 50, 50, 0.05) !important; background-image: none !important; text-shadow: none !important; diff --git a/build/uncompressed/modules/sidebar.css b/build/uncompressed/modules/sidebar.css index d2fd0133a..78f9ee239 100644 --- a/build/uncompressed/modules/sidebar.css +++ b/build/uncompressed/modules/sidebar.css @@ -77,14 +77,6 @@ body { -ms-transform: translateX(0%); transform: translateX(0%); } -.ui.active.top.sidebar, -.ui.active.bottom.sidebar { - -webkit-transform: translateY(0%); - -moz-transform: translateY(0%); - -o-transform: translateY(0%); - -ms-transform: translateY(0%); - transform: translateY(0%); -} .ui.active.right.sidebar { -webkit-transform: translateX(-100%); -moz-transform: translateX(-100%); @@ -92,6 +84,20 @@ body { -ms-transform: translateX(-100%); transform: translateX(-100%); } +.ui.active.top.sidebar { + -webkit-transform: translateY(0%); + -moz-transform: translateY(0%); + -o-transform: translateY(0%); + -ms-transform: translateY(0%); + transform: translateY(0%); +} +.ui.active.bottom.sidebar { + -webkit-transform: translateY(-100%); + -moz-transform: translateY(-100%); + -o-transform: translateY(-100%); + -ms-transform: translateY(-100%); + transform: translateY(-100%); +} /******************************* Variations *******************************/ diff --git a/build/uncompressed/modules/sidebar.js b/build/uncompressed/modules/sidebar.js index 58a9f9d58..35528e6d0 100644 --- a/build/uncompressed/modules/sidebar.js +++ b/build/uncompressed/modules/sidebar.js @@ -141,13 +141,15 @@ $.fn.sidebar = function(parameters) { ? $module.outerHeight() : $module.outerWidth() ; - style = '' - + '' - ; + if(direction !== className.bottom) { + style = '' + + '' + ; + } $head.append(style); module.refresh(); module.debug('Adding body css to head', $style); @@ -187,17 +189,17 @@ $.fn.sidebar = function(parameters) { get: { direction: function() { - if($module.hasClass('top')) { - return 'top'; + if($module.hasClass(className.top)) { + return className.top; } - else if($module.hasClass('right')) { - return 'right'; + else if($module.hasClass(className.right)) { + return className.right; } - else if($module.hasClass('bottom')) { - return 'bottom'; + else if($module.hasClass(className.bottom)) { + return className.bottom; } else { - return 'left'; + return className.left; } }, transitionEvent: function() { diff --git a/node/docpad.coffee b/node/docpad.coffee index 83d611cc2..f098d66c3 100755 --- a/node/docpad.coffee +++ b/node/docpad.coffee @@ -2,8 +2,9 @@ # It is simply a CoffeeScript Object which is parsed by CSON docpadConfig = { - outPath: '../docs' - + outPath: '../docs', + renderPasses: 1, + enabledPlugins: handlebars: false html2coffee: false @@ -23,7 +24,7 @@ docpadConfig = { # Check Version # Whether or not to check for newer versions of DocPad checkVersion: true # default - + documentsPaths: [ # default 'documents' ] diff --git a/node/src/documents/modules/sidebar.html b/node/src/documents/modules/sidebar.html index e1117e566..8a50948ba 100755 --- a/node/src/documents/modules/sidebar.html +++ b/node/src/documents/modules/sidebar.html @@ -29,16 +29,23 @@ type : 'UI Module'
Right Sidebar menu
-
One
-
Two
-
Three
+ One + Two + Three
Top Sidebar menu
-
One
-
Two
-
Three
+ One + Two + Three
+
+
Bottom Sidebar menu
+ One + Two + Three +
+
diff --git a/node/src/files/components/semantic/elements/button.css b/node/src/files/components/semantic/elements/button.css index 38eca5bb0..d4a063afe 100644 --- a/node/src/files/components/semantic/elements/button.css +++ b/node/src/files/components/semantic/elements/button.css @@ -258,7 +258,7 @@ .ui.disabled.button.hover, .ui.disabled.button.down { cursor: default; - color: #DDDDDD; + color: #DDDDDD !important; background-color: rgba(50, 50, 50, 0.05) !important; background-image: none !important; text-shadow: none !important; diff --git a/node/src/files/components/semantic/modules/sidebar.css b/node/src/files/components/semantic/modules/sidebar.css index d2fd0133a..78f9ee239 100644 --- a/node/src/files/components/semantic/modules/sidebar.css +++ b/node/src/files/components/semantic/modules/sidebar.css @@ -77,14 +77,6 @@ body { -ms-transform: translateX(0%); transform: translateX(0%); } -.ui.active.top.sidebar, -.ui.active.bottom.sidebar { - -webkit-transform: translateY(0%); - -moz-transform: translateY(0%); - -o-transform: translateY(0%); - -ms-transform: translateY(0%); - transform: translateY(0%); -} .ui.active.right.sidebar { -webkit-transform: translateX(-100%); -moz-transform: translateX(-100%); @@ -92,6 +84,20 @@ body { -ms-transform: translateX(-100%); transform: translateX(-100%); } +.ui.active.top.sidebar { + -webkit-transform: translateY(0%); + -moz-transform: translateY(0%); + -o-transform: translateY(0%); + -ms-transform: translateY(0%); + transform: translateY(0%); +} +.ui.active.bottom.sidebar { + -webkit-transform: translateY(-100%); + -moz-transform: translateY(-100%); + -o-transform: translateY(-100%); + -ms-transform: translateY(-100%); + transform: translateY(-100%); +} /******************************* Variations *******************************/ diff --git a/node/src/files/components/semantic/modules/sidebar.js b/node/src/files/components/semantic/modules/sidebar.js index 58a9f9d58..35528e6d0 100644 --- a/node/src/files/components/semantic/modules/sidebar.js +++ b/node/src/files/components/semantic/modules/sidebar.js @@ -141,13 +141,15 @@ $.fn.sidebar = function(parameters) { ? $module.outerHeight() : $module.outerWidth() ; - style = '' - + '' - ; + if(direction !== className.bottom) { + style = '' + + '' + ; + } $head.append(style); module.refresh(); module.debug('Adding body css to head', $style); @@ -187,17 +189,17 @@ $.fn.sidebar = function(parameters) { get: { direction: function() { - if($module.hasClass('top')) { - return 'top'; + if($module.hasClass(className.top)) { + return className.top; } - else if($module.hasClass('right')) { - return 'right'; + else if($module.hasClass(className.right)) { + return className.right; } - else if($module.hasClass('bottom')) { - return 'bottom'; + else if($module.hasClass(className.bottom)) { + return className.bottom; } else { - return 'left'; + return className.left; } }, transitionEvent: function() { diff --git a/node/src/files/stylesheets/semantic.css b/node/src/files/stylesheets/semantic.css index dbbe426ba..1b7de3cd5 100755 --- a/node/src/files/stylesheets/semantic.css +++ b/node/src/files/stylesheets/semantic.css @@ -630,7 +630,7 @@ a:hover { left: 50%; margin-left: -685px; } -#example.pushed .sticky-wrapper.stuck .peek { +#example.left.pushed .sticky-wrapper.stuck .peek { padding-left: 132.5px; } @@ -1031,7 +1031,7 @@ body.progress .ui.progress .bar { margin-left: 0px; left: 95px; } - #example.pushed .sticky-wrapper.stuck .peek { + #example.left.pushed .sticky-wrapper.stuck .peek { padding-left: 275px; } } @@ -1079,7 +1079,7 @@ body.progress .ui.progress .bar { #example .sticky-wrapper.stuck .peek { margin-left: -780px; } - #example.pushed .main.menu { + #example.left.pushed .main.menu { margin-left: -132px; } } diff --git a/src/elements/button.less b/src/elements/button.less index 08bca6588..78419ea77 100755 --- a/src/elements/button.less +++ b/src/elements/button.less @@ -349,7 +349,7 @@ .ui.disabled.button.hover, .ui.disabled.button.down { cursor: default; - color: #DDDDDD; + color: #DDDDDD !important; background-color: rgba(50, 50, 50, 0.05) !important; background-image: none !important; diff --git a/src/modules/sidebar.js b/src/modules/sidebar.js index 58a9f9d58..35528e6d0 100755 --- a/src/modules/sidebar.js +++ b/src/modules/sidebar.js @@ -141,13 +141,15 @@ $.fn.sidebar = function(parameters) { ? $module.outerHeight() : $module.outerWidth() ; - style = '' - + '' - ; + if(direction !== className.bottom) { + style = '' + + '' + ; + } $head.append(style); module.refresh(); module.debug('Adding body css to head', $style); @@ -187,17 +189,17 @@ $.fn.sidebar = function(parameters) { get: { direction: function() { - if($module.hasClass('top')) { - return 'top'; + if($module.hasClass(className.top)) { + return className.top; } - else if($module.hasClass('right')) { - return 'right'; + else if($module.hasClass(className.right)) { + return className.right; } - else if($module.hasClass('bottom')) { - return 'bottom'; + else if($module.hasClass(className.bottom)) { + return className.bottom; } else { - return 'left'; + return className.left; } }, transitionEvent: function() { diff --git a/src/modules/sidebar.less b/src/modules/sidebar.less index 6ca18daa7..decb48fb5 100755 --- a/src/modules/sidebar.less +++ b/src/modules/sidebar.less @@ -94,22 +94,27 @@ body { -ms-transform: translateX(0%); transform: translateX(0%); } +.ui.active.right.sidebar { + -webkit-transform: translateX(-100%); + -moz-transform: translateX(-100%); + -o-transform: translateX(-100%); + -ms-transform: translateX(-100%); + transform: translateX(-100%); +} -.ui.active.top.sidebar, -.ui.active.bottom.sidebar { +.ui.active.top.sidebar { -webkit-transform: translateY(0%); -moz-transform: translateY(0%); -o-transform: translateY(0%); -ms-transform: translateY(0%); transform: translateY(0%); } - -.ui.active.right.sidebar { - -webkit-transform: translateX(-100%); - -moz-transform: translateX(-100%); - -o-transform: translateX(-100%); - -ms-transform: translateX(-100%); - transform: translateX(-100%); +.ui.active.bottom.sidebar { + -webkit-transform: translateY(-100%); + -moz-transform: translateY(-100%); + -o-transform: translateY(-100%); + -ms-transform: translateY(-100%); + transform: translateY(-100%); }