susy 2.0.0.alpha.1 → 2.0.0.alpha.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (67) hide show
  1. data/lib/susy.rb +0 -1
  2. data/sass/_susy.scss +3 -54
  3. data/sass/susy/_core.scss +6 -0
  4. data/sass/susy/_helpers.scss +5 -13
  5. data/sass/susy/_math.scss +5 -2
  6. data/sass/susy/_settings.scss +52 -0
  7. data/sass/susy/api/_float.scss +6 -71
  8. data/sass/susy/api/_shared.scss +7 -0
  9. data/sass/susy/api/float/_container.scss +12 -0
  10. data/sass/susy/api/float/_end.scss +21 -0
  11. data/sass/susy/api/float/_isolate.scss +14 -0
  12. data/sass/susy/api/float/_span.scss +23 -0
  13. data/sass/susy/api/shared/_container.scss +22 -0
  14. data/sass/susy/api/shared/_grid-background.scss +20 -0
  15. data/sass/susy/api/shared/_margins.scss +15 -0
  16. data/sass/susy/api/shared/_padding.scss +15 -0
  17. data/sass/susy/helpers/_direction.scss +28 -0
  18. data/sass/susy/helpers/_nth.scss +15 -0
  19. data/sass/susy/helpers/_sass-lists.scss +45 -26
  20. data/sass/susy/language/_shared.scss +6 -0
  21. data/sass/susy/language/_susy.scss +16 -0
  22. data/sass/susy/language/_susy1.scss +9 -0
  23. data/sass/susy/language/shared/_context.scss +35 -0
  24. data/sass/susy/language/shared/_settings.scss +216 -0
  25. data/sass/susy/language/susy/_background.scss +132 -0
  26. data/sass/susy/language/susy/_container.scss +100 -0
  27. data/sass/susy/language/susy/_functions.scss +58 -0
  28. data/sass/susy/language/susy/_gallery.scss +94 -0
  29. data/sass/susy/language/susy/_isolate.scss +51 -0
  30. data/sass/susy/language/susy/_math.scss +153 -0
  31. data/sass/susy/language/susy/_rows.scss +78 -0
  32. data/sass/susy/language/susy/_span.scss +204 -0
  33. data/sass/susy/language/susy1/_settings.scss +60 -0
  34. data/sass/susy/math/_columns.scss +79 -55
  35. data/sass/susy/math/_container.scss +45 -0
  36. data/sass/susy/math/_location.scss +47 -0
  37. data/templates/project/README.md +36 -11
  38. data/templates/project/_base.scss +1 -1
  39. data/templates/project/manifest.rb +0 -3
  40. data/templates/project/screen.scss +1 -1
  41. metadata +33 -45
  42. data/sass/README.md +0 -33
  43. data/sass/susy/_api.scss +0 -39
  44. data/sass/susy/_grids.scss +0 -2
  45. data/sass/susy/_gutters.scss +0 -2
  46. data/sass/susy/_language.scss +0 -3
  47. data/sass/susy/api/_isolation.scss +0 -16
  48. data/sass/susy/grids/_add.scss +0 -10
  49. data/sass/susy/grids/_find.scss +0 -10
  50. data/sass/susy/gutters/_add.scss +0 -10
  51. data/sass/susy/gutters/_find.scss +0 -10
  52. data/sass/susy/helpers/_background-grid.scss +0 -65
  53. data/sass/susy/helpers/_box-sizing.scss +0 -25
  54. data/sass/susy/helpers/_clearfix.scss +0 -51
  55. data/sass/susy/helpers/_columns.scss +0 -15
  56. data/sass/susy/helpers/_find.scss +0 -63
  57. data/sass/susy/helpers/_span-shared.scss +0 -9
  58. data/sass/susy/language/_parse-add.scss +0 -19
  59. data/sass/susy/language/_parse-list.scss +0 -53
  60. data/sass/susy/language/_span.scss +0 -20
  61. data/sass/susy/math/_context.scss +0 -3
  62. data/sass/susy/math/_gutters.scss +0 -11
  63. data/templates/box-sizing/behaviors/box-sizing/boxsizing.htc +0 -399
  64. data/templates/box-sizing/behaviors/box-sizing/boxsizing.php +0 -23
  65. data/templates/box-sizing/manifest.rb +0 -4
  66. data/templates/project/behaviors/box-sizing/boxsizing.htc +0 -399
  67. data/templates/project/behaviors/box-sizing/boxsizing.php +0 -23
@@ -1,65 +0,0 @@
1
- @import "compass/css3/images";
2
-
3
- @mixin background-grid($columns: false, $gutter: false, $color: rgba(#69aedb, .5)) {
4
-
5
- $background-length: length($grids);
6
-
7
- @if not ($columns) {
8
- @for $i from 1 through $background-length {
9
- @if $i == 1 {
10
- @include background-build($columns, $gutter, $color);
11
- }
12
- @else {
13
- $mq: nth(nth($grids, $i), 2);
14
-
15
- $grid: nth(nth($grids, $i), 1);
16
- @include breakpoint($mq) {
17
- @include background-build($grid, $gutter, $color);
18
- }
19
- }
20
- }
21
- }
22
- }
23
-
24
- @mixin background-build($columns, $gutter, $color) {
25
- $columns: find-grid($columns);
26
- $gutter: find-gutter($gutter);
27
-
28
- $stops: background-gradient-stops($columns, $gutter, $color);
29
-
30
- @include background(
31
- linear-gradient(
32
- left, $stops
33
- )
34
- );
35
- }
36
-
37
- //////////////////////////////
38
- // Get the stops of the gradient
39
- //////////////////////////////
40
- @function background-gradient-stops($columns, $gutter, $color) {
41
- $bkg: ();
42
- $count: column-count($columns);
43
-
44
- @for $i from 1 through column-count($columns) {
45
- $bkg: join($bkg, background-column-gradient($i, $columns, $gutter, $color), comma);
46
- }
47
-
48
- @return $bkg;
49
- }
50
-
51
- //////////////////////////////
52
- // Get the columns
53
- //////////////////////////////
54
- @function background-column-gradient($location, $columns, $gutter, $color) {
55
-
56
- @if $location == 1 {
57
- @return $color 0%, $color column-span(1, 1, $columns), transparentize($color, 1) column-span(1, 1, $columns);
58
- }
59
- @if $location == column-count($columns) {
60
- @return transparentize($color, 1) column-span($location - 1, 1, $columns) + gutter-span($gutter, $columns), $color column-span($location - 1, 1, $columns) + gutter-span($gutter, $columns), $color 100%;
61
- }
62
- @if $location > 1 {
63
- @return transparentize($color, 1) column-span($location - 1, 1, $columns) + gutter-span($gutter, $columns), $color column-span($location - 1, 1, $columns) + gutter-span($gutter, $columns), $color column-span($location, 1, $columns), transparentize($color, 1) column-span($location, 1, $columns);
64
- }
65
- }
@@ -1,25 +0,0 @@
1
- @import "compass/css3/shared";
2
-
3
- @mixin box-sizing($bs) {
4
- $bs: unquote($bs);
5
- @include experimental(box-sizing, $bs,
6
- -moz, -webkit, not -o, not -ms, not -khtml, official
7
- );
8
-
9
- @if $bs == 'border-box' {
10
- @if $legacy-support-for-ie6 or $legacy-support-for-ie7 {
11
- *behavior: url("../behaviors/box-sizing/boxsizing.php");
12
- }
13
- }
14
- @else {
15
- *behavior: none;
16
- }
17
- }
18
-
19
- %border-box {
20
- @include box-sizing('border-box');
21
- }
22
-
23
- %content-box {
24
- @include box-sizing('content-box');
25
- }
@@ -1,51 +0,0 @@
1
- $legacy-support-for-ie6: false !default;
2
- $legacy-support-for-ie7: false !default;
3
- $legacy-support-for-mozilla: false !default;
4
-
5
- @mixin clearfix {
6
- @if $legacy-support-for-ie6 and $legacy-support-for-ie7 and not $legacy-support-for-mozilla {
7
- /* for IE 6/7 */
8
- *zoom: expression(this.runtimeStyle.zoom="1", this.appendChild(document.createElement("br")).style.cssText="clear:both;font:0/0 serif");
9
- /* non-JS fallback */
10
- *zoom: 1;
11
-
12
- &:before,
13
- &:after {
14
- content: "";
15
- display: table;
16
- }
17
-
18
- &:after {
19
- clear: both;
20
- }
21
- }
22
- @else if $legacy-support-for-ie6 and $legacy-support-for-ie7 and $legacy-support-for-mozilla {
23
- /* for IE 6/7 */
24
- *zoom: expression(this.runtimeStyle.zoom="1", this.appendChild(document.createElement("br")).style.cssText="clear:both;font:0/0 serif");
25
- /* non-JS fallback */
26
- *zoom: 1;
27
-
28
- &:before,
29
- &:after {
30
- content: ".";
31
- display: block;
32
- height: 0;
33
- overflow: hidden;
34
- }
35
-
36
- &:after {
37
- clear: both;
38
- }
39
- }
40
- @else {
41
- &:after {
42
- content: "";
43
- display: table;
44
- clear: both;
45
- }
46
- }
47
- }
48
-
49
- %clearfix {
50
- @include clearfix;
51
- }
@@ -1,15 +0,0 @@
1
- @function end-row($span, $location, $columns) {
2
- $columns: find-grid($columns);
3
-
4
- @if $location == 'last' or $location == 'omega' {
5
- @return true;
6
- }
7
- @else {
8
- @if $location + ($span - 1) == column-count($columns) {
9
- @return true;
10
- }
11
- @else {
12
- @return false;
13
- }
14
- }
15
- }
@@ -1,63 +0,0 @@
1
- //////////////////////////////
2
- // Find Object
3
- //
4
- // Finds relevant object
5
- // From Singularity
6
- // Must be using Breakpoint to work properly
7
- //////////////////////////////
8
- @function find-object($haystack, $user-object: false) {
9
- $length: length($haystack);
10
-
11
- @if $user-object != false {
12
- @return $user-object;
13
- }
14
- @else if $length > 1 {
15
- $query-min: breakpoint-get-context('min-width');
16
- $query-max: breakpoint-get-context('max-width');
17
-
18
- // If we've got a min-width or max-width
19
- @if $query-min or $query-max {
20
- // Reverse the grid so we can step through it
21
- $reverse-haystack: ();
22
- @for $i from 2 through $length {
23
- $reverse-haystack: append($reverse-haystack, nth($haystack, $i), comma);
24
- }
25
- $reverse-haystack: reverse($reverse-haystack);
26
- $rg-length: $length - 1;
27
-
28
- // Grab the largest and smallest MQs
29
- $smallest: nth(nth($haystack, 2), 2);
30
- $largest: nth(nth($reverse-haystack, 1), 2);
31
- $context: $query-min;
32
-
33
- // @if not ($mobile-first) {
34
- // $context: $query-max;
35
- // }
36
-
37
- // If it's smallest than the smallest MQ, use the 1st grid
38
- @if $context < $smallest {
39
- @return nth($haystack, 1);
40
- }
41
- // If it's larger than or equal to the largest MQ, use the last grid
42
- @else if $context >= $largest {
43
- @return nth(nth($reverse-haystack, 1), 1);
44
- }
45
- @else {
46
- // Loop through each MQ. If the MQ is greather than or equal to the the MQ in question, use it!
47
- @for $j from 1 through $rg-length {
48
- $query: nth(nth($reverse-haystack, $j), 2);
49
- @if $context >= $query {
50
- @return nth(nth($reverse-haystack, $j), 1);
51
- }
52
- }
53
- }
54
-
55
- }
56
- @else {
57
- @return nth($haystack, 1);
58
- }
59
- }
60
- @else {
61
- @return nth($haystack, 1);
62
- }
63
- }
@@ -1,9 +0,0 @@
1
- @mixin span-shared {
2
- @if $include-border-box {
3
- @include box-sizing('border-box');
4
- }
5
-
6
- @if $include-clearfix {
7
- @include clearfix;
8
- }
9
- }
@@ -1,19 +0,0 @@
1
- @function parse-add($definition) {
2
- $grid: ();
3
- $mq: false;
4
- $mq-find: false;
5
-
6
- @each $item in $definition {
7
- @if $item != 'at' and $mq-find != true {
8
- $grid: append($grid, $item, 'space');
9
- }
10
- @else if $item == 'at' {
11
- $mq-find: true;
12
- }
13
- @else {
14
- $mq: $item;
15
- }
16
- }
17
-
18
- @return ($grid $mq);
19
- }
@@ -1,53 +0,0 @@
1
- //////////////////////////////
2
- // Parse natural language string
3
- //
4
- // Retrieve values from the natural language string.
5
- // parse-string($var, $list)
6
- // $var : <string>
7
- // - at/span/of or any other keywords.
8
- // - 'span' queries the unprefixed span declaration.
9
- // - 'at' can also query first, last, alpha, and omega.
10
- // $list : <list>
11
- // - A list like this: last 2 of (1 1 2) push 1
12
- //
13
- //////////////////////////////
14
- @function parse-span-list($var, $list) {
15
-
16
- $found: false;
17
-
18
- $grid: ();
19
-
20
- // Loop through list.
21
- @each $item in $list {
22
-
23
- // if 'span' - return the first numeric.
24
- // if keyword was found - return the following item.
25
- @if (type-of($item) == number and $var == span and $found != 'grid') or $found == true {
26
-
27
- // @if $found == true
28
- @return $item;
29
- }
30
-
31
- // Special handling for Grids
32
- @else if $item == $var and $var == 'of' {
33
- $found: 'grid';
34
- }
35
-
36
- @else if $found == 'grid' {
37
- @if type-of($item) == number {
38
- $grid: append($grid, $item, 'space');
39
- }
40
- @else {
41
- @return $grid;
42
- }
43
- }
44
-
45
- // Any keyword - return the following value.
46
- @else if $item == $var {
47
- $found: true;
48
- }
49
- }
50
-
51
- // Wasn't found.
52
- @return false;
53
- }
@@ -1,20 +0,0 @@
1
- //////////////////////////////
2
- // "Natural Language" Parsing
3
- //
4
- // Keywords:
5
- // span: Column Span
6
- // at: Column Location
7
- // of: Context
8
- // gutters: Gutters
9
- // output: Output
10
- //////////////////////////////
11
- @mixin span($input) {
12
- $span: nth($input, 1);
13
-
14
- $location: parse-span-list('at', $input);
15
- $context: parse-span-list('of', $input);
16
- $gutter: parse-span-list('gutters', $input);
17
- $output: parse-span-list('output', $input);
18
-
19
- @include grid-span($span, $location, $context, $gutter, $output)
20
- }
@@ -1,3 +0,0 @@
1
- @function context($primary, $secondary) {
2
- @return ($primary * $secondary) / 100%;;
3
- }
@@ -1,11 +0,0 @@
1
- @function gutter-span($gutter: false, $columns: false) {
2
-
3
- // Find the columns and gutters
4
- $columns: find-grid($columns);
5
- $gutter: find-gutter($gutter);
6
-
7
- // Combine the columns and gutters
8
- $columns-and-gutters: column-sum($columns, $gutter);
9
-
10
- @return (nth($gutter, 1) / $columns-and-gutters) * 100%
11
- }
@@ -1,399 +0,0 @@
1
- /**
2
- * box-sizing Polyfill
3
- *
4
- * A polyfill for box-sizing: border-box for IE6 & IE7.
5
- *
6
- * JScript
7
- *
8
- * This program is free software: you can redistribute it and/or modify
9
- * it under the terms of the GNU Lesser General Public License as published
10
- * by the Free Software Foundation, either version 3 of the License, or
11
- * (at your option) any later version.
12
- *
13
- * This program is distributed in the hope that it will be useful,
14
- * but WITHOUT ANY WARRANTY; without even the implied warranty of
15
- * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
16
- * GNU Lesser General Public License for more details.
17
- *
18
- * See <http://www.gnu.org/licenses/lgpl-3.0.txt>
19
- *
20
- * @category JScript
21
- * @package box-sizing-polyfill
22
- * @author Christian Schepp Schaefer <schaepp@gmx.de> <http://twitter.com/derSchepp>
23
- * @copyright 2012 Christian Schepp Schaefer
24
- * @license http://www.gnu.org/copyleft/lesser.html The GNU LESSER GENERAL PUBLIC LICENSE, Version 3.0
25
- * @link http://github.com/Schepp/box-sizing-polyfill
26
- *
27
- * PREFACE:
28
- *
29
- * This box-sizing polyfill is based on previous work done by Erik Arvidsson,
30
- * which he published in 2002 on http://webfx.eae.net/dhtml/boxsizing/boxsizing.html.
31
- *
32
- * USAGE:
33
- *
34
- * Add the behavior/HTC after every `box-sizing: border-box;` that you assign:
35
- *
36
- * box-sizing: border-box;
37
- * *behavior: url(/scripts/boxsizing.htc);`
38
- *
39
- * Prefix the `behavior` property with a star, like seen above, so it will only be seen by
40
- * IE6 & IE7, not by IE8+ who already implement box-sizing.
41
- *
42
- * The URL to the HTC file must be relative to your HTML(!) document, not relative to your CSS.
43
- * That's why I'd advise you to use absolute paths like in the example.
44
- *
45
- */
46
- <component lightWeight="true">
47
- <attach event="onpropertychange" onevent="checkPropertyChange()" />
48
- <attach event="ondetach" onevent="restore()" />
49
- <attach event="onresize" for="window" onevent="update()" />
50
- <script type="text/javascript">
51
- //<![CDATA[
52
-
53
- var viewportwidth = (typeof window.innerWidth != 'undefined' ? window.innerWidth : element.document.documentElement.clientWidth);
54
-
55
- // Shortcut for the document object
56
- var doc = element.document;
57
-
58
- // Buffer for multiple resize events
59
- var resizetimeout = null;
60
-
61
- // Don't apply box-sizing to certain elements
62
- var apply = false;
63
- switch(element.nodeName){
64
- case '#comment':
65
- case 'HTML':
66
- case 'HEAD':
67
- case 'TITLE':
68
- case 'SCRIPT':
69
- case 'STYLE':
70
- case 'LINK':
71
- case 'META':
72
- break;
73
-
74
- default:
75
- apply = true;
76
- break;
77
- }
78
-
79
- /*
80
- * update gets called during resize events, then waits until there are no further resize events, and finally triggers a recalculation
81
- */
82
- function update(){
83
- if(resizetimeout !== null){
84
- window.clearTimeout(resizetimeout);
85
- }
86
- resizetimeout = window.setTimeout(function(){
87
- restore();
88
- init();
89
- resizetimeout = null;
90
- },100);
91
- }
92
-
93
- /*
94
- * restore gets called when the behavior is being detached (see event binding at the top),
95
- * resets everything like it was before applying the behavior
96
- */
97
- function restore(){
98
- if(apply){
99
- element.runtimeStyle.removeAttribute("width");
100
- element.runtimeStyle.removeAttribute("height");
101
- }
102
- }
103
-
104
- /*
105
- * init gets called once at the start and then never again,
106
- * triggers box-sizing calculations and updates width and height
107
- */
108
- function init(){
109
- if(apply){
110
- updateBorderBoxWidth();
111
- updateBorderBoxHeight();
112
- }
113
- }
114
-
115
- /*
116
- * checkPropertyChange gets called as soon as an element property changes
117
- * (see event binding at the top), it then checks if any property influencing its
118
- * dimensions was changed and if yes recalculates width and height
119
- */
120
- function checkPropertyChange(){
121
- if(apply){
122
- var pn = event.propertyName;
123
- if(pn === "style.boxSizing" && element.style.boxSizing === ""){
124
- element.style.removeAttribute("boxSizing");
125
- element.runtimeStyle.removeAttribute("boxSizing");
126
- element.runtimeStyle.removeAttribute("width");
127
- element.runtimeStyle.removeAttribute("height");
128
- }
129
- switch (pn){
130
- case "style.width":
131
- case "style.borderLeftWidth":
132
- case "style.borderLeftStyle":
133
- case "style.borderRightWidth":
134
- case "style.borderRightStyle":
135
- case "style.paddingLeft":
136
- case "style.paddingRight":
137
- updateBorderBoxWidth();
138
- break;
139
-
140
- case "style.height":
141
- case "style.borderTopWidth":
142
- case "style.borderTopStyle":
143
- case "style.borderBottomWidth":
144
- case "style.borderBottomStyle":
145
- case "style.paddingTop":
146
- case "style.paddingBottom":
147
- updateBorderBoxHeight();
148
- break;
149
-
150
- case "className":
151
- case "style.boxSizing":
152
- updateBorderBoxWidth();
153
- updateBorderBoxHeight();
154
- break;
155
- }
156
- }
157
- }
158
-
159
- /*
160
- * Helper function, taken from Dean Edward's IE7 framework,
161
- * added by Schepp on 12.06.2010.
162
- * http://code.google.com/p/ie7-js/
163
- *
164
- * Allows us to convert from relative to pixel-values.
165
- */
166
- function getPixelValue(value){
167
- var PIXEL = /^\d+(px)?$/i;
168
- if (PIXEL.test(value)) return parseInt(value);
169
- var style = element.style.left;
170
- var runtimeStyle = element.runtimeStyle.left;
171
- element.runtimeStyle.left = element.currentStyle.left;
172
- element.style.left = value || 0;
173
- value = parseInt(element.style.pixelLeft);
174
- element.style.left = style;
175
- element.runtimeStyle.left = runtimeStyle;
176
-
177
- return value;
178
- }
179
-
180
- function getPixelWidth(object, value){
181
- // For Pixel Values
182
- var PIXEL = /^\d+(px)?$/i;
183
- if (PIXEL.test(value)) return parseInt(value);
184
-
185
- // For Percentage Values
186
- var PERCENT = /^[\d\.]+%$/i;
187
- if (PERCENT.test(value)){
188
- try{
189
- parentWidth = getPixelWidth(object.parentElement,(object.parentElement.currentStyle.width != "auto" ? object.parentElement.currentStyle.width : "100%"));
190
- value = (parseFloat(value) / 100) * parentWidth;
191
- }
192
- catch(e){
193
- value = (parseFloat(value) / 100) * element.document.documentElement.clientWidth;
194
- }
195
- return parseInt(value);
196
- }
197
-
198
- // For EM Values
199
- var style = object.style.left;
200
- var runtimeStyle = object.runtimeStyle.left;
201
- object.runtimeStyle.left = object.currentStyle.left;
202
- object.style.left = value || 0;
203
- value = parseInt(object.style.pixelLeft);
204
- object.style.left = style;
205
- object.runtimeStyle.left = runtimeStyle;
206
-
207
- return value;
208
- }
209
-
210
- function getPixelHeight(object, value){
211
- // For Pixel Values
212
- var PIXEL = /^\d+(px)?$/i;
213
- if (PIXEL.test(value)) return parseInt(value);
214
-
215
- // For Percentage Values
216
- var PERCENT = /^[\d\.]+%$/i;
217
- if (PERCENT.test(value)){
218
- try{
219
- if(object.parentElement.currentStyle.height != "auto"){
220
- switch(object.parentElement.nodeName){
221
- default:
222
- parentHeight = getPixelHeight(object.parentElement,object.parentElement.currentStyle.height);
223
- if(parentHeight !== "auto"){
224
- value = (parseFloat(value) / 100) * parentHeight;
225
- }
226
- else {
227
- value = "auto";
228
- }
229
- break;
230
-
231
- case 'HTML':
232
- parentHeight = element.document.documentElement.clientHeight;
233
- if(parentHeight !== "auto"){
234
- value = (parseFloat(value) / 100) * parentHeight;
235
- }
236
- else {
237
- value = "auto";
238
- }
239
- break;
240
- }
241
- if(value !== "auto") value = parseInt(value);
242
- }
243
- else {
244
- value = "auto";
245
- }
246
- }
247
- catch(e){
248
- value = "auto";
249
- }
250
- return value;
251
- }
252
-
253
- // For EM Values
254
- var style = object.style.left;
255
- var runtimeStyle = object.runtimeStyle.left;
256
- object.runtimeStyle.left = object.currentStyle.left;
257
- object.style.left = value || 0;
258
- value = parseInt(object.style.pixelLeft);
259
- object.style.left = style;
260
- object.runtimeStyle.left = runtimeStyle;
261
-
262
- return value;
263
- }
264
-
265
-
266
- /*
267
- * getBorderWidth & friends
268
- * Border width getters
269
- */
270
- function getBorderWidth(sSide){
271
- if(element.currentStyle["border" + sSide + "Style"] == "none"){
272
- return 0;
273
- }
274
- var n = getPixelValue(element.currentStyle["border" + sSide + "Width"]);
275
- return n || 0;
276
- }
277
- function getBorderLeftWidth() { return getBorderWidth("Left"); }
278
- function getBorderRightWidth() { return getBorderWidth("Right"); }
279
- function getBorderTopWidth() { return getBorderWidth("Top"); }
280
- function getBorderBottomWidth() { return getBorderWidth("Bottom"); }
281
-
282
-
283
- /*
284
- * getPadding & friends
285
- * Padding width getters
286
- */
287
- function getPadding(sSide) {
288
- var n = getPixelValue(element.currentStyle["padding" + sSide]);
289
- return n || 0;
290
- }
291
- function getPaddingLeft() { return getPadding("Left"); }
292
- function getPaddingRight() { return getPadding("Right"); }
293
- function getPaddingTop() { return getPadding("Top"); }
294
- function getPaddingBottom() { return getPadding("Bottom"); }
295
-
296
-
297
-
298
- /*
299
- * getBoxSizing
300
- * Get the box-sizing value for the current element
301
- */
302
- function getBoxSizing(){
303
- var s = element.style;
304
- var cs = element.currentStyle
305
- if(typeof s.boxSizing != "undefined" && s.boxSizing != ""){
306
- return s.boxSizing;
307
- }
308
- if(typeof s["box-sizing"] != "undefined" && s["box-sizing"] != ""){
309
- return s["box-sizing"];
310
- }
311
- if(typeof cs.boxSizing != "undefined" && cs.boxSizing != ""){
312
- return cs.boxSizing;
313
- }
314
- if(typeof cs["box-sizing"] != "undefined" && cs["box-sizing"] != ""){
315
- return cs["box-sizing"];
316
- }
317
- return getDocumentBoxSizing();
318
- }
319
-
320
-
321
- /*
322
- * getDocumentBoxSizing
323
- * Get the default document box sizing (check for quirks mode)
324
- */
325
- function getDocumentBoxSizing(){
326
- if(doc.compatMode === null || doc.compatMode === "BackCompat"){
327
- return "border-box";
328
- }
329
- return "content-box"
330
- }
331
-
332
-
333
- /*
334
- * setBorderBoxWidth & friends
335
- * Width and height setters
336
- */
337
- function setBorderBoxWidth(n){
338
- element.runtimeStyle.width = Math.max(0, n - getBorderLeftWidth() -
339
- getPaddingLeft() - getPaddingRight() - getBorderRightWidth()) + "px";
340
- }
341
- function setBorderBoxHeight(n){
342
- element.runtimeStyle.height = Math.max(0, n - getBorderTopWidth() -
343
- getPaddingTop() - getPaddingBottom() - getBorderBottomWidth()) + "px";
344
- }
345
- function setContentBoxWidth(n){
346
- element.runtimeStyle.width = Math.max(0, n + getBorderLeftWidth() +
347
- getPaddingLeft() + getPaddingRight() + getBorderRightWidth()) + "px";
348
- }
349
- function setContentBoxHeight(n){
350
- element.runtimeStyle.height = Math.max(0, n + getBorderTopWidth() +
351
- getPaddingTop() + getPaddingBottom() + getBorderBottomWidth()) + "px";
352
- }
353
-
354
-
355
- /*
356
- * updateBorderBoxWidth & updateBorderBoxHeight
357
- *
358
- */
359
- function updateBorderBoxWidth() {
360
- if(getDocumentBoxSizing() == getBoxSizing()){
361
- return;
362
- }
363
- var csw = element.currentStyle.width;
364
- if(csw != "auto"){
365
- csw = getPixelWidth(element,csw);
366
- if(getBoxSizing() == "border-box"){
367
- setBorderBoxWidth(parseInt(csw));
368
- }
369
- else{
370
- setContentBoxWidth(parseInt(csw));
371
- }
372
- }
373
- }
374
-
375
- function updateBorderBoxHeight() {
376
- if(getDocumentBoxSizing() == getBoxSizing()){
377
- return;
378
- }
379
- var csh = element.currentStyle.height;
380
- if(csh != "auto"){
381
- csh = getPixelHeight(element,csh);
382
- if(csh !== "auto"){
383
- if(getBoxSizing() == "border-box"){
384
- setBorderBoxHeight(parseInt(csh));
385
- }
386
- else{
387
- setContentBoxHeight(parseInt(csh));
388
- }
389
- }
390
- }
391
- }
392
-
393
-
394
- // Run the calculations
395
- init();
396
-
397
- //]]>
398
- </script>
399
- </component>