Commit 488ebdc1 authored by Robert Knight's avatar Robert Knight

Remove margins for spacer elements in thread list

These elements are used purely to reserve space for offscreen threads
which are not actually present in the DOM, so they should not occupy any
space beyond that assigned to their 'height' inline style properties.
parent b2faeb98
$thread-padding: $annotation-card-left-padding; $thread-padding: $annotation-card-left-padding;
.stream-list { .thread-list {
& > * { & > * {
margin-bottom: .72em; margin-bottom: .72em;
} }
...@@ -10,6 +10,13 @@ $thread-padding: $annotation-card-left-padding; ...@@ -10,6 +10,13 @@ $thread-padding: $annotation-card-left-padding;
} }
} }
.thread-list__spacer {
// This is a hidden element which is used to reserve space for off-screen
// threads, so it should not occupy any space other than that set via its
// 'height' inline style property.
margin: 0;
}
.annotation-unavailable-message { .annotation-unavailable-message {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
......
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
(See gh2642 for rationale for 'ng-show="true"') (See gh2642 for rationale for 'ng-show="true"')
--> -->
<ul class="stream-list ng-hide" <ul class="thread-list ng-hide"
ng-show="true" ng-show="true"
window-scroll="loadMore(20)"> window-scroll="loadMore(20)">
<search-status-bar <search-status-bar
...@@ -30,7 +30,8 @@ ...@@ -30,7 +30,8 @@
You do not have permission to see this annotation You do not have permission to see this annotation
</p> </p>
</li> </li>
<li ng-style="{height: virtualThreadList.offscreenUpperHeight}"></li> <li class="thread-list__spacer"
ng-style="{height: virtualThreadList.offscreenUpperHeight}"></li>
<li id="{{child.id}}" <li id="{{child.id}}"
class="annotation-card thread" class="annotation-card thread"
ng-class="{'js-hover': hasFocus(child.annotation)}" ng-class="{'js-hover': hasFocus(child.annotation)}"
...@@ -45,7 +46,8 @@ ...@@ -45,7 +46,8 @@
on-force-visible="forceVisible(thread)"> on-force-visible="forceVisible(thread)">
</annotation-thread> </annotation-thread>
</li> </li>
<li ng-style="{height: virtualThreadList.offscreenLowerHeight}"></li> <li class="thread-list__spacer"
ng-style="{height: virtualThreadList.offscreenLowerHeight}"></li>
<loggedout-message ng-if="isSidebar && shouldShowLoggedOutMessage()" <loggedout-message ng-if="isSidebar && shouldShowLoggedOutMessage()"
on-login="login()" ng-cloak> on-login="login()" ng-cloak>
</loggedout-message> </loggedout-message>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment