concisecss 0.0.3 → 0.0.4

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 (39) hide show
  1. checksums.yaml +4 -4
  2. data/README.md +1 -1
  3. data/app/assets/javascripts/concisecss/close.js +4 -4
  4. data/app/assets/javascripts/concisecss/dropdown.js +30 -30
  5. data/app/assets/javascripts/concisecss/naver.js +348 -348
  6. data/app/assets/javascripts/concisecss/navigation.js +18 -18
  7. data/app/assets/javascripts/concisecss/non-responsive.js +46 -46
  8. data/app/assets/stylesheets/_defaults.scss +55 -58
  9. data/app/assets/stylesheets/base/_blockquotes.scss +32 -32
  10. data/app/assets/stylesheets/base/_container.scss +8 -8
  11. data/app/assets/stylesheets/base/_forms.scss +83 -81
  12. data/app/assets/stylesheets/base/_grid.scss +63 -59
  13. data/app/assets/stylesheets/base/_headings.scss +137 -134
  14. data/app/assets/stylesheets/base/_lists.scss +109 -109
  15. data/app/assets/stylesheets/base/_main.scss +28 -25
  16. data/app/assets/stylesheets/base/_selection.scss +18 -18
  17. data/app/assets/stylesheets/base/_tables.scss +78 -76
  18. data/app/assets/stylesheets/base/_type.scss +50 -50
  19. data/app/assets/stylesheets/concise.scss +7 -12
  20. data/app/assets/stylesheets/generic/_clearfix.scss +9 -9
  21. data/app/assets/stylesheets/generic/_conditional.scss +111 -107
  22. data/app/assets/stylesheets/generic/_helper.scss +81 -81
  23. data/app/assets/stylesheets/generic/_mixins.scss +73 -66
  24. data/app/assets/stylesheets/generic/_normalize.scss +189 -189
  25. data/app/assets/stylesheets/generic/_print.scss +105 -104
  26. data/app/assets/stylesheets/generic/_shared.scss +36 -32
  27. data/app/assets/stylesheets/objects/_badges.scss +43 -43
  28. data/app/assets/stylesheets/objects/_breadcrumbs.scss +30 -30
  29. data/app/assets/stylesheets/objects/_buttons.scss +264 -264
  30. data/app/assets/stylesheets/objects/_colors.scss +28 -25
  31. data/app/assets/stylesheets/objects/_dropdowns.scss +153 -153
  32. data/app/assets/stylesheets/objects/_groups.scss +82 -82
  33. data/app/assets/stylesheets/objects/_navigation.scss +330 -325
  34. data/app/assets/stylesheets/objects/_progress.scss +92 -88
  35. data/app/assets/stylesheets/objects/_wells.scss +93 -93
  36. data/lib/concisecss/concisecss_source.rb +1 -6
  37. data/lib/concisecss/version.rb +1 -1
  38. metadata +2 -3
  39. data/app/assets/stylesheets/generic/_debug.scss +0 -98
@@ -1,167 +1,167 @@
1
1
  @if $use-dropdowns == true {
2
- //------------------------------------//
3
- // $DROPDOWNS
4
- //------------------------------------//
5
- .dropdown {
6
- cursor: pointer;
7
- outline: none;
8
- position: relative;
9
- width: auto;
10
-
11
- .dropdown-menu {
12
- background-color: #fff;
13
- border: 1px solid #eee;
14
- border-radius: inherit;
15
- font-weight: inherit;
16
- left: 0;
17
- margin-left: 0px;
18
- opacity: 0;
19
- pointer-events: none;
20
- position: absolute;
21
- right: 0;
22
- text-transform: none;
23
- z-index: 99999;
24
-
25
- @include vendor(transition, all 0.3s ease-in);
26
-
27
- a { text-decoration: none; }
28
-
29
- p {
30
- margin: 0;
31
- padding: 10px 15px;
32
- }
33
-
34
- span { line-height: inherit; }
35
-
36
- img {
37
- padding: 15px;
38
- width: 100%;
39
- }
40
-
41
- iframe {
42
- height: auto;
43
- padding: 15px;
44
- width: 100%;
45
- }
46
-
47
- img + p, iframe + p { padding-top: 0px; }
48
-
49
- hr { margin: 10px; }
50
- }
51
-
52
- ul.dropdown-menu { list-style-type: none; }
53
-
54
- .dropdown-menu {
55
- li {
56
- display: block;
57
- padding: 5px 10px;
58
-
59
- @include vendor(transition, all 0.3s ease-out);
60
- }
61
-
62
-
63
- // Rounded corners
64
- &.border-radius li {
65
- &:first-of-type { border-radius: $border-radius $border-radius 0 0; }
66
-
67
- &:last-of-type { border-radius: 0 0 $border-radius $border-radius; }
68
- }
69
-
70
- li:hover { background-color: #f3f8f8; }
71
- }
2
+ //------------------------------------
3
+ // DROPDOWNS
4
+ //------------------------------------
5
+ .dropdown {
6
+ cursor: pointer;
7
+ outline: none;
8
+ position: relative;
9
+ width: auto;
10
+
11
+ .dropdown-menu {
12
+ background-color: #fff;
13
+ border: 1px solid #eee;
14
+ border-radius: inherit;
15
+ font-weight: inherit;
16
+ left: 0;
17
+ margin-left: 0px;
18
+ opacity: 0;
19
+ pointer-events: none;
20
+ position: absolute;
21
+ right: 0;
22
+ text-transform: none;
23
+ z-index: 99999;
24
+
25
+ @include vendor(transition, all 0.3s ease-in);
26
+
27
+ a { text-decoration: none; }
28
+
29
+ p {
30
+ margin: 0;
31
+ padding: 10px 15px;
32
+ }
33
+
34
+ span { line-height: inherit; }
35
+
36
+ img {
37
+ padding: 15px;
38
+ width: 100%;
39
+ }
40
+
41
+ iframe {
42
+ height: auto;
43
+ padding: 15px;
44
+ width: 100%;
45
+ }
46
+
47
+ img + p, iframe + p { padding-top: 0px; }
48
+
49
+ hr { margin: 10px; }
50
+ }
51
+
52
+ ul.dropdown-menu { list-style-type: none; }
53
+
54
+ .dropdown-menu {
55
+ li {
56
+ display: block;
57
+ padding: 5px 10px;
72
58
 
73
- &.dropdown-active .dropdown-menu {
74
- opacity: 1;
75
- pointer-events: auto;
76
- }
59
+ @include vendor(transition, all 0.3s ease-out);
60
+ }
61
+
62
+
63
+ // Rounded corners
64
+ &.border-radius li {
65
+ &:first-of-type { border-radius: $border-radius $border-radius 0 0; }
77
66
 
78
- .header {
79
- color: #aaa;
80
- cursor: default;
81
- font-size: 14px;
82
- font-size: 0.9rem;
83
- @include font-size(14px);
84
- margin: 12px 0 0;
85
- padding: 0 0 0 9px;
86
- }
67
+ &:last-of-type { border-radius: 0 0 $border-radius $border-radius; }
68
+ }
69
+
70
+ li:hover { background-color: #f3f8f8; }
71
+ }
72
+
73
+ &.dropdown-active .dropdown-menu {
74
+ opacity: 1;
75
+ pointer-events: auto;
87
76
  }
77
+
78
+ .header {
79
+ color: #aaa;
80
+ cursor: default;
81
+ font-size: 14px;
82
+ font-size: 0.9rem;
83
+ @include font-size(14px);
84
+ margin: 12px 0 0;
85
+ padding: 0 0 0 9px;
86
+ }
87
+ }
88
88
 
89
- @include breakpoint(small) {
90
- .dropdown {
91
- .dropdown-menu { width: 200px; }
92
-
93
- &.dropdown-small .dropdown-menu { width: 150px; }
94
-
95
- &.dropdown-large .dropdown-menu { width: 350px; }
96
-
97
- &.dropdown-full .dropdown-menu { width: 100%; }
98
- }
89
+ @include breakpoint(small) {
90
+ .dropdown {
91
+ .dropdown-menu { width: 200px; }
92
+
93
+ &.dropdown-small .dropdown-menu { width: 150px; }
94
+
95
+ &.dropdown-large .dropdown-menu { width: 350px; }
96
+
97
+ &.dropdown-full .dropdown-menu { width: 100%; }
99
98
  }
99
+ }
100
100
 
101
101
 
102
- // Headers
103
- .dropdown-menu > .header { margin: 0; }
102
+ // Headers
103
+ .dropdown-menu > .header { margin: 0; }
104
104
 
105
- .dropdown {
106
- .header:hover,
107
- li.header:hover { background: none; }
108
-
109
- .dropdown-menu.border-radius { border-radius: $border-radius; }
110
-
111
-
112
- // Arrows
113
- &[class*='dropdown-arrow-'] .dropdown-menu {
114
- margin-top: 10px;
115
-
116
- &:after {
117
- border-color: #fff transparent;
118
- border-style: solid;
119
- bottom: 100%;
120
- border-width: 0 6px 6px 6px;
121
- content: "";
122
- height: 0;
123
- position: absolute;
124
- width: 0;
125
- }
126
-
127
- &:before {
128
- border-color: rgba(0, 0, 0, 0.1) transparent;
129
- border-style: solid;
130
- bottom: 100%;
131
- border-width: 0 8px 8px 8px;
132
- content: "";
133
- height: 0;
134
- position: absolute;
135
- width: 0;
136
- }
137
- }
138
-
139
- &.dropdown-arrow-left .dropdown-menu {
140
- &:after { left: 15px; }
141
-
142
- &:before { left: 13px; }
143
- }
105
+ .dropdown {
106
+ .header:hover,
107
+ li.header:hover { background: none; }
108
+
109
+ .dropdown-menu.border-radius { border-radius: $border-radius; }
110
+
111
+
112
+ // Arrows
113
+ &[class*='dropdown-arrow-'] .dropdown-menu {
114
+ margin-top: 10px;
115
+
116
+ &:after {
117
+ border-color: #fff transparent;
118
+ border-style: solid;
119
+ bottom: 100%;
120
+ border-width: 0 6px 6px 6px;
121
+ content: "";
122
+ height: 0;
123
+ position: absolute;
124
+ width: 0;
125
+ }
126
+
127
+ &:before {
128
+ border-color: rgba(0, 0, 0, 0.1) transparent;
129
+ border-style: solid;
130
+ bottom: 100%;
131
+ border-width: 0 8px 8px 8px;
132
+ content: "";
133
+ height: 0;
134
+ position: absolute;
135
+ width: 0;
136
+ }
137
+ }
138
+
139
+ &.dropdown-arrow-left .dropdown-menu {
140
+ &:after { left: 15px; }
141
+
142
+ &:before { left: 13px; }
143
+ }
144
+
145
+ &.dropdown-arrow-right .dropdown-menu {
146
+ &:after { right: 15px; }
147
+
148
+ &:before { right: 13px; }
149
+ }
150
+
151
+
152
+ // Dropup
153
+ &.up {
154
+ .dropdown-menu { bottom: 100%; }
155
+
156
+ &[class*='dropdown-arrow-'] .dropdown-menu {
157
+ margin-bottom: 10px;
144
158
 
145
- &.dropdown-arrow-right .dropdown-menu {
146
- &:after { right: 15px; }
147
-
148
- &:before { right: 13px; }
149
- }
159
+ &:after, &:before { top: 100%; }
150
160
 
161
+ &:after { border-width: 6px 6px 0 6px; }
151
162
 
152
- // Dropup
153
- &.up {
154
- .dropdown-menu { bottom: 100%; }
155
-
156
- &[class*='dropdown-arrow-'] .dropdown-menu {
157
- margin-bottom: 10px;
158
-
159
- &:after, &:before { top: 100%; }
160
-
161
- &:after { border-width: 6px 6px 0 6px; }
162
-
163
- &:before { border-width: 8px 8px 0 8px; }
164
- }
165
- }
163
+ &:before { border-width: 8px 8px 0 8px; }
164
+ }
166
165
  }
166
+ }
167
167
  }
@@ -1,102 +1,102 @@
1
1
  @if $use-groups == true {
2
- //------------------------------------//
3
- // $GROUPS
4
- //------------------------------------//
5
- .group {
6
- display: inline-block;
7
- vertical-align: bottom;
8
-
9
- &:after {
10
- clear: both;
11
- content: ".";
12
- display: block;
13
- height: 0;
14
- visibility: hidden;
15
- }
2
+ //------------------------------------
3
+ // GROUPS
4
+ //------------------------------------
5
+ .group {
6
+ display: inline-block;
7
+ vertical-align: bottom;
8
+
9
+ &:after {
10
+ clear: both;
11
+ content: ".";
12
+ display: block;
13
+ height: 0;
14
+ visibility: hidden;
16
15
  }
16
+ }
17
17
 
18
- .group-item,
19
- p.group-item {
20
- background-color: #fff;
21
- border: 1px solid #ddd;
22
- color: #666;
23
- padding: 4px 7px;
24
- width: auto;
25
-
26
- &.icon { @include font-size(14px); }
27
- }
28
-
29
- @include breakpoint(small) {
30
- .group-item {
31
- @include font-size($base-font-size);
32
- padding: 6px 12px;
33
- }
34
- }
18
+ .group-item,
19
+ p.group-item {
20
+ background-color: #fff;
21
+ border: 1px solid #ddd;
22
+ color: #666;
23
+ padding: 4px 7px;
24
+ width: auto;
25
+
26
+ &.icon { @include font-size(14px); }
27
+ }
35
28
 
29
+ @include breakpoint(small) {
36
30
  .group-item {
37
- &:hover { background-color: #f9f9f9; }
38
-
39
- &:active {
40
- @include vendor(box-shadow, inset 0 1px 1px rgba(100, 100, 100, 0.1));
41
- }
42
-
43
- &.active,
44
- .active { background-color: #f2f2f2; }
31
+ @include font-size($base-font-size);
32
+ padding: 6px 12px;
45
33
  }
34
+ }
46
35
 
47
- .group > .group-item {
48
- border-radius: 0;
49
- float: left;
50
- margin-left: -1px;
36
+ .group-item {
37
+ &:hover { background-color: #f9f9f9; }
38
+
39
+ &:active {
40
+ @include vendor(box-shadow, inset 0 1px 1px rgba(100, 100, 100, 0.1));
51
41
  }
42
+
43
+ &.active,
44
+ .active { background-color: #f2f2f2; }
45
+ }
52
46
 
47
+ .group > .group-item {
48
+ border-radius: 0;
49
+ float: left;
50
+ margin-left: -1px;
51
+ }
53
52
 
54
- // Full-width
55
- .btn.full { width: 100%; }
56
53
 
54
+ // Full-width
55
+ .btn.full { width: 100%; }
57
56
 
58
- // Rounded corners
59
- .group.border-radius > .group-item {
60
- &:first-child { border-radius: $border-radius 0 0 $border-radius; }
61
-
62
- &:last-child { border-radius: 0 $border-radius $border-radius 0; }
63
- }
57
+
58
+ // Rounded corners
59
+ .group.border-radius > .group-item {
60
+ &:first-child { border-radius: $border-radius 0 0 $border-radius; }
61
+
62
+ &:last-child { border-radius: 0 $border-radius $border-radius 0; }
63
+ }
64
64
 
65
65
 
66
- // Dropdown
67
- .group-item.dropdown .dropdown-menu {
68
- margin-top: 15px;
69
- text-align: inherit;
70
- width: 100%;
71
-
72
- li a {
73
- @include font-size(12px);
74
- padding: 4px 7px;
75
- width: auto;
76
- }
66
+ // Dropdown
67
+ .group-item.dropdown .dropdown-menu {
68
+ margin-top: 15px;
69
+ text-align: inherit;
70
+ width: 100%;
71
+
72
+ li a {
73
+ @include font-size(12px);
74
+ padding: 4px 7px;
75
+ width: auto;
77
76
  }
77
+ }
78
78
 
79
- .group {
80
- &.border-radius .group-item.dropdown {
81
- .dropdown-menu { border-radius: 0px 0px $border-radius $border-radius; }
82
-
83
- &.up .dropdown-menu { border-radius: $border-radius $border-radius 0px 0px; }
84
- }
85
-
86
-
87
- // Caret icon
88
- .caret {
89
- border-top: 4px solid;
90
- border-right: 4px solid transparent;
91
- border-left: 4px solid transparent;
92
- }
79
+ .group {
80
+ &.border-radius .group-item.dropdown {
81
+ .dropdown-menu { border-radius: 0px 0px $border-radius $border-radius; }
82
+
83
+ &.up .dropdown-menu { border-radius: $border-radius $border-radius 0px 0px; }
84
+ }
85
+
86
+
87
+ // Caret icon
88
+ .caret {
89
+ border-top: 4px solid;
90
+ border-right: 4px solid transparent;
91
+ border-left: 4px solid transparent;
93
92
  }
93
+ }
94
94
 
95
- @include breakpoint(small) {
96
- .group .caret {
97
- border-top: 5px solid;
98
- border-right: 5px solid transparent;
99
- border-left: 5px solid transparent;
100
- }
95
+ @include breakpoint(small) {
96
+ .group .caret {
97
+ border-top: 5px solid;
98
+ border-right: 5px solid transparent;
99
+ border-left: 5px solid transparent;
101
100
  }
101
+ }
102
102
  }