Automattic / Automattic/wp-calypso

Additional CSS: Allow backdrop-filter property

Open
#81,908 5 comments 0 reactions 0 assignees View on GitHub
[Feature Group] Appearance & Themes [Feature] Customizer [Pri] Low [Product] WordPress.com Customer report [LEGACY] Feature Request Groundskeeping Triaged
Dominant language
TypeScript
Stars
12.6k
Forks
2k
Avg merge
1d 18h
Merged PRs (30d)
509

Description

### What

Add backdrop-filter to allowed CSS properties so it won't be stripped on save

### Why

Backdrop-filter allows for some [neat effects](https://css-tricks.com/almanac/properties/b/backdrop-filter/). [This user](https://wordpress.com/forums/topic/the-backdrop-filter-attribute-doesnt-function-properly-in-the-additional-css/) had a sticky header/navigation that was partially transparent and wanted to blur out any text or images as they scroll under. It works and looks nice in Customizer, but it won't save.

### How

Add the property to the allow list in Jetpack's Custom CSS > CSS Tidy > data.inc.php

Contributor guide

Open the contributing guide

Research direction

Open Jetpack's Custom CSS > CSS Tidy > data.inc.php and find the allow list for CSS properties. Add backdrop-filter there, then verify that Additional CSS containing the property is retained after saving.

Written by the indexing model from the issue text.

Assessment

Tech stack
css, php
Domain
frontend
Issue type
Feature
Difficulty
1/5
Estimated time
Under an hour
Activity status
Stale
Clarity
Clearly specified
Newbie friendliness
45/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.