tagmanager-rails 0.0.1 → 0.0.2

Sign up to get free protection for your applications and to get access to all the features.
@@ -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
  }