Using @media and different CSS settings for different screens was
a smart move, but you are not using it correctly. By setting the
font-size in pixels, you completely forgot about the screen
density, and the forum might end up with really small text for
mobile or desktop. Obviously, you can set the minimum font size
in your browser, but that's not a solution, since that size is
usually used for notes (like in wikipedia). For example, I have
15pt as default and 10pt as minimum on my desktop. 10pt is really
small for the post's text.
First of all, I recommend to use % for the body's font-size
(which you are already using) and the rest should be set with em.
That way, the body font-size will be equal to the browser default
font size, and the rest of the page will be based on that size.
Another suggestion is using something like this:
http://flexknowlogy.learningfield.org/2008/06/26/setting-font-size-proportional-to-window-size/
Here is an example of the js code:
function updateFontSize(){
msg = document.body.clientWidth;
var font_math = Math.round( 0.012 * msg * 10 );
font_math = font_math < 100 ? 100 : font_math;
$( "body" ).css({
"font-size" : font_math + "%"
});
}
Use that function on page load and page refresh:
$( window ).resize( ... )
$( document ).ready( ... )
On Wednesday, 15 February 2012 at 10:55:57 UTC, Vladimir
Panteleev wrote:
On Wednesday, 15 February 2012 at 00:33:29 UTC, torhu wrote:
On 14.02.2012 23:00, Walter Bright wrote:
http://forum.dlang.org/
This should replace the old miserable web interface to the
forums.
Thanks to Vladimir Panteleev for an awesome job writing this!
Nice! One suggestion for improvement: don't change the font
size based on the browser window size. I'm not a web
programmer, but I'm sure someone here can suggest a better way
of setting the font size.
That's a tough one... This behavior is part of an effort to
make the interface look good on any screen size. This doesn't
include just PCs, but also mobile devices.
The advantage of the current approach is that it does not rely
on JavaScript - it's completely CSS-based. It's not just the
font size, either - the navigation column on the left is hidden
if the viewport is not wide enough, and some other sizes are
adjusted.
While I could use JavaScript to query the viewport window on
load time and apply the adjustments only on page load, it'd
have to mean relying on JavaScript, and you'd still see the
font size change when you resize the window and click a link.
I don't think having a "font size" JavaScript widget is a
better solution. It'd mean having one canned experience
optimized for one device be the default for all devices.
Detecting user-agents or other complicated logic is not
something I wish to go down, either.
May I ask why you don't like the current behavior?
