toolbar: Fix frame sizing with comments pane open.

Since iframes are "replaced elements" they don't auto fill space when a
left and right absolute position is specified. The hacky solution is to
add a container <div> which we can size appropriately and then fill with
the <iframe>.
This commit is contained in:
Max Goodman
2013-11-20 23:38:16 -08:00
parent f0bd94c528
commit 1ed4ac3848
2 changed files with 7 additions and 4 deletions

View File

@@ -3482,7 +3482,7 @@ body.contact-us-page {
}
#inner_toolbar {
#reddit_panel, #reddit_link {
#reddit_panel, #reddit_link_container, #reddit_link {
position: absolute;
height: 100%;
border: none;
@@ -3492,7 +3492,7 @@ body.contact-us-page {
width: 0;
}
#reddit_link {
#reddit_link_container, #reddit_link {
width: 100%;
}
@@ -3501,9 +3501,10 @@ body.contact-us-page {
width: 400px;
}
#reddit_link {
#reddit_link_container {
left: 400px;
right: 0;
width: auto;
}
}
}

View File

@@ -37,6 +37,8 @@
</head>
<body class="${'expanded' if thing.expanded else ''}" id="inner_toolbar" onload="window.frames[1].focus()">
<iframe frameborder="0" src="${add_sr('/toolbar/comments/'+thing.link._id36)}" id="reddit_panel" name="reddit_panel"></iframe>
<iframe frameborder="0" src="${thing.url}" id="reddit_link" name="reddit_link" sandbox="allow-scripts allow-forms allow-same-origin"></iframe>
<div id="reddit_link_container">
<iframe frameborder="0" src="${thing.url}" id="reddit_link" name="reddit_link" sandbox="allow-scripts allow-forms allow-same-origin"></iframe>
</div>
</body>
</html>