I can’t figure out how to change the size of this icon. I have tried a number of variations but can’t seem to get it. In general I am still at the stage where trial and error works best so forgive me if this is obvious. Thanks.
.tile.–theme-style-hide-footer-active-half-height-tile .icon svg {width: 100%; height: 100%; margin: 0; position: absolute; top: 20%; left: 50%; }
When posting CSS to the community, you can wrap it in backticks ` highlight it with your cursor and then tap the </> icon in the toolbar to maintain the formatting.
One of the reasons I mention this is the community formats double dashes as long dashes (“en dashes”), so it’s not clear if you are using:
.--theme-style-{yourStyle}
or
.–theme-style-{yourStyle)
Note the difference in the double dash (correct) vs long dash (incorrect).
Otherwise, the selector generally looks fine, but of course relies on that exact style being applied (and active) on your tile. The element that shows which style/class is applied is scrolled just out of view in your developer tools, so I can’t confirm if the matching style is applied to the tile correctly.
Edit: I didn’t test the content of your custom CSS though. See my post below…
I also wanted to highlight a previous discussion we had where you mentioned that switching to the font-size for scaling the icon helped. Perhaps that would help here as well?