When using @triply/yasgui in an Angular project, the build process generates multiple warnings due to deprecated or invalid CSS syntax in yasgui.min.css. These warnings stem from the use of outdated browser hacks like *cursor and *zoom, which are incompatible with modern CSS processors used in Angular's build pipeline (e.g., PostCSS or Dart Sass).
Warnings Example:
[WARNING] Expected identifier but found "*" [css-syntax-error]
node_modules/@triply/yasgui/build/yasgui.min.css:1:7404:
1 │ ...ng_desc_disabled{cursor:pointer;*cursor:hand;background-repeat:n...
╵ ^
Steps to Reproduce:
- Create a new Angular project with the CLI.
- Install
@triply/yasgui using npm install.
- Add
yasgui.min.css to the angular.json styles array or import it directly in a component.
- Build or serve the project using
ng serve or ng build.
- Observe the warnings in the console.
Expected Behavior:
Angular builds should process the library's CSS without generating warnings. The CSS should adhere to modern standards.
Actual Behavior:
The Angular build process emits multiple warnings related to invalid CSS syntax, disrupting the developer experience.
Environment:
@triply/yasgui version: 4.2.28- Angular CLI version: 19.0.6
- Build tool: Webpack (via Angular CLI)
- CSS Processor: PostCSS/Dart Sass
- Node.js version: 18.19
- Operating system: Linux
Proposed Solution:
Update the yasgui.min.css file to remove outdated syntax (e.g., *cursor, *zoom) that is no longer supported by modern CSS processors. This will ensure compatibility with Angular projects and other frameworks that use strict CSS validation.
Additional Context:
Angular projects enforce strict CSS standards, and the inclusion of invalid syntax in third-party libraries causes unnecessary build-time warnings. Resolving this issue will enhance compatibility and improve developer experience for Angular users.
When using
@triply/yasguiin an Angular project, the build process generates multiple warnings due to deprecated or invalid CSS syntax inyasgui.min.css. These warnings stem from the use of outdated browser hacks like*cursorand*zoom, which are incompatible with modern CSS processors used in Angular's build pipeline (e.g., PostCSS or Dart Sass).Warnings Example:
Steps to Reproduce:
@triply/yasguiusingnpm install.yasgui.min.cssto theangular.jsonstyles array or import it directly in a component.ng serveorng build.Expected Behavior:
Angular builds should process the library's CSS without generating warnings. The CSS should adhere to modern standards.
Actual Behavior:
The Angular build process emits multiple warnings related to invalid CSS syntax, disrupting the developer experience.
Environment:
@triply/yasguiversion: 4.2.28Proposed Solution:
Update the
yasgui.min.cssfile to remove outdated syntax (e.g.,*cursor,*zoom) that is no longer supported by modern CSS processors. This will ensure compatibility with Angular projects and other frameworks that use strict CSS validation.Additional Context:
Angular projects enforce strict CSS standards, and the inclusion of invalid syntax in third-party libraries causes unnecessary build-time warnings. Resolving this issue will enhance compatibility and improve developer experience for Angular users.