Ignore:
Timestamp:
May 3, 2021, 1:20:19 PM (3 months ago)
Author:
Nicklas Nordborg
Message:

References #2246: Sticky table headers

Implemented for all items in the "View" menu.

File:
1 edited

Legend:

Unmodified
Added
Removed
  • branches/3.18-stable/www/views/itemlists/list_lists.jsp

    r7932 r7938  
    153153    <ext:scripts context="<%=jspContext%>" />
    154154    <ext:stylesheets context="<%=jspContext%>" />
     155    <style>
     156    .row-index
     157    {
     158      width: 8.5em !important;
     159    }
     160    .row-index > div
     161    {
     162      grid-template-columns: 1fr 20px 52px !important;
     163    }
     164    </style>
    155165  </base:head>
    156166 
     
    167177      item="<%=itemType%>"
    168178      filterrows="<%=cc.getFilterRows()%>"
    169       subclass="fulltable sticky-headers"
     179      subclass="fulltable"
     180      stickyheaders="name"
    170181      >
    171182      <tbl:hidden
     
    436447        <tbl:headers>
    437448          <tbl:headerrow>
    438             <tbl:header colspan="3" />
     449            <tbl:header clazz="row-index bg-filled-100" />
    439450            <tbl:columnheaders />
    440451          </tbl:headerrow>
     
    447458            %>
    448459            <tbl:headerrow>
    449               <tbl:header subclass="index" />
    450               <tbl:header
    451                 subclass="check"
    452                 visible="<%=mode.hasCheck()%>"
    453                 ><base:icon
    454                   subclass="link table-check"
    455                   image="check_uncheck.png"
    456                   tooltip="Toggle all (use CTRL, ALT or SHIFT to check/uncheck)"
    457                   visible="<%=lastRow%>"
    458                 /></tbl:header>
    459               <tbl:header
    460                 subclass="check"
    461                 visible="<%=mode.hasRadio()%>"
    462                 />
    463               <tbl:header
    464                 subclass="icons"
    465                 visible="<%=mode.hasIcons()%>"
    466                 >
    467                 <base:icon
    468                   subclass="link table-filter-row-action"
    469                   image="add.png"
    470                   tooltip="Add extra filter row"
    471                   visible="<%=lastRow%>"
    472                 /><base:icon
    473                   subclass="link table-filter-row-action"
    474                   image="remove.png"
    475                   tooltip="Remove this filter row"
    476                   visible="<%=numRows > 1 || numFilters > 0 %>"
    477                   data-remove-row="<%=filterNo%>"
    478                 />
     460              <tbl:header subclass="row-index bg-filled-100">
     461                <div class="index-<%=mode.getName()%>">
     462                  <div class="index"></div>
     463                  <div class="check">
     464                    <base:icon
     465                      subclass="link table-check"
     466                      image="check_uncheck.png"
     467                      tooltip="Toggle all (use CTRL, ALT or SHIFT to check/uncheck)"
     468                      visible="<%=lastRow && mode.hasCheck()%>"
     469                    />
     470                  </div>
     471                  <div class="icons">
     472                    <base:icon
     473                      subclass="link table-filter-row-action"
     474                      image="add.png"
     475                      tooltip="Add extra filter row"
     476                      visible="<%=lastRow%>"
     477                    /><base:icon
     478                      subclass="link table-filter-row-action"
     479                      image="remove.png"
     480                      tooltip="Remove this filter row"
     481                      visible="<%=numRows > 1 || numFilters > 0 %>"
     482                      data-remove-row="<%=filterNo%>"
     483                    />
     484                  </div>
     485                </div>
    479486              </tbl:header>
    480487              <tbl:propertyfilter row="<%=filterNo%>" />
     
    517524              %>
    518525              <tbl:row>
    519                 <tbl:header
    520                   clazz="index"
    521                   ><%=index%></tbl:header>
    522                 <tbl:header
    523                   clazz="check"
    524                   visible="<%=mode.hasCheck()%>"
    525                   ><input
    526                     type="checkbox"
    527                     name="<%=itemId%>"
    528                     value="<%=itemId%>"
    529                     title="<%=name%>"
    530                     <%=cc.getSelected().contains(itemId) ? "checked" : ""%>
    531                   ></tbl:header>
    532                 <tbl:header
    533                   clazz="check"
    534                   visible="<%=mode.hasRadio()%>"
    535                   ><input
    536                     type="radio"
    537                     name="item_id"
    538                     value="<%=itemId%>"
    539                     title="<%=name%>"
    540                     <%=selectedItemId == itemId ? "checked" : ""%>
    541                   ></tbl:header>
    542                 <tbl:header
    543                   clazz="icons"
    544                   visible="<%=mode.hasIcons()%>"
    545                   ><base:icon
    546                     image="deleted.png"
    547                     id="<%="delete."+itemId %>"
    548                     subclass="<%=deletePermission ? "table-delete-item" : "disabled" %>"
    549                     data-item-id="<%=itemId%>"
    550                     tooltip="This item has been scheduled for deletion"
    551                     visible="<%=item.isRemoved()%>"
    552                   /><base:icon
    553                     image="shared.png"
    554                     id="<%="share."+itemId %>"
    555                     subclass="<%=sharePermission ? "table-share-item" : "disabled" %>"
    556                     data-item-id="<%=itemId%>"
    557                     tooltip="This item is shared to other users, groups and/or projects"
    558                     visible="<%=item.isShared()%>"
    559                   /><base:icon
    560                     image="copy.png"
    561                     id="<%="clone."+itemId %>"
    562                     tooltip="Create a new list using this as a template"
    563                     subclass="auto-init"
    564                     data-auto-init="clone"
    565                     data-item-id="<%=itemId %>"
    566                     visible="<%=createPermission%>"
    567                   />&nbsp;</tbl:header>
     526                <tbl:header clazz="row-index bg-filled-100">
     527                  <div class="index-<%=mode.getName()%>">
     528                    <div class="index <%=index>999?"index-smaller":""%>"><%=index%></div>
     529                    <div class="check">
     530                      <base:input
     531                        type="checkbox"
     532                        name="<%=itemId%>"
     533                        value="<%=itemId%>"
     534                        title="<%=name%>"
     535                        checked="<%=cc.getSelected().contains(itemId)%>"
     536                        visible="<%=mode.hasCheck()%>"
     537                      />
     538                      <base:input
     539                        type="radio"
     540                        name="item_id"
     541                        value="<%=itemId%>"
     542                        title="<%=name%>"
     543                        checked="<%=selectedItemId == itemId%>"
     544                        visible="<%=mode.hasRadio()%>"
     545                      />
     546                    </div>
     547                    <div class="icons">
     548                      <base:icon
     549                        image="deleted.png"
     550                        id="<%="delete."+itemId %>"
     551                        subclass="<%=deletePermission ? "table-delete-item" : "disabled" %>"
     552                        data-item-id="<%=itemId%>"
     553                        tooltip="This item has been scheduled for deletion"
     554                        visible="<%=item.isRemoved()%>"
     555                      /><base:icon
     556                        image="shared.png"
     557                        id="<%="share."+itemId %>"
     558                        subclass="<%=sharePermission ? "table-share-item" : "disabled" %>"
     559                        data-item-id="<%=itemId%>"
     560                        tooltip="This item is shared to other users, groups and/or projects"
     561                        visible="<%=item.isShared()%>"
     562                      />
     563                      <base:icon
     564                        image="copy.png"
     565                        id="<%="clone."+itemId %>"
     566                        tooltip="Create a new list using this as a template"
     567                        subclass="auto-init"
     568                        data-auto-init="clone"
     569                        data-item-id="<%=itemId %>"
     570                        visible="<%=createPermission%>"
     571                      />
     572                    </div>
     573                  </div>
     574                </tbl:header>
    568575                <tbl:cell column="name"><div
    569576                  class="link table-item"
Note: See TracChangeset for help on using the changeset viewer.