Bug 1686539 - Fixed pages/collection collection list being cut off

Added a class to page and collection panels so we can use CSS to select
every second item on smaller screen and 4th item on larger screen then
set collection list and page access dropdown to right align.
Other collection list and page access dropdowns are left align.

Change-Id: If09e7e9d66dc727ee334dc3f9f4311e6a45716e9
behatnotneeded: styling only

htdocs/theme/raw/sass/layout/panel/_panel-quarter.scss

@@ -190,3 +190,23 @@
         }
     }
 }
+
+// Make collection list dropdown align right on the right most panel
+.panel-quarter {
+    &:nth-child(even) .collection-list .dropdown-menu,
+    &:nth-child(even) .page-access .dropdown-menu {
+        right: 0;
+        left: auto;
+        @media (min-width: $screen-sm-min) {
+            left: 0;
+            right: auto;
+        }
+    }
+    &:nth-child(4n) .collection-list .dropdown-menu,
+    &:nth-child(4n) .page-access .dropdown-menu {
+        @media (min-width: $screen-sm-min) {
+            right: 0;
+            left: auto;
+        }
+    }
+}

htdocs/theme/raw/templates/view/indexresults.tpl

                 {foreach from=$views item=view name=loopidx}
-                <div class="{if $view.collid}panel-collection{else}panel-view{/if}">
+                <div class="panel-quarter {if $view.collid}panel-collection{else}panel-view{/if}">
                     <div class="panel panel-default {if $view.submittedto} panel-warning {/if}
                     {if $view.template == $sitetemplate} site-template{/if}">
                         <h3 class="panel-heading has-link">
@@ -91,7 +91,7 @@
                                         <span class="icon {if !$view.accesslist}icon-lock{else}icon-unlock-alt{/if} close-indicator" role="presentation" aria-hidden="true"></span>
                                         <span class="sr-only">{str tag="accessrulesfor" section="view" arg1="$view.vtitle"}</span>
                                     </a>
-                                    <ul class="dropdown-menu dropdown-menu-left" role="menu">
+                                    <ul class="dropdown-menu" role="menu">
                                         {foreach from=$view.manageaccess item=manageitem}
                                         <li>
                                             {if $manageitem->accesstype == 'managesharing'}
@@ -167,7 +167,7 @@
                                     </button>
                                     {/if}
                                     {if $view.collid && $view.collviews > 0}
-                                    <ul class="dropdown-menu dropdown-menu-right" role="menu">
+                                    <ul class="dropdown-menu" role="menu">
                                         {if $view.framework}
                                         <li>
                                             <a href="{$view.framework->fullurl}">

htdocs/theme/raw_old/sass/layout/panel/_panel-quarter.scss

@@ -190,3 +190,23 @@
         }
     }
 }
+
+// Make collection list dropdown align right on the right most panel
+.panel-quarter {
+    &:nth-child(even) .collection-list .dropdown-menu,
+    &:nth-child(even) .page-access .dropdown-menu {
+        right: 0;
+        left: auto;
+        @media (min-width: $screen-sm-min) {
+            left: 0;
+            right: auto;
+        }
+    }
+    &:nth-child(4n) .collection-list .dropdown-menu,
+    &:nth-child(4n) .page-access .dropdown-menu {
+        @media (min-width: $screen-sm-min) {
+            right: 0;
+            left: auto;
+        }
+    }
+}

htdocs/theme/raw_old/templates/view/indexresults.tpl

                 {foreach from=$views item=view name=loopidx}
-                <div class="{if $view.collid}panel-collection{else}panel-view{/if}">
+                <div class="panel-quarter {if $view.collid}panel-collection{else}panel-view{/if}">
                     <div class="panel panel-default {if $view.submittedto} panel-warning {/if}
                     {if $view.template == $sitetemplate} site-template{/if}">
                         <h3 class="panel-heading has-link">
@@ -91,7 +91,7 @@
                                         <span class="icon {if !$view.accesslist}icon-lock{else}icon-unlock-alt{/if} close-indicator" role="presentation" aria-hidden="true"></span>
                                         <span class="sr-only">{str tag="accessrulesfor" section="view" arg1="$view.vtitle"}</span>
                                     </a>
-                                    <ul class="dropdown-menu dropdown-menu-left" role="menu">
+                                    <ul class="dropdown-menu" role="menu">
                                         {foreach from=$view.manageaccess item=manageitem}
                                         <li>
                                             {if $manageitem->accesstype == 'managesharing'}
@@ -163,7 +163,7 @@
                                     </button>
                                     {/if}
                                     {if $view.collid && $view.collviews > 0}
-                                    <ul class="dropdown-menu dropdown-menu-right" role="menu">
+                                    <ul class="dropdown-menu" role="menu">
                                         {if $view.framework}
                                         <li>
                                             <a href="{$view.framework->fullurl}">