See that forum logo up in the top left? The one that links back to the homepage?
It's fine for a normal screen but on a retina device the text and logo begins to turn pixelated. This is due to the rez of the image being 63-or so pixels high.
I made a quick updated version, along with a font I felt better fits the overall website design.
Before:
After:
Here's the the AI file so you can adjust the height as you need it. Maybe create a normal 63 height file for standard use and a x2 for retina screens: https://www.dropbox.com/s/28fcruzl502pf6b/forumLogo.ai?dl=0
You can add this with a simple CSS fix:
@media
only screen and (-webkit-min-device-pixel-ratio: 2),
only screen and ( min--moz-device-pixel-ratio: 2),
only screen and ( -o-min-device-pixel-ratio: 2/1),
only screen and ( min-device-pixel-ratio: 2),
only screen and ( min-resolution: 192dpi),
only screen and ( min-resolution: 2dppx) {
.logo-1x {
display: none !important;
}
.logo-2x {
display: block !important;
}
}
It's fine for a normal screen but on a retina device the text and logo begins to turn pixelated. This is due to the rez of the image being 63-or so pixels high.
I made a quick updated version, along with a font I felt better fits the overall website design.
Before:
After:
Here's the the AI file so you can adjust the height as you need it. Maybe create a normal 63 height file for standard use and a x2 for retina screens: https://www.dropbox.com/s/28fcruzl502pf6b/forumLogo.ai?dl=0
You can add this with a simple CSS fix:
@media
only screen and (-webkit-min-device-pixel-ratio: 2),
only screen and ( min--moz-device-pixel-ratio: 2),
only screen and ( -o-min-device-pixel-ratio: 2/1),
only screen and ( min-device-pixel-ratio: 2),
only screen and ( min-resolution: 192dpi),
only screen and ( min-resolution: 2dppx) {
.logo-1x {
display: none !important;
}
.logo-2x {
display: block !important;
}
}
