{"action":"created","issue":{"url":"https://api.github.com/repos/Shopify/Timber/issues/388","labels_url":"https://api.github.com/repos/Shopify/Timber/issues/388/labels{/name}","comments_url":"https://api.github.com/repos/Shopify/Timber/issues/388/comments","events_url":"https://api.github.com/repos/Shopify/Timber/issues/388/events","html_url":"https://github.com/Shopify/Timber/issues/388","id":65784842,"number":388,"title":"$baseFontSize isn't really customizable","user":{"login":"benknight","id":786691,"avatar_url":"https://avatars.githubusercontent.com/u/786691?v=3","gravatar_id":"","url":"https://api.github.com/users/benknight","html_url":"https://github.com/benknight","followers_url":"https://api.github.com/users/benknight/followers","following_url":"https://api.github.com/users/benknight/following{/other_user}","gists_url":"https://api.github.com/users/benknight/gists{/gist_id}","starred_url":"https://api.github.com/users/benknight/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/benknight/subscriptions","organizations_url":"https://api.github.com/users/benknight/orgs","repos_url":"https://api.github.com/users/benknight/repos","events_url":"https://api.github.com/users/benknight/events{/privacy}","received_events_url":"https://api.github.com/users/benknight/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"milestone":null,"comments":2,"created_at":"2015-04-01T21:40:56Z","updated_at":"2015-04-02T20:01:27Z","closed_at":null,"body":"In `timber.scss.liquid` the `em()` function works by dividing a hard pixel value by `$baseFontSize`.  This means that even if you change `$baseFontSize`, anything set using `em()` stays the same size instead of scaling up relative to the base size.\r\n\r\nHere's an example: http://sassmeister.com/gist/5844c64c95f0b9d405dc\r\n\r\nIn my opinion this is a bug because since this is a framework, all font sizes should be relative to the `$baseFontSize` variable.  Right?"},"comment":{"url":"https://api.github.com/repos/Shopify/Timber/issues/comments/89026678","html_url":"https://github.com/Shopify/Timber/issues/388#issuecomment-89026678","issue_url":"https://api.github.com/repos/Shopify/Timber/issues/388","id":89026678,"user":{"login":"benknight","id":786691,"avatar_url":"https://avatars.githubusercontent.com/u/786691?v=3","gravatar_id":"","url":"https://api.github.com/users/benknight","html_url":"https://github.com/benknight","followers_url":"https://api.github.com/users/benknight/followers","following_url":"https://api.github.com/users/benknight/following{/other_user}","gists_url":"https://api.github.com/users/benknight/gists{/gist_id}","starred_url":"https://api.github.com/users/benknight/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/benknight/subscriptions","organizations_url":"https://api.github.com/users/benknight/orgs","repos_url":"https://api.github.com/users/benknight/repos","events_url":"https://api.github.com/users/benknight/events{/privacy}","received_events_url":"https://api.github.com/users/benknight/received_events","type":"User","site_admin":false},"created_at":"2015-04-02T20:01:27Z","updated_at":"2015-04-02T20:01:27Z","body":"I think understand the confusion here.  I think what I expected was that abstracting font-size to the `em` function would allow you to modify just the base font size variable and have all typography on the site scale accordingly.  However, as `em` is implemented, no matter what $baseFontSize in, `em` will always output a value in `em` that will cause it to be the exact pixel value passed in as the parameter.\r\n\r\nIn this I ask, what is the point of the `em` function?  Given the browser landscape there is no longer a case for setting all font sizes in em units.  I believe the reason we used to do this was due to inconsistent zoom functionality in browsers, but not all browsers implement \"page zoom\", allowing authors to set hard pixel values for all text.\r\n\r\nAlso, if `em` is indeed behaving exactly as intended, then I feel like this framework is missing a mechanism through which authors can set one base font size and have all headings, etc scale accordingly.  Specifically, I'm building a site and instead of having a 14px body font I want to use 18px.  When I set `$baseFontSize` to 18px however, buttons, inputs, headings, etc all stay the same size instead of scaling according to the ratio of 14px/18px."}}