search

jedfoster / SassMeister

The Sass playground
http://sassmeister.com
199 stars 25 forks source link

Preview pane/tab is not visible on mobile sized viewports #174

Closed TheAppleFreak closed 8 years ago

TheAppleFreak commented 8 years ago

When the browser viewport is narrow enough that the site shows the mobile version of the site, the preview pane becomes completely blank, as if there was nothing to preview. Opening up the developer tools and inspecting the pane reveals that at that size it has a height of 0, and setting height: 100%; in element.style makes the element appear as expected.

I have reproduced this issue on Safari for iOS 9.0.2, Chrome 50, and Firefox 46.

The element in question is this one, with the properties copied straight from the web inspector:

<resizable id="sandboxResizable" r-directions="left" r-flex="true" r-width="preferences.sandboxResizable.width" r-height="preferences.sandboxResizable.height" ng-show="(!tabView && preferences.htmlVisible) || (tabView === 'result')" class="ng-isolate-scope resizable">

Maybe it's the ng-show? I'm not familiar with how SassMeister's front end works internally.

jedfoster commented 8 years ago

Was a CSS issue. Fixed now. You might need to clear browser cache.