AO3-5441 Allow filter functions for CSS filter

[BoldestDungeon]

Issue

https://otwarchive.atlassian.net/browse/AO3-5441

Purpose

Adds support for the possible CSS filter functions. See the MDN for CSS Filters for full details.

Testing Instructions

Put the following into a skin and make sure that after saving, the output matches the input and you don't get any error messages. Note that this won't actually do anything useful; it's just to make sure all the values are accepted.

/* <filter-function> values */

.a  { filter: blur(5px);}
.b { filter: brightness(0.4); }
.c { filter: contrast(200%); }
.e { filter: drop-shadow(16px 16px 20px blue); }
.f { filter: grayscale(50%); }
.g { filter: hue-rotate(90deg); }
.h { filter: invert(75%); }
.i { filter: opacity(25%); }
.j { filter: saturate(30%); }
.k { filter: sepia(60%); }

/* Multiple filters */
.l { filter: contrast(175%) brightness(3%); }
.m { filter: drop-shadow(3px 3px red) sepia(100%) drop-shadow(blue -3px -3px 5px); }

/* Use no filter */
.n { filter: none; }

/* Global values */
.o { filter: inherit; }
.p { filter: initial; }
.q { filter: revert; }
.r { filter: revert-layer; }
.s { filter: unset; }

References

Are there other relevant issues/pull requests/mailing list discussions?

Credit

David Bilsky/Ironskink (He/Him)

[brianjaustin]

Hi David,

Thanks the PR! Someone will be along to review it soon. In the meantime, I've assigned the Jira issue to you and set its status to In Review, so no one will mistakenly create a duplicate pull request. I've also given your account permission to comment on, assign, and transition issues in the future.

Thanks again for contributing! If you have any questions, please feel free to contact us at [email protected].

[Bilka2]

Looks great, thank you for contributing!

[BoldestDungeon]

Looks great, thank you for contributing!

Thank-you, and you're welcome! Do I need to take any next steps on this task, or is that all handled by the official code maintainers?

[Bilka2]

The next step is merging the PR, then manual QA testing. All of that is handled by OTW volunteers, so you don't need to take any further steps.

Someone will let you know if you need to take further action on this task in the future, either by commenting on the Jira issue and changing its status to "Broken on Test" if something crops up during QA, or by commenting on this pull request if something happens beforehand, e.g. if there is a merge conflict. If you're not sure whether a Jira or PR comment is meant for you, don't be afraid to ask for clarification.

You can find an overview of the lifecycle of a Jira issue on the wiki: https://github.com/otwcode/otwarchive/wiki/Issue-Tracking-with-Jira