D forums now live!

[Ludovic Silvestre]

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?