Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add an option to remove specific CSS declarations #52

Open
imtheu opened this issue Apr 23, 2024 · 1 comment
Open

Add an option to remove specific CSS declarations #52

imtheu opened this issue Apr 23, 2024 · 1 comment
Assignees
Labels
enhancement New feature or request
Milestone

Comments

@imtheu
Copy link

imtheu commented Apr 23, 2024

Is your feature request related to a problem? Please describe.
Not all properties are essential in critical CSS. For example, properties such as cursor, color, or border-radius may not need to be included in the final critical CSS. Therefore, it would be incredibly beneficial to have an option to exclude certain declarations from the final critical CSS, which would reduce the overall size.

Describe the solution you'd like
A potential solution could be to introduce a removeDeclarations option

Describe alternatives you've considered
We could use the postcss-discard plugin for this purpose. It accepts a String, RegExp, or a Function to specify which declarations to exclude.

Original CSS:

.pseudo-selector::before {
    color: silver;
    content: 'pseudo ::before';
}

Crittr:

Crittr({
    removeDeclarations: [/color/]
})

Final CSS:

.pseudo-selector::before {
-    color: silver;
    content: 'pseudo ::before';
}

I am willing to contribute and open a PR if you are interested.

@philipp-winterle
Copy link
Owner

Critical CSS or also known as Above the Fold - CSS is a description of what CSS is needed to display a website without any movement or changes in the ATF region. This means also color and border radius.

I understand if you want to reduce the amount of css rules and properties. But if you want the real critical css then you also need color and border-radius.

I understand your request more like: I wish to remove properties as these are not important to me.
If they wouldn't be critical, they would have been removed from the whole output.

So I see some problems with this option but also customizability.

PR always a good thing :)

Thanks

@philipp-winterle philipp-winterle added the enhancement New feature or request label May 6, 2024
@philipp-winterle philipp-winterle self-assigned this May 6, 2024
@philipp-winterle philipp-winterle added this to the 1.6.0 milestone May 6, 2024
@philipp-winterle philipp-winterle modified the milestones: 1.6.0, 2.1.0 Jun 18, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
None yet
Development

No branches or pull requests

2 participants