Steps to reproduce:
- Create an empty Social Icons block, and let it display as a placeholder with three colored icons.
- Next to it create another Social Icons block, and populate it with real social icons.
The result will look like this:
The placeholder icons are not rounded, and there is no space between them. Real icons are inside a flex layout with a gap: 1.5rem CSS property that creates the spacing.
Another instance of broken placeholder styles is when you change the Social Icons styles to have the "Logos Only" style and a black icon color:
Here again the gap is missing, and also:
- The icon sizes don't match: the placeholders are 24px, but the real SVGs are 30px big. Although the SVG's size is determined by its
font-size: 24px CSS style, somehow that translates into 30px real size.
- The black icon color is not respected by the placeholder.
Last time the social icons placeholders were updated was 3 years ago by @jasmussen in #26953. It seems that the real icons' styling has changed since, but the placeholders were left behind.
Steps to reproduce:
The result will look like this:
The placeholder icons are not rounded, and there is no space between them. Real icons are inside a flex layout with a
gap: 1.5remCSS property that creates the spacing.Another instance of broken placeholder styles is when you change the Social Icons styles to have the "Logos Only" style and a black icon color:
Here again the
gapis missing, and also:font-size: 24pxCSS style, somehow that translates into 30px real size.Last time the social icons placeholders were updated was 3 years ago by @jasmussen in #26953. It seems that the real icons' styling has changed since, but the placeholders were left behind.