illusion 1.1.0 → 2.0.0

Sign up to get free protection for your applications and to get access to all the features.
@@ -0,0 +1,111 @@
1
+ // Variables for in this file
2
+ // If you want to change this number add the responsivemneu.scss file to your main
3
+ // SCSS file and define the variable to your new wisth first like so:
4
+ //
5
+ // $screenwidth: 800px;
6
+ // @import "responsivemenu";
7
+ //
8
+ // This way you don't have to touch this file
9
+
10
+ $screenwidth: 600px !default;
11
+
12
+ // Accessible hide
13
+ %accessible-hide {
14
+ position: absolute !important;
15
+ overflow: hidden !important;
16
+ clip: rect(0 0 0 0) !important;
17
+ height: 1px !important;
18
+ width: 1px !important;
19
+ margin: -1px !important;
20
+ padding: 0 !important;
21
+ border: 0 !important;
22
+ }
23
+
24
+ // Sticky
25
+ .sticky {
26
+ position: fixed !important;
27
+ top: 0 !important;
28
+ left: 0 !important;
29
+ right: 0 !important;
30
+ }
31
+
32
+ // Overflow
33
+ .bodyoverflowhidden {
34
+ position: relative;
35
+ overflow: hidden;
36
+ }
37
+
38
+ .menuoverflowauto {
39
+ max-height: 100%;
40
+ width: 100%;
41
+ overflow: auto;
42
+ }
43
+
44
+ // Absolute menu
45
+ .absolutemenu {
46
+ position: absolute !important;
47
+ top: 100% !important;
48
+ left: 0 !important;
49
+ right: 0 !important;
50
+ z-index: 99;
51
+ }
52
+
53
+ /* Extend the accessible hide class to the closed class class */
54
+ /* Only when JS is enabled since we add the closed class in the markup */
55
+ .js-enabled:not(.no-responsive-menu) {
56
+ .closed {
57
+ @extend %accessible-hide;
58
+ }
59
+ }
60
+
61
+ /* The menu itself */
62
+ .navigation_container {
63
+
64
+ li {
65
+ position: relative;
66
+
67
+ /* initially hide all li>ul so we get a small list when JS is disabled */
68
+ ul {
69
+ display: none;
70
+ }
71
+
72
+ /* And show them on active/current items */
73
+ &.active,
74
+ &.current {
75
+ & > ul {
76
+ display: block;
77
+ }
78
+ }
79
+ }
80
+
81
+ // Show li>ul on small screens when JS is enabled
82
+ &.initiated {
83
+ li ul {
84
+ display: block;
85
+ }
86
+ }
87
+
88
+ @media screen and (min-width: $screenwidth) {
89
+
90
+ // Add styling for parents to show it has children
91
+ li.parent > a:after {
92
+ content: " \25bc";
93
+ }
94
+
95
+ /* Hide li>ul when JS is enabled and screen is big */
96
+ &.initiated li ul,
97
+ li ul,
98
+ li.active ul {
99
+ display: none;
100
+ position: absolute;
101
+ left: 0;
102
+ top: 100%;
103
+ z-index: 9;
104
+ }
105
+
106
+ /* And show on hover */
107
+ li:hover > ul {
108
+ display: block;
109
+ }
110
+ }
111
+ }
metadata CHANGED
@@ -1,23 +1,23 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: illusion
3
3
  version: !ruby/object:Gem::Version
4
- version: 1.1.0
4
+ version: 2.0.0
5
5
  platform: ruby
6
6
  authors:
7
7
  - Tom Janssens
8
8
  autorequire:
9
9
  bindir: bin
10
10
  cert_chain: []
11
- date: 2014-08-28 00:00:00.000000000 Z
11
+ date: 2014-09-18 00:00:00.000000000 Z
12
12
  dependencies:
13
13
  - !ruby/object:Gem::Dependency
14
- name: shoulda
14
+ name: bundler
15
15
  requirement: !ruby/object:Gem::Requirement
16
16
  requirements:
17
17
  - - ">="
18
18
  - !ruby/object:Gem::Version
19
19
  version: '0'
20
- type: :development
20
+ type: :runtime
21
21
  prerelease: false
22
22
  version_requirements: !ruby/object:Gem::Requirement
23
23
  requirements:
@@ -25,47 +25,89 @@ dependencies:
25
25
  - !ruby/object:Gem::Version
26
26
  version: '0'
27
27
  - !ruby/object:Gem::Dependency
28
- name: rdoc
28
+ name: github-pages
29
29
  requirement: !ruby/object:Gem::Requirement
30
30
  requirements:
31
- - - "~>"
31
+ - - ">="
32
32
  - !ruby/object:Gem::Version
33
- version: '3.12'
34
- type: :development
33
+ version: '0'
34
+ type: :runtime
35
35
  prerelease: false
36
36
  version_requirements: !ruby/object:Gem::Requirement
37
37
  requirements:
38
- - - "~>"
38
+ - - ">="
39
39
  - !ruby/object:Gem::Version
40
- version: '3.12'
40
+ version: '0'
41
41
  - !ruby/object:Gem::Dependency
42
- name: bundler
42
+ name: susy
43
+ requirement: !ruby/object:Gem::Requirement
44
+ requirements:
45
+ - - ">="
46
+ - !ruby/object:Gem::Version
47
+ version: '0'
48
+ type: :runtime
49
+ prerelease: false
50
+ version_requirements: !ruby/object:Gem::Requirement
51
+ requirements:
52
+ - - ">="
53
+ - !ruby/object:Gem::Version
54
+ version: '0'
55
+ - !ruby/object:Gem::Dependency
56
+ name: illusion
57
+ requirement: !ruby/object:Gem::Requirement
58
+ requirements:
59
+ - - ">="
60
+ - !ruby/object:Gem::Version
61
+ version: '0'
62
+ type: :runtime
63
+ prerelease: false
64
+ version_requirements: !ruby/object:Gem::Requirement
65
+ requirements:
66
+ - - ">="
67
+ - !ruby/object:Gem::Version
68
+ version: '0'
69
+ - !ruby/object:Gem::Dependency
70
+ name: shoulda
43
71
  requirement: !ruby/object:Gem::Requirement
44
72
  requirements:
45
- - - "~>"
73
+ - - ">="
46
74
  - !ruby/object:Gem::Version
47
- version: '1.0'
48
- type: :development
75
+ version: '0'
76
+ type: :runtime
49
77
  prerelease: false
50
78
  version_requirements: !ruby/object:Gem::Requirement
51
79
  requirements:
52
- - - "~>"
80
+ - - ">="
53
81
  - !ruby/object:Gem::Version
54
- version: '1.0'
82
+ version: '0'
83
+ - !ruby/object:Gem::Dependency
84
+ name: rdoc
85
+ requirement: !ruby/object:Gem::Requirement
86
+ requirements:
87
+ - - ">="
88
+ - !ruby/object:Gem::Version
89
+ version: '0'
90
+ type: :runtime
91
+ prerelease: false
92
+ version_requirements: !ruby/object:Gem::Requirement
93
+ requirements:
94
+ - - ">="
95
+ - !ruby/object:Gem::Version
96
+ version: '0'
55
97
  - !ruby/object:Gem::Dependency
56
98
  name: jeweler
57
99
  requirement: !ruby/object:Gem::Requirement
58
100
  requirements:
59
- - - "~>"
101
+ - - ">="
60
102
  - !ruby/object:Gem::Version
61
- version: 2.0.1
62
- type: :development
103
+ version: '0'
104
+ type: :runtime
63
105
  prerelease: false
64
106
  version_requirements: !ruby/object:Gem::Requirement
65
107
  requirements:
66
- - - "~>"
108
+ - - ">="
67
109
  - !ruby/object:Gem::Version
68
- version: 2.0.1
110
+ version: '0'
69
111
  - !ruby/object:Gem::Dependency
70
112
  name: simplecov
71
113
  requirement: !ruby/object:Gem::Requirement
@@ -73,7 +115,7 @@ dependencies:
73
115
  - - ">="
74
116
  - !ruby/object:Gem::Version
75
117
  version: '0'
76
- type: :development
118
+ type: :runtime
77
119
  prerelease: false
78
120
  version_requirements: !ruby/object:Gem::Requirement
79
121
  requirements:
@@ -92,10 +134,13 @@ files:
92
134
  - README.md
93
135
  - lib/illusion.rb
94
136
  - sass/_illusion.scss
95
- - sass/illusion/_basics.scss
96
- - sass/illusion/_ie.scss
97
- - sass/illusion/_normalize.scss
98
- - sass/illusion/_reset.scss
137
+ - sass/illusion/mixins/_basics.scss
138
+ - sass/illusion/mixins/_breakpoint.scss
139
+ - sass/illusion/placeholders/_placeholders.scss
140
+ - sass/illusion/setup/_boxsizing.scss
141
+ - sass/illusion/variables/_variables.scss
142
+ - sass/illusion/vendor/_normalize.scss
143
+ - sass/illusion/vendor/_responsivemenu.scss
99
144
  homepage: http://github.com/timble/illusion
100
145
  licenses:
101
146
  - MIT
@@ -116,7 +161,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
116
161
  version: '0'
117
162
  requirements: []
118
163
  rubyforge_project:
119
- rubygems_version: 2.2.2
164
+ rubygems_version: 2.3.0
120
165
  signing_key:
121
166
  specification_version: 4
122
167
  summary: Sass mixins.
@@ -1,69 +0,0 @@
1
- $fix-mqs: false !default;
2
-
3
- @mixin respond-min($width) {
4
- // If we're outputting for a fixed media query set...
5
- @if $fix-mqs {
6
- // ...and if we should apply these rules...
7
- @if $fix-mqs >= $width {
8
- // ...output the content the user gave us.
9
- @content;
10
- }
11
- } @else {
12
- // Otherwise, output it using a regular media query
13
- @media screen and (min-width: $width) {
14
- @content;
15
- }
16
- }
17
- }
18
-
19
- @mixin respond-max($width) {
20
- // If we're outputting for a fixed media query set...
21
- @if $fix-mqs {
22
- // ...and if we should apply these rules...
23
- @if $fix-mqs <= $width {
24
- // ...output the content the user gave us.
25
- @content;
26
- }
27
- }
28
- @else {
29
- // Otherwise, output it using a regular media query
30
- @media screen and (max-width: $width) {
31
- @content;
32
- }
33
- }
34
- }
35
-
36
- @mixin respond-min-max($minwidth, $maxwidth) {
37
- // If we're outputting for a fixed media query set...
38
- @if $fix-mqs {
39
- // ...and if we should apply these rules...
40
- @if $fix-mqs <= $maxwidth {
41
- // ...output the content the user gave us.
42
- @content;
43
- }
44
- }
45
- @else {
46
- // Otherwise, output it using a regular media query
47
- @media screen and (min-width: $minwidth) and (max-width: $maxwidth) {
48
- @content;
49
- }
50
- }
51
- }
52
-
53
- $old-ie: false !default;
54
-
55
- @mixin old-ie {
56
- // Only use this content if we're dealing with old IE
57
- @if $old-ie {
58
- @content;
59
- }
60
- }
61
-
62
- $old-ie7: false !default;
63
-
64
- @mixin old-ie7 {
65
- // Only use this content if we're dealing with older IE
66
- @if $old-ie7 {
67
- @content;
68
- }
69
- }
@@ -1,227 +0,0 @@
1
- //
2
- // Reset CSS
3
- // Adapted from http://github.com/necolas/normalize.css
4
- // --------------------------------------------------
5
-
6
- // Display in IE6-9 and FF3
7
- // -------------------------
8
-
9
- article,
10
- aside,
11
- details,
12
- figcaption,
13
- figure,
14
- footer,
15
- header,
16
- hgroup,
17
- nav,
18
- section {
19
- display: block;
20
- }
21
-
22
- // Display block in IE6-9 and FF3
23
- // -------------------------
24
-
25
- audio,
26
- canvas,
27
- video {
28
- display: inline-block;
29
- *display: inline;
30
- *zoom: 1;
31
- }
32
-
33
- // Prevents modern browsers from displaying 'audio' without controls
34
- // -------------------------
35
-
36
- audio:not([controls]) {
37
- display: none;
38
- }
39
-
40
- // Base settings
41
- // -------------------------
42
-
43
- html {
44
- font-size: 100%;
45
- -webkit-text-size-adjust: 100%;
46
- -ms-text-size-adjust: 100%;
47
- }
48
-
49
- // Focus states
50
- a:focus {
51
- @include tab-focus();
52
- }
53
-
54
- // Hover & Active
55
- a:hover,
56
- a:active {
57
- outline: 0;
58
- }
59
-
60
- // Prevents sub and sup affecting line-height in all browsers
61
- // -------------------------
62
-
63
- sub,
64
- sup {
65
- position: relative;
66
- font-size: 75%;
67
- line-height: 0;
68
- vertical-align: baseline;
69
- }
70
-
71
- sup {
72
- top: -0.5em;
73
- }
74
-
75
- sub {
76
- bottom: -0.25em;
77
- }
78
-
79
- // Img border in a's and image quality
80
- // -------------------------
81
-
82
- img {
83
- /* Responsive images (ensure images don't scale beyond their parents) */
84
- max-width: 100%; /* Part 1: Set a maxium relative to the parent */
85
- width: auto\9; /* IE7-8 need help adjusting responsive images */
86
- height: auto; /* Part 2: Scale the height according to the width, otherwise you get stretching */
87
-
88
- vertical-align: middle;
89
- border: 0;
90
- -ms-interpolation-mode: bicubic;
91
- }
92
-
93
- // Prevent max-width from affecting Google Maps
94
- #map_canvas img,
95
- .google-maps img {
96
- max-width: none;
97
- }
98
-
99
- // Forms
100
- // -------------------------
101
-
102
- // Font size in all browsers, margin changes, misc consistency
103
- button,
104
- input,
105
- select,
106
- textarea {
107
- margin: 0;
108
- font-size: 100%;
109
- vertical-align: middle;
110
- }
111
-
112
- button,
113
- input {
114
- *overflow: visible; // Inner spacing ie IE6/7
115
- line-height: normal; // FF3/4 have !important on line-height in UA stylesheet
116
- }
117
-
118
- button::-moz-focus-inner,
119
- input::-moz-focus-inner {
120
- // Inner padding and border oddities in FF3/4
121
- padding: 0;
122
- border: 0;
123
- }
124
-
125
- button,
126
- html input[type="button"], // Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio` and `video` controls.
127
- input[type="reset"],
128
- input[type="submit"] {
129
- -webkit-appearance: button; // Corrects inability to style clickable `input` types in iOS.
130
- cursor: pointer; // Improves usability and consistency of cursor style between image-type `input` and others.
131
- }
132
-
133
- label,
134
- select,
135
- button,
136
- input[type="button"],
137
- input[type="reset"],
138
- input[type="submit"],
139
- input[type="radio"],
140
- input[type="checkbox"] {
141
- cursor: pointer; // Improves usability and consistency of cursor style between image-type `input` and others.
142
- }
143
-
144
- input[type="search"] {
145
- // Appearance in Safari/Chrome
146
- @include box-sizing(content-box);
147
- -webkit-appearance: textfield;
148
- }
149
-
150
- input[type="search"]::-webkit-search-decoration,
151
- input[type="search"]::-webkit-search-cancel-button {
152
- -webkit-appearance: none; // Inner-padding issues in Chrome OSX, Safari 5
153
- }
154
-
155
- textarea {
156
- overflow: auto; // Remove vertical scrollbar in IE6-9
157
- vertical-align: top; // Readability and alignment cross-browser
158
- }
159
-
160
- // Printing
161
- // -------------------------
162
- // Source: https://github.com/h5bp/html5-boilerplate/blob/master/css/main.css
163
-
164
- @media print {
165
-
166
- * {
167
- text-shadow: none !important;
168
- color: #000 !important; // Black prints faster: h5bp.com/s
169
- background: transparent !important;
170
- box-shadow: none !important;
171
- }
172
-
173
- a,
174
- a:visited {
175
- text-decoration: underline;
176
- }
177
-
178
- a[href]:after {
179
- content: " (" attr(href) ")";
180
- }
181
-
182
- abbr[title]:after {
183
- content: " (" attr(title) ")";
184
- }
185
-
186
- // Don't show links for images, or javascript/internal links
187
- .ir a:after,
188
- a[href^="javascript:"]:after,
189
- a[href^="#"]:after {
190
- content: "";
191
- }
192
-
193
- pre,
194
- blockquote {
195
- border: 1px solid #999;
196
- page-break-inside: avoid;
197
- }
198
-
199
- thead {
200
- display: table-header-group; // h5bp.com/t
201
- }
202
-
203
- tr,
204
- img {
205
- page-break-inside: avoid;
206
- }
207
-
208
- img {
209
- max-width: 100% !important;
210
- }
211
-
212
- @page {
213
- margin: 0.5cm;
214
- }
215
-
216
- p,
217
- h2,
218
- h3 {
219
- orphans: 3;
220
- widows: 3;
221
- }
222
-
223
- h2,
224
- h3 {
225
- page-break-after: avoid;
226
- }
227
- }