X close button for retina displays

guclusat

Tanınmış Üye
Süper Moderatör
X close button for retina displays

Close button looks blurry on zoom-in when on touch device? Not anymore. Just add this to your EXTRA.css

Kod:
.xenOverlay a.close
{
    display: inline-block;
    top: 8px;
    right: 8px;
    width: 23px;
    height: 23px;
    background: #2e5660;
    border: 2px solid #fff;
    border-radius: 50%;
    text-align:center;
    }

.xenOverlay a.close:before
{
    content: '×';
    color: #fff;
    font: 32px/24px Arial;
}

The '×' is a rare symbol that not many people take advantage of and they should.

You can play a bit with the values to achieve best results.
The same approach could be used for the Tapatalk smartbanner X button so it would match your current theme.

Here's how it looks for our community, zoomed at 300%:

zoomed.png
I wish you success.
 
Geri
Yukarı