Automattic / Automattic/jetpack

Slideshow 'Add slide' button not visible in dark mode

Open
#15,891 0 comments 0 reactions 0 assignees View on GitHub
[Block] Slideshow [Pri] Normal Bug
Dominant language
PHP
Stars
1.8k
Forks
898
Avg merge
1d 18h
Merged PRs (30d)
774

Description

If you are using dark mode in a theme then the 'upload an image' button is not visible.

Example here:
http://g.recordit.co/JvZFk8BOzg.gif

I fixed this in my theme by adding:

```
.wp-block-jetpack-slideshow__add-item-button {
background: rgba(255, 255, 255, 0.5);
}

.wp-block-jetpack-slideshow__add-item-button:hover {
background: rgba(255, 255, 255, 0.2);
}
```

Info on dark mode here:
https://developer.wordpress.org/block-editor/developers/themes/theme-support/#dark-backgrounds

Contributor guide

Open the contributing guide

Research direction

Locate the Jetpack slideshow styles for .wp-block-jetpack-slideshow__add-item-button and reproduce the issue in a WordPress theme using dark mode. Compare the button and hover states with the reported CSS and verify that the “upload an image” control is visible in both states.

Written by the indexing model from the issue text.

Assessment

Tech stack
css, wordpress
Domain
frontend
Issue type
Bug
Difficulty
2/5
Estimated time
1-3 hours
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
45/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.