1
1
<?php
2
- if (! defined ('ISLOADEDBYSTEELSHEET ' )) die ( ' Must be call by steelsheet ' ); ?>
3
- /* <style type="text/css" > */
4
- /*
5
- Badge style is based on boostrap framework
6
- */
2
+ if (!defined ('ISLOADEDBYSTEELSHEET ' )) {
3
+ die ( ' Must be call by steelsheet ' );
4
+ }
5
+ ?>
6
+ /* Badge style is based on boostrap framework */
7
7
8
8
.badge {
9
- display: inline-block;
10
- font-size: 80%;
11
- font-weight: 700 !important;
12
- line-height: 1;
13
- text-align: center;
14
- white-space: nowrap;
15
- vertical-align: baseline;
16
- border-radius: .25rem;
17
- transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
18
- border-width: 2px;
19
- border-style: solid;
20
- border-color: rgba(255,255,255,0);
21
- box-sizing: border-box;
9
+ display: inline-block;
10
+ padding: .1em .35em;
11
+ font-size: 80%;
12
+ font-weight: 700 !important;
13
+ line-height: 1;
14
+ text-align: center;
15
+ white-space: nowrap;
16
+ vertical-align: baseline;
17
+ border-radius: .25rem;
18
+ transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
19
+ border-width: 2px;
20
+ border-style: solid;
21
+ border-color: rgba(255,255,255,0);
22
+ box-sizing: border-box;
22
23
}
23
24
24
25
.badge-status {
25
- font-size: 1em ;
26
- padding: .19em .35em; /* more than 0.19 generate a change into heigth of lines */
26
+ font-size: 0.95em ;
27
+ padding: .19em .35em; /* more than 0.19 generate a change into heigth of lines */
27
28
}
28
29
.tabBar .arearef .statusref .badge-status, .tabBar .arearefnobottom .statusref .badge-status {
29
30
font-size: 1.1em;
39
40
}
40
41
41
42
.badge-pill, .tabs .badge {
42
- padding-right: .5em;
43
- padding-left: .5em;
44
- border-radius: 0.25rem;
43
+ padding-right: .5em;
44
+ padding-left: .5em;
45
+ border-radius: 0.25rem;
45
46
}
46
47
47
48
.badge-dot {
48
- border-radius: 50%;
49
- padding: 0.45em;
50
- vertical-align: text-top;
49
+ padding: 0;
50
+ border-radius: 50%;
51
+ padding: 0.45em;
52
+ vertical-align: text-top;
51
53
}
52
54
53
55
a.badge:focus, a.badge:hover {
54
- text-decoration: none;
56
+ text-decoration: none;
55
57
}
56
58
57
59
.liste_titre .badge:not(.nochangebackground) {
58
- background-color: <?php print $ badgeSecondary ; ?> ;
59
- color: #fff;
60
+ background-color: <?php print $ badgeSecondary ; ?> ;
61
+ color: #fff;
62
+ }
63
+
64
+ span.badgeneutral {
65
+ padding: 2px 7px 2px 7px;
66
+ background-color: #e4e4e4;
67
+ color: #666;
68
+ border-radius: 10px;
69
+ white-space: nowrap;
60
70
}
61
71
62
72
63
73
/* PRIMARY */
64
74
.badge-primary{
65
- color: #fff !important;
66
- background-color: <?php print $ badgePrimary ; ?> ;
75
+ color: #fff !important;
76
+ background-color: <?php print $ badgePrimary ; ?> ;
67
77
}
68
78
a.badge-primary.focus, a.badge-primary:focus {
69
- outline: 0;
70
- box-shadow: 0 0 0 0.2rem <?php print colorHexToRgb ($ badgePrimary , 0.5 ); ?> ;
79
+ outline: 0;
80
+ box-shadow: 0 0 0 0.2rem <?php print colorHexToRgb ($ badgePrimary , 0.5 ); ?> ;
71
81
}
72
82
a.badge-primary:focus, a.badge-primary:hover {
73
- color: #fff !important;
74
- background-color: <?php print colorDarker ($ badgePrimary , 10 ); ?> ;
83
+ color: #fff !important;
84
+ background-color: <?php print colorDarker ($ badgePrimary , 10 ); ?> ;
75
85
}
76
86
77
87
/* SECONDARY */
78
88
.badge-secondary, .tabs .badge {
79
- color: #fff !important;
80
- background-color: <?php print $ badgeSecondary ; ?> ;
89
+ color: #fff !important;
90
+ background-color: <?php print $ badgeSecondary ; ?> ;
81
91
}
82
92
a.badge-secondary.focus, a.badge-secondary:focus {
83
- outline: 0;
84
- box-shadow: 0 0 0 0.2rem <?php print colorHexToRgb ($ badgeSecondary , 0.5 ); ?> ;
93
+ outline: 0;
94
+ box-shadow: 0 0 0 0.2rem <?php print colorHexToRgb ($ badgeSecondary , 0.5 ); ?> ;
85
95
}
86
96
a.badge-secondary:focus, a.badge-secondary:hover {
87
- color: #fff !important;
88
- background-color: <?php print colorDarker ($ badgeSecondary , 10 ); ?> ;
97
+ color: #fff !important;
98
+ background-color: <?php print colorDarker ($ badgeSecondary , 10 ); ?> ;
89
99
}
90
100
91
101
/* SUCCESS */
92
102
.badge-success {
93
- color: #fff !important;
94
- background-color: <?php print $ badgeSuccess ; ?> ;
103
+ color: #fff !important;
104
+ background-color: <?php print $ badgeSuccess ; ?> ;
95
105
}
96
106
a.badge-success.focus, a.badge-success:focus {
97
- outline: 0;
98
- box-shadow: 0 0 0 0.2rem <?php print colorHexToRgb ($ badgeSuccess , 0.5 ); ?> ;
107
+ outline: 0;
108
+ box-shadow: 0 0 0 0.2rem <?php print colorHexToRgb ($ badgeSuccess , 0.5 ); ?> ;
99
109
}
100
110
a.badge-success:focus, a.badge-success:hover {
101
- color: #fff !important;
102
- background-color: <?php print colorDarker ($ badgeSuccess , 10 ); ?> ;
111
+ color: #fff !important;
112
+ background-color: <?php print colorDarker ($ badgeSuccess , 10 ); ?> ;
103
113
}
104
114
105
115
/* DANGER */
106
116
.badge-danger {
107
- color: #fff !important;
108
- background-color: <?php print $ badgeDanger ; ?> ;
117
+ color: #fff !important;
118
+ background-color: <?php print $ badgeDanger ; ?> ;
109
119
}
110
120
a.badge-danger.focus, a.badge-danger:focus {
111
- outline: 0;
112
- box-shadow: 0 0 0 0.2rem <?php print colorHexToRgb ($ badgeDanger , 0.5 ); ?> ;
121
+ outline: 0;
122
+ box-shadow: 0 0 0 0.2rem <?php print colorHexToRgb ($ badgeDanger , 0.5 ); ?> ;
113
123
}
114
124
a.badge-danger:focus, a.badge-danger:hover {
115
- color: #fff !important;
116
- background-color: <?php print colorDarker ($ badgeDanger , 10 ); ?> ;
125
+ color: #fff !important;
126
+ background-color: <?php print colorDarker ($ badgeDanger , 10 ); ?> ;
117
127
}
118
128
119
129
/* WARNING */
122
132
background-color: <?php print $ badgeWarning ; ?> ;
123
133
}
124
134
a.badge-warning.focus, a.badge-warning:focus {
125
- outline: 0;
126
- box-shadow: 0 0 0 0.2rem <?php print colorHexToRgb ($ badgeWarning , 0.5 ); ?> ;
135
+ outline: 0;
136
+ box-shadow: 0 0 0 0.2rem <?php print colorHexToRgb ($ badgeWarning , 0.5 ); ?> ;
127
137
}
128
138
a.badge-warning:focus, a.badge-warning:hover {
129
- color: #212529 !important;
130
- background-color: <?php print colorDarker ($ badgeWarning , 10 ); ?> ;
139
+ color: #212529 !important;
140
+ background-color: <?php print colorDarker ($ badgeWarning , 10 ); ?> ;
131
141
}
132
142
133
143
/* WARNING colorblind */
134
- body[class^ ="colorblind-"] .badge-warning {
144
+ body[class* ="colorblind-"] .badge-warning {
135
145
background-color: <?php print $ colorblind_deuteranopes_badgeWarning ; ?> ;
136
146
}
137
- body[class^ ="colorblind-"] a.badge-warning.focus,body[class^="colorblind-"] a.badge-warning:focus {
147
+ body[class* ="colorblind-"] a.badge-warning.focus,body[class^="colorblind-"] a.badge-warning:focus {
138
148
box-shadow: 0 0 0 0.2rem <?php print colorHexToRgb ($ colorblind_deuteranopes_badgeWarning , 0.5 ); ?> ;
139
149
}
140
- body[class^ ="colorblind-"] a.badge-warning:focus, a.badge-warning:hover {
150
+ body[class* ="colorblind-"] a.badge-warning:focus, a.badge-warning:hover {
141
151
background-color: <?php print colorDarker ($ colorblind_deuteranopes_badgeWarning , 10 ); ?> ;
142
152
}
143
153
144
154
/* INFO */
145
155
.badge-info {
146
- color: #fff !important;
147
- background-color: <?php print $ badgeInfo ; ?> ;
156
+ color: #fff !important;
157
+ background-color: <?php print $ badgeInfo ; ?> ;
148
158
}
149
159
a.badge-info.focus, a.badge-info:focus {
150
- outline: 0;
151
- box-shadow: 0 0 0 0.2rem <?php print colorHexToRgb ($ badgeInfo , 0.5 ); ?> ;
160
+ outline: 0;
161
+ box-shadow: 0 0 0 0.2rem <?php print colorHexToRgb ($ badgeInfo , 0.5 ); ?> ;
152
162
}
153
163
a.badge-info:focus, a.badge-info:hover {
154
- color: #fff !important;
155
- background-color: <?php print colorDarker ($ badgeInfo , 10 ); ?> ;
164
+ color: #fff !important;
165
+ background-color: <?php print colorDarker ($ badgeInfo , 10 ); ?> ;
156
166
}
157
167
158
168
/* LIGHT */
159
169
.badge-light {
160
- color: #212529 !important;
161
- background-color: <?php print $ badgeLight ; ?> ;
170
+ color: #212529 !important;
171
+ background-color: <?php print $ badgeLight ; ?> ;
162
172
}
163
173
a.badge-light.focus, a.badge-light:focus {
164
- outline: 0;
165
- box-shadow: 0 0 0 0.2rem <?php print colorHexToRgb ($ badgeLight , 0.5 ); ?> ;
174
+ outline: 0;
175
+ box-shadow: 0 0 0 0.2rem <?php print colorHexToRgb ($ badgeLight , 0.5 ); ?> ;
166
176
}
167
177
a.badge-light:focus, a.badge-light:hover {
168
- color: #212529 !important;
169
- background-color: <?php print colorDarker ($ badgeLight , 10 ); ?> ;
178
+ color: #212529 !important;
179
+ background-color: <?php print colorDarker ($ badgeLight , 10 ); ?> ;
170
180
}
171
181
172
182
/* DARK */
173
183
.badge-dark {
174
- color: #fff !important;
175
- background-color: <?php print $ badgeDark ; ?> ;
184
+ color: #fff !important;
185
+ background-color: <?php print $ badgeDark ; ?> ;
176
186
}
177
187
a.badge-dark.focus, a.badge-dark:focus {
178
- outline: 0;
179
- box-shadow: 0 0 0 0.2rem <?php print colorHexToRgb ($ badgeDark , 0.5 ); ?> ;
188
+ outline: 0;
189
+ box-shadow: 0 0 0 0.2rem <?php print colorHexToRgb ($ badgeDark , 0.5 ); ?> ;
180
190
}
181
191
a.badge-dark:focus, a.badge-dark:hover {
182
- color: #fff !important;
183
- background-color: <?php print colorDarker ($ badgeDark , 10 ); ?> ;
192
+ color: #fff !important;
193
+ background-color: <?php print colorDarker ($ badgeDark , 10 ); ?> ;
184
194
}
185
195
196
+
186
197
@media only screen and (max-width: 570px)
187
198
{
188
199
span.badge.badge-status {
192
203
}
193
204
}
194
205
206
+
195
207
/* STATUS BADGES */
196
208
<?php
197
209
for ($ i = 0 ; $ i <= 10 ; $ i ++) {
217
229
*/
218
230
function _createStatusBadgeCss ($ statusName , $ statusVarNamePrefix = '' , $ commentLabel = '' , $ cssPrefix = '' )
219
231
{
220
-
221
232
global $ {$ statusVarNamePrefix .'badgeStatus ' .$ statusName }, $ {$ statusVarNamePrefix .'badgeStatus_textColor ' .$ statusName };
222
233
223
234
if (!empty ($ {$ statusVarNamePrefix .'badgeStatus ' .$ statusName })) {
@@ -244,23 +255,29 @@ function _createStatusBadgeCss($statusName, $statusVarNamePrefix = '', $commentL
244
255
$ thisBadgeTextColor = '#777777 ' ;
245
256
}
246
257
258
+ // badge-statusX
247
259
print $ cssPrefix .".badge-status " .$ statusName ." { \n" ;
248
260
print " color: " .$ thisBadgeTextColor ." !important; \n" ;
249
261
if (in_array ((string ) $ statusName , $ TBadgeBorderOnly )) {
250
262
print " border-color: " .$ thisBadgeBorderColor ." !important; \n" ;
251
263
}
252
- print " background-color: " .$ thisBadgeBackgroundColor ." !important; \n" ;
264
+ if ($ thisBadgeBackgroundColor != '' ) {
265
+ print " background-color: " .$ thisBadgeBackgroundColor ." !important; \n" ;
266
+ }
253
267
print "} \n" ;
254
268
255
269
print $ cssPrefix .".font-status " .$ statusName ." { \n" ;
256
- print " color: " .$ thisBadgeBackgroundColor ." !important; \n" ;
270
+ if ($ thisBadgeBackgroundColor != '' ) {
271
+ print " color: " .$ thisBadgeBackgroundColor ." !important; \n" ;
272
+ }
257
273
print "} \n" ;
258
274
259
275
print $ cssPrefix .".badge-status " .$ statusName .".focus, " .$ cssPrefix .".badge-status " .$ statusName .":focus { \n" ;
260
276
print " outline: 0; \n" ;
261
277
print " box-shadow: 0 0 0 0.2rem " .colorHexToRgb ($ thisBadgeBackgroundColor , 0.5 )." !important; \n" ;
262
278
print "} \n" ;
263
279
280
+ // badge-statusX:focus
264
281
print $ cssPrefix .".badge-status " .$ statusName .":focus, " .$ cssPrefix .".badge-status " .$ statusName .":hover { \n" ;
265
282
print " color: " .$ thisBadgeTextColor ." !important; \n" ;
266
283
//print " background-color: " . colorDarker($thisBadgeBackgroundColor, 10) . ";\n";
0 commit comments