tagmanager-rails 0.0.1 → 0.0.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.
@@ -1,107 +1,101 @@
1
- .myTag
2
- {
3
- background: none repeat scroll 0 0 #CDE69C;
4
- border: 1px solid #A5D24A;
5
- border-radius: 3px 3px 3px 3px;
6
- color: #638421;
7
-
8
- // to be tested
9
- display: block;
10
- float: left;
11
- //
12
-
13
- font-family: helvetica;
1
+ /*
2
+ * DO NOT EDIT THIS FILE DIRECTLY
3
+ * Compiled from bootstrap-tagmanager.less based on Bootstrap 2.3.1 variables
4
+ * https://github.com/twitter/bootstrap/blob/master/less/variables.less
5
+ */
6
+ .tm-tag {
7
+ color: #555555;
8
+ background-color: #f5f5f5;
9
+ border: #bbbbbb 1px solid;
10
+ box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset;
11
+ display: inline-block;
12
+ border-radius: 3px;
13
+ font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
14
14
  font-size: 13px;
15
- margin-bottom: 5px;
16
- margin-right: 5px;
17
- //padding-top: 6px;
18
- //padding-bottom: 5px;
19
- padding: 6px 5px 5px 5px;
15
+ margin: 0 5px 5px 0;
16
+ padding: 4px;
20
17
  text-decoration: none;
21
-
22
- vertical-align: middle;
23
- line-height: 18px;
24
- height:18px;
18
+ transition: border 0.2s linear 0s, box-shadow 0.2s linear 0s;
25
19
  -moz-transition: border 0.2s linear 0s, box-shadow 0.2s linear 0s;
26
- box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset;
20
+ -webkit-transition: border 0.2s linear 0s, box-shadow 0.2s linear 0s;
21
+ vertical-align: middle;
27
22
  }
28
- .myTagError
29
- {
30
- background-color: #F2DEDE;
31
- }
32
- .myTagRemover
33
- {
34
- color:silver;
35
- }
36
- .tagManager
37
- {
38
- border-radius: 3px 3px 3px 3px;
39
- margin-top:0;
40
- }
41
-
42
- .myFramedTag
43
- {
44
- background: none repeat scroll 0 0 #CDE69C;
45
- border: 1px solid #A5D24A;
46
- border-radius: 3px 3px 3px 3px;
47
- color: #638421;
48
- //display: block;
49
- //float: left;
50
- font-family: helvetica;
51
- font-size: 11px;
52
- margin-bottom: 5px;
53
- margin-right: 5px;
54
- //padding-top: 6px;
55
- //padding-bottom: 5px;
56
- padding: 5px 4px 4px 4px;
23
+ .tm-tag .tm-tag-remove {
24
+ color: #000000;
25
+ font-weight: bold;
26
+ margin-left: 4px;
27
+ opacity: 0.2;
28
+ }
29
+ .tm-tag .tm-tag-remove:hover {
30
+ color: #000000;
57
31
  text-decoration: none;
58
- white-space: nowrap;
59
-
60
- vertical-align: middle;
61
- line-height: 18px;
62
- //height:18px;
63
- -moz-transition: border 0.2s linear 0s, box-shadow 0.2s linear 0s;
64
- box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset;
32
+ opacity: 0.4;
33
+ }
34
+ .tm-tag.tm-tag-warning {
35
+ color: #945203;
36
+ background-color: #f2c889;
37
+ border-color: #f0a12f;
65
38
  }
66
-
67
- .myMinTag
68
- {
69
- background: none repeat scroll 0 0 #CDE69C;
70
- border: 1px solid #A5D24A;
71
- border-radius: 3px 3px 3px 3px;
39
+ .tm-tag.tm-tag-error {
40
+ color: #84212e;
41
+ background-color: #e69ca6;
42
+ border-color: #d24a5d;
43
+ }
44
+ .tm-tag.tm-tag-success {
72
45
  color: #638421;
73
- //display: block;
74
- //float: left;
75
- font-family: helvetica;
76
- font-size: 11px;
46
+ background-color: #cde69c;
47
+ border-color: #a5d24a;
48
+ }
49
+ .tm-tag.tm-tag-info {
50
+ color: #4594b5;
51
+ background-color: #c5eefa;
52
+ border-color: #5dc8f7;
53
+ }
54
+ .tm-tag.tm-tag-inverse {
55
+ color: #cccccc;
56
+ background-color: #555555;
57
+ border-color: #333333;
58
+ box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2) inset;
59
+ }
60
+ .tm-tag.tm-tag-inverse .tm-tag-remove {
61
+ color: #ffffff;
62
+ }
63
+ .tm-tag.tm-tag-large {
64
+ font-size: 16.25px;
65
+ border-radius: 4px;
66
+ padding: 11px 7px;
67
+ }
68
+ .tm-tag.tm-tag-small {
69
+ font-size: 11.049999999999999px;
70
+ border-radius: 3px;
71
+ padding: 2px 4px;
72
+ }
73
+ .tm-tag.tm-tag-mini {
74
+ font-size: 9.75px;
75
+ border-radius: 2px;
76
+ padding: 0px 2px;
77
+ }
78
+ .tm-tag.tm-tag-plain {
79
+ color: #333333;
80
+ box-shadow: none;
81
+ background: none;
82
+ border: none;
83
+ }
84
+ .tm-tag.tm-tag-disabled {
85
+ color: #aaaaaa;
86
+ background-color: #e6e6e6;
87
+ border-color: #cccccc;
88
+ box-shadow: none;
89
+ }
90
+ .tm-tag.tm-tag-disabled .tm-tag-remove {
91
+ display: none;
92
+ }
93
+ input[type="text"].tm-input {
77
94
  margin-bottom: 5px;
78
- margin-right: 5px;
79
- //padding-top: 6px;
80
- //padding-bottom: 5px;
81
- padding: 2px 4px 2px 4px;
82
- text-decoration: none;
83
-
84
- vertical-align: middle;
85
- line-height: 18px;
86
- //height:18px;
87
- -moz-transition: border 0.2s linear 0s, box-shadow 0.2s linear 0s;
88
- box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset;
89
95
  }
90
-
91
- .myMinNonTag
92
- {
93
- font-family: helvetica;
94
- font-size: 11px;
96
+ .control-group.tm-group {
95
97
  margin-bottom: 5px;
96
- margin-right: 5px;
97
- //padding-top: 6px;
98
- //padding-bottom: 5px;
99
- padding: 2px 4px 2px 4px;
100
- text-decoration: none;
101
-
102
- vertical-align: middle;
103
- line-height: 18px;
104
- //height:18px;
105
- -moz-transition: border 0.2s linear 0s, box-shadow 0.2s linear 0s;
106
- box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset;
98
+ }
99
+ .form-horizontal .control-group.tm-group {
100
+ margin-bottom: 15px;
107
101
  }
@@ -1,105 +1,178 @@
1
1
  //
2
- // Bootstrap tagmanager
2
+ // Bootstrap TagManager
3
3
  // --------------------------------------------------
4
4
 
5
- .myTag {
6
- background: none repeat scroll 0 0 @successBackground;
7
- border: 1px solid @linkColor;
8
- border-radius: 3px 3px 3px 3px;
9
- color: @linkColor;
10
- // to be tested
11
- display: block;
12
- float: left;
13
-
14
- font-family: @sansFontFamily;
15
- font-size: @baseFontSize;
16
- margin-bottom: 5px;
17
- margin-right: 5px;
18
- //padding-top: 6px;
19
- //padding-bottom: 5px;
20
- padding: 4px 5px;
21
- text-decoration: none;
5
+ // Tag Variables
6
+ // --------------------------------------------------
22
7
 
23
- vertical-align: middle;
24
- line-height: @baseLineHeight;
25
- height: @baseLineHeight;
26
- -moz-transition: border 0.2s linear 0s, box-shadow 0.2s linear 0s;
27
- box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset;
28
- }
29
- .myTagError {
30
- background-color: @btnDangerBackground;
31
- }
32
- .myTagRemover {
33
- color: @gray;
34
- }
35
- .myTagRemover:hover {
36
- text-decoration: none;
37
- }
38
- .tagManager {
39
- border-radius: 3px 3px 3px 3px;
40
- margin-top:0;
41
- }
8
+ // Colors
9
+ // -------------------------
10
+
11
+ @tagText: @gray;
12
+ @tagBackground: #f5f5f5;
13
+ @tagBorder: #bbb;
14
+
15
+ @tagWarningText: #945203;
16
+ @tagWarningBackground: #f2c889;
17
+ @tagWarningBorder: #f0a12f;
18
+
19
+ @tagErrorText: #84212e;
20
+ @tagErrorBackground: #e69ca6;
21
+ @tagErrorBorder: #d24a5d;
42
22
 
43
- .myFramedTag {
44
- background: none repeat scroll 0 0 @successBackground;
45
- border: 1px solid @linkColor;
46
- border-radius: 3px 3px 3px 3px;
47
- color: @linkColor;
48
- //display: block;
49
- //float: left;
23
+ @tagSuccessText: #638421;
24
+ @tagSuccessBackground: #cde69c;
25
+ @tagSuccessBorder: #a5d24a;
26
+
27
+ @tagInfoText: #4594b5;
28
+ @tagInfoBackground: #c5eefa;
29
+ @tagInfoBorder: #5dc8f7;
30
+
31
+ @tagInverseText: #ccc;
32
+ @tagInverseBackground: @gray;
33
+ @tagInverseBorder: @grayDark;
34
+
35
+ @tagDisabledText: #aaa;
36
+ @tagDisabledBackground: #e6e6e6;
37
+ @tagDisabledBorder: #ccc;
38
+
39
+ // Sizing
40
+ // -------------------------
41
+
42
+ @tagFontSize: 13px;
43
+ @tagFontSizeLarge: @tagFontSize * 1.25; // ~16px
44
+ @tagFontSizeSmall: @tagFontSize * 0.85; // ~11px
45
+ @tagFontSizeMini: @tagFontSize * 0.75; // ~10px
46
+
47
+ @tagPadding: 4px;
48
+ @tagMargin: 5px;
49
+
50
+ // Tag Classes
51
+ // --------------------------------------------------
52
+
53
+ // Base tag class
54
+ // -------------------------
55
+
56
+ .tm-tag {
57
+ color: @tagText;
58
+ background-color: @tagBackground;
59
+ border: @tagBorder 1px solid;
60
+ box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset;
61
+ display: inline-block;
62
+ border-radius: @borderRadiusSmall;
50
63
  font-family: @sansFontFamily;
51
- font-size: @baseFontSize;
52
- margin-bottom: 5px;
53
- margin-right: 5px;
54
- //padding-top: 6px;
55
- //padding-bottom: 5px;
56
- padding: 5px 4px 4px 4px;
64
+ font-size: @tagFontSize;
65
+ margin: 0 @tagMargin @tagMargin 0;
66
+ padding: @tagPadding;
57
67
  text-decoration: none;
58
- white-space: nowrap;
59
-
60
- vertical-align: middle;
61
- line-height: @baseLineHeight;
62
- //height:18px;
68
+ transition: border 0.2s linear 0s, box-shadow 0.2s linear 0s;
63
69
  -moz-transition: border 0.2s linear 0s, box-shadow 0.2s linear 0s;
64
- box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset;
70
+ -webkit-transition: border 0.2s linear 0s, box-shadow 0.2s linear 0s;
71
+ vertical-align: middle;
72
+
73
+ // Remove button
74
+ // -------------------------
75
+
76
+ .tm-tag-remove {
77
+ color: @black;
78
+ font-weight: bold;
79
+ margin-left: @tagPadding;
80
+ opacity: 0.2;
81
+ &:hover {
82
+ color: @black;
83
+ text-decoration: none;
84
+ opacity: 0.4;
85
+ }
86
+ }
87
+
88
+ // Semantic Colors
89
+ // -------------------------
90
+
91
+ &.tm-tag-warning {
92
+ color: @tagWarningText;
93
+ background-color: @tagWarningBackground;
94
+ border-color: @tagWarningBorder;
95
+ }
96
+ &.tm-tag-error {
97
+ color: @tagErrorText;
98
+ background-color: @tagErrorBackground;
99
+ border-color: @tagErrorBorder;
100
+ }
101
+ &.tm-tag-success {
102
+ color: @tagSuccessText;
103
+ background-color: @tagSuccessBackground;
104
+ border-color: @tagSuccessBorder;
105
+ }
106
+ &.tm-tag-info {
107
+ color: @tagInfoText;
108
+ background-color: @tagInfoBackground;
109
+ border-color: @tagInfoBorder;
110
+ }
111
+ &.tm-tag-inverse {
112
+ color: @tagInverseText;
113
+ background-color: @tagInverseBackground;
114
+ border-color: @tagInverseBorder;
115
+ box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2) inset;
116
+ .tm-tag-remove {
117
+ color: @white;
118
+ }
119
+ }
120
+
121
+ // Sizes
122
+ // -------------------------
123
+
124
+ &.tm-tag-large {
125
+ font-size: @tagFontSizeLarge;
126
+ border-radius: @baseBorderRadius;
127
+ padding: 11px 7px;
128
+ }
129
+ &.tm-tag-small {
130
+ font-size: @tagFontSizeSmall;
131
+ border-radius: @borderRadiusSmall;
132
+ padding: 2px 4px;
133
+ }
134
+ &.tm-tag-mini {
135
+ font-size: @tagFontSizeMini;
136
+ border-radius: 2px;
137
+ padding: 0px 2px;
138
+ }
139
+
140
+ // Miscellaneous Styles
141
+ // -------------------------
142
+
143
+ &.tm-tag-plain {
144
+ color: @textColor;
145
+ box-shadow: none;
146
+ background: none;
147
+ border: none;
148
+ }
149
+ &.tm-tag-disabled {
150
+ color: @tagDisabledText;
151
+ background-color: @tagDisabledBackground;
152
+ border-color: @tagDisabledBorder;
153
+ box-shadow: none;
154
+ .tm-tag-remove {
155
+ display: none;
156
+ }
157
+ }
65
158
  }
66
159
 
67
- .myMinTag {
68
- background: none repeat scroll 0 0 @successBackground;
69
- border: 1px solid @linkColor;
70
- border-radius: 3px 3px 3px 3px;
71
- color: @linkColor;
72
- //display: block;
73
- //float: left;
74
- font-family: @sansFontFamily;
75
- font-size: @baseFontSize;
76
- margin-bottom: 5px;
77
- margin-right: 5px;
78
- //padding-top: 6px;
79
- //padding-bottom: 5px;
80
- padding: 2px 4px 2px 4px;
81
- text-decoration: none;
160
+ // Forms
161
+ // --------------------------------------------------
82
162
 
83
- vertical-align: middle;
84
- line-height: @baseLineHeight;
85
- //height:18px;
86
- -moz-transition: border 0.2s linear 0s, box-shadow 0.2s linear 0s;
87
- box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset;
163
+ // Input style (Recommended)
164
+ // -------------------------
165
+
166
+ input[type="text"].tm-input {
167
+ margin-bottom: @tagMargin;
88
168
  }
89
169
 
90
- .myMinNonTag {
91
- font-family: @sansFontFamily;
92
- font-size: @baseFontSize;
93
- margin-bottom: 5px;
94
- margin-right: 5px;
95
- //padding-top: 6px;
96
- //padding-bottom: 5px;
97
- padding: 2px 4px 2px 4px;
98
- text-decoration: none;
170
+ // Form wrappers (Optional)
171
+ // -------------------------
99
172
 
100
- vertical-align: middle;
101
- line-height: 18px;
102
- //height:18px;
103
- -moz-transition: border 0.2s linear 0s, box-shadow 0.2s linear 0s;
104
- box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset;
173
+ .control-group.tm-group {
174
+ margin-bottom: (@baseLineHeight / 2) - @tagMargin;
175
+ }
176
+ .form-horizontal .control-group.tm-group {
177
+ margin-bottom: @baseLineHeight - @tagMargin;
105
178
  }