natxet / cssmin Goto Github PK
View Code? Open in Web Editor NEWClone of CssMin for http://packagist.org/about-composer
Home Page: http://code.google.com/p/cssmin/
Clone of CssMin for http://packagist.org/about-composer
Home Page: http://code.google.com/p/cssmin/
This is just a copy of the CssMin by Joe Scylla to format it for Composer. Composer: http://packagist.org/about-composer CssMin: http://code.google.com/p/cssmin/
Have you discarded all plugins and filters from Joe's code?
@supports
can't be used at the moment. The CSS code below should come out unaltered (already minified). However the closing bracket is removed.
steps to reproduce
echo \CssMin::minify('@supports(display:grid){.example{display:grid}}');
expected output
string(47): "@supports(display:grid){.example{display:grid}}"
actual output
string(46): "@supports(display:grid){.example{display:grid}"
'+ +' not correctly minified and becomes '++'. See minified code below.
Environment:
php 7.2
natxet/CssMin 3.0.4
Original function:
function getBordersSize(styles, axis) {
var sideA = axis === 'x' ? 'Left' : 'Top';
var sideB = sideA === 'Left' ? 'Right' : 'Bottom';
return +styles['border' + sideA + 'Width'].split('px')[0] + +styles['border' + sideB + 'Width'].split('px')[0];
}
A minified function:
function getBordersSize(styles,axis){var sideA=axis==='x'?'Left':'Top';var sideB=sideA==='Left'?'Right':'Bottom';return+styles['border'+sideA+'Width'].split('px')[0]++styles['border'+sideB+'Width'].split('px')[0];}
Best regards,
Bart Heyrman
This library currently contains 68 classes in a single file. To increase readability and maintainability I want to suggest moving every class to its own file.
If this fork aims to maintain backward compatibility, I'll probably go ahead and fork it.
Filter adding "RemoveComments" does not remove comments (/ *! * /)
After adding the filter, the file looks like this
/ *!
* Bootstrap v4.6.0 (https://getbootstrap.com/)
* Copyright 2011-2021 Bootstrap Authors
* Copyright 2011-2021 Twitter, Inc.
* MIT License (https://github.com/twbs/bootstrap/blob/main/LICENSE)
* /: root {- blue: # 007bff; - indigo: # 6610f2; - purple: # 6f42c1; - pink: # e83e8
...
I think that if in this line
https://github.com/natxet/CssMin/blob/master/src/CssMin.php#L1367
replace the code for conditions with (without !
):
if (preg_match($this->whitelistPattern, $tokens[$i]->Comment))
{
$tokens[$i] = null;
$r++;
}
then the comment will be deleted
Environment:
PHP 7.1
natxet/CssMin 3.0.4
It would be great to have a stable branch or version tags for composer. This would make testing and deployment to production much easier, especially when changes or new features might break backwards compatibility.
I'm using the library to minify CSS on my workflow.
Up to PHP 7.4 it works fine, but spits this warning:
ERROR: The each() function is deprecated. This message will be suppressed on further calls
in phar:///usr/local/bin/robo/vendor/natxet/cssmin/src/CssMin.php:2222
On PHP 8.0 and up, it fails as each()
function is removed altogether from the language:
ERROR: Uncaught Error: Call to undefined function each()
in phar:///usr/local/bin/robo/vendor/natxet/cssmin/src/CssMin.php:2222
This needs to be upgraded. What's the best way to achieve this? I'm up to put some work on this is necessary.
Minifications breaks animation for ie,safari,firefox
css:
@keyframes sk-three-bounce
is parsed to:
@keyframes "sk-three-bounce"
Quotes breaks animation on Firefox and IE
Please fix it.
Before: padding-top: calc(100% / (650 / 320) + 1em);
After CssMin: padding-top: calc(100% / (650 / 320)+1em); //This code does not work
According to the specification, after and before the minus and plus sign a space character is needed
When i'm not minifying my stylesheet, glyphicons works great. when I'm running the Minify::stylesheet, it breaks them...
Before minification, I concatinate a few css files. If this files has the same selectors then result files has a dublicate selectors with dublicates values.
For example:
core.css
h1 > a {
color: blue;
font-size: 2em;
text-decoration: underline;
}
site.css
h1 > a {
color: #ef0;
font-size: 1.75em;
}
actual core.css+site.css with minification
h1>a{color:blue;font-size:2em;text-decoration:underline;}h1>a{color:#ef0;font-size:1.75em;}
expected
h1>a{color:#ef0;font-size:1.75em;text-decoration:underline;}
Hi !
Composer package names supposed to be in small latter.
I am unable to install your package with composer.
Please read the links.
composer/packagist#186
http://stackoverflow.com/questions/24415965/naming-conventions-when-creating-a-php-composer-package
thanks!
If a definition like this is used in a css file.
Then there will be a closing bracket } missing in the minified output.
@-moz-document url-prefix() {
.btn { margin: 0 }
}
@media (max-width: 768px) {
@-moz-document url-prefix() {
.btn { margin: 5px; }
}
}
A workaround is to separate the two blocks by another (unrelated) css definition.
Also note: As far as I understand it this kind of functionality will be removed from Firefox
Minifier break css when at-media & at-keyframes are used together.
This css:
@media (min-width: 0) and (max-width: 360px) {
@keyframes loop {
0% {
transform: translateX(0);
}
100% {
transform: translateX(calc(-100% + 360px));
}
}
}
@media (min-width: 480px) {
@keyframes loop {
0% {
transform: translateX(0);
}
100% {
transform: translateX(calc(-100% + 480px));
}
}
}
.a {
color: red
}
when minified and then re-formatted, produces this result:
@media (min-width: 0) and (max-width: 360px) {
@keyframes loop {
0% {
transform: translateX(0)
}
100% {
transform: translateX(calc(-100% + 360px))
}
}@media (min-width: 480px) {
@keyframes loop {
0% {
transform: translateX(0)
}
100% {
transform: translateX(calc(-100% + 480px))
}
}
} .a {
color: red
}
Notice the missing "}". If there's only one at-media + at-keyframes block, it works well, if there are more, it breaks all of them except the last one.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.