Skip to content

Commit 42fcb17

Browse files
lokesh-coderlokesh-coder
committed
Bug Fix: Remove junk character in print media
1 parent 101cbc3 commit 42fcb17

File tree

7 files changed

+76
-35
lines changed

7 files changed

+76
-35
lines changed

‎src/pretty.css

+45-16
Original file line numberDiff line numberDiff line change
@@ -118,6 +118,35 @@
118118
}
119119
}
120120

121+
@media print {
122+
.pretty:not(.toggle) input:not(:checked) + label i:before,
123+
.pretty > input[type='radio']:checked + label > i.default:before,
124+
.pretty i:after {
125+
-webkit-print-color-adjust: exact;
126+
print-color-adjust: exact;
127+
color: transparent !important;
128+
}
129+
.pretty input:checked + label i:before {
130+
-webkit-print-color-adjust: exact;
131+
print-color-adjust: exact;
132+
}
133+
.pretty.primary input:checked + label i:before {
134+
color: white !important;
135+
}
136+
.pretty.success input:checked + label i:before {
137+
color: white !important;
138+
}
139+
.pretty.info input:checked + label i:before {
140+
color: white !important;
141+
}
142+
.pretty.warning input:checked + label i:before {
143+
color: white !important;
144+
}
145+
.pretty.danger input:checked + label i:before {
146+
color: white !important;
147+
}
148+
}
149+
121150
.pretty {
122151
position: relative;
123152
line-height: 1;
@@ -184,7 +213,7 @@
184213
}
185214

186215
.pretty > input[type='radio']:checked + label > i.default:before {
187-
background: #aaa;
216+
background-color: #aaa !important;
188217
}
189218

190219
.pretty > input[type='checkbox'][disabled],
@@ -237,17 +266,17 @@
237266
}
238267

239268
.pretty.primary input:checked + label i:after {
240-
background-color: #428bca;
269+
background-color: #428bca !important;
241270
border-color: #428bca;
242271
}
243272

244273
.pretty.primary input[type='radio']:checked + label i.default:before {
245-
background-color: #428bca;
274+
background-color: #428bca !important;
246275
color: transparent;
247276
}
248277

249278
.pretty.primary input[type='radio']:checked + label i.default:after {
250-
background-color: initial;
279+
background-color: initial !important;
251280
border-color: #428bca;
252281
}
253282

@@ -291,17 +320,17 @@
291320
}
292321

293322
.pretty.success input:checked + label i:after {
294-
background-color: #5cb85c;
323+
background-color: #5cb85c !important;
295324
border-color: #5cb85c;
296325
}
297326

298327
.pretty.success input[type='radio']:checked + label i.default:before {
299-
background-color: #5cb85c;
328+
background-color: #5cb85c !important;
300329
color: transparent;
301330
}
302331

303332
.pretty.success input[type='radio']:checked + label i.default:after {
304-
background-color: initial;
333+
background-color: initial !important;
305334
border-color: #5cb85c;
306335
}
307336

@@ -345,17 +374,17 @@
345374
}
346375

347376
.pretty.info input:checked + label i:after {
348-
background-color: #5bc0de;
377+
background-color: #5bc0de !important;
349378
border-color: #5bc0de;
350379
}
351380

352381
.pretty.info input[type='radio']:checked + label i.default:before {
353-
background-color: #5bc0de;
382+
background-color: #5bc0de !important;
354383
color: transparent;
355384
}
356385

357386
.pretty.info input[type='radio']:checked + label i.default:after {
358-
background-color: initial;
387+
background-color: initial !important;
359388
border-color: #5bc0de;
360389
}
361390

@@ -399,17 +428,17 @@
399428
}
400429

401430
.pretty.warning input:checked + label i:after {
402-
background-color: #f0ad4e;
431+
background-color: #f0ad4e !important;
403432
border-color: #f0ad4e;
404433
}
405434

406435
.pretty.warning input[type='radio']:checked + label i.default:before {
407-
background-color: #f0ad4e;
436+
background-color: #f0ad4e !important;
408437
color: transparent;
409438
}
410439

411440
.pretty.warning input[type='radio']:checked + label i.default:after {
412-
background-color: initial;
441+
background-color: initial !important;
413442
border-color: #f0ad4e;
414443
}
415444

@@ -453,17 +482,17 @@
453482
}
454483

455484
.pretty.danger input:checked + label i:after {
456-
background-color: #d9534f;
485+
background-color: #d9534f !important;
457486
border-color: #d9534f;
458487
}
459488

460489
.pretty.danger input[type='radio']:checked + label i.default:before {
461-
background-color: #d9534f;
490+
background-color: #d9534f !important;
462491
color: transparent;
463492
}
464493

465494
.pretty.danger input[type='radio']:checked + label i.default:after {
466-
background-color: initial;
495+
background-color: initial !important;
467496
border-color: #d9534f;
468497
}
469498

‎src/pretty.min.css

+1-1
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎src/scss/decorators/_color.scss

+4-12
Original file line numberDiff line numberDiff line change
@@ -1,29 +1,21 @@
1-
$outline-colors: (
2-
primary outline-primary #428bca,
3-
success outline-success #5cb85c,
4-
info outline-info #5bc0de,
5-
warning outline-warning #f0ad4e,
6-
danger outline-danger #d9534f
7-
) !default;
8-
91
@each $color in $outline-colors{
102
.#{$pretty-class-name}.#{nth($color,1)}{
113
input:checked+ label i{
124
&:before{
135
color:#fff;
146
}
157
&:after{
16-
background-color:nth($color,3);
8+
background-color:nth($color,3) !important;
179
border-color:nth($color,3)
1810
}
1911
}
2012
input[type='radio']:checked+ label i.default{
2113
&:before{
22-
background-color:nth($color,3);
14+
background-color:nth($color,3) !important;
2315
color:transparent;
2416
}
2517
&:after{
26-
background-color: initial;
18+
background-color: initial !important;
2719
border-color:nth($color,3)
2820
}
2921
}
@@ -36,7 +28,7 @@ $outline-colors: (
3628
.#{$pretty-class-name}.#{nth($color,2)}{
3729
input:checked+label i{
3830
&:before{
39-
color:nth($color,3)
31+
color:nth($color,3);
4032
}
4133
&:after{
4234
border-color:nth($color,3);

‎src/scss/decorators/_core.scss

+1-1
Original file line numberDiff line numberDiff line change
@@ -63,7 +63,7 @@
6363
}
6464
&>input[type='radio']:checked+label>i.default{
6565
&:before{
66-
background: #aaa;
66+
background-color: #aaa !important;
6767
}
6868
&:after{}
6969
}

‎src/scss/support/_index.scss

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
11
@import 'variables';
22
@import 'mixins';
33
@import 'animations';
4-
@import 'print';
4+
@import 'print';

‎src/scss/support/_print.scss

+16-3
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,20 @@
1-
@media print{
2-
.pretty i:after{
1+
@media print {
2+
.#{$pretty-class-name}:not(.toggle) input:not(:checked)+label i:before,
3+
.#{$pretty-class-name} > input[type='radio']:checked + label > i.default:before,
4+
.#{$pretty-class-name} i:after {
35
-webkit-print-color-adjust: exact;
46
print-color-adjust: exact;
57
color: transparent !important;
68
}
7-
}
9+
10+
.#{$pretty-class-name} input:checked + label i:before{
11+
-webkit-print-color-adjust: exact;
12+
print-color-adjust: exact;
13+
}
14+
15+
@each $color in $outline-colors {
16+
.#{$pretty-class-name}.#{nth($color, 1)} input:checked + label i:before {
17+
color: white !important;
18+
}
19+
}
20+
}

‎src/scss/support/_variables.scss

+8-1
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,10 @@
11
$pretty-class-name:pretty !default;
22
$pretty-font-family:"Material Design Icons" !default;
3-
$pretty-border-radius:2px !default;
3+
$pretty-border-radius:2px !default;
4+
$outline-colors: (
5+
primary outline-primary #428bca,
6+
success outline-success #5cb85c,
7+
info outline-info #5bc0de,
8+
warning outline-warning #f0ad4e,
9+
danger outline-danger #d9534f
10+
) !default;

0 commit comments

Comments
 (0)