edit-task

Task Description: x] FEATURE-5100-RESPONSIVE - UPDATE {L1} view/PAGES - replace view pages and test

Start Date:

Start Time:

Duration:

Priority:

Status: To Do Completed In Process

Add Photo:

Owner ID:

Content: use HTML Edit Content <h1 style="text-align: center;">FEATURE 5100 Responsive</h1> <h2 style="text-align: center;">5100-UPDATE-108 - replace view/{L1} pages</h2> <h2>[previously]</h2> <ol> <li><strong>[REFERENCE][2015-07-23] NEW project</strong></li> <ol> <li>] # 5100 -&nbsp;<a href="/view/task?id=5100" target="_blank">project-5100-responsive</a>&nbsp;- a bootstrap makeover for sospep, project overview with description, plans and current status.</li> </ol> <li><strong><span style="background-color: #888888;">[2016-12-dd]</span> [00:00] NEW task</strong></li> <ol> <li>x] # 6674 - <a href="/view/task?id=6674" target="_blank">FEATURE-5100-update-108</a> - REPLACE - L1 view pages - libraries, ..., atlases</li> </ol> <li><strong>[00:00] NEW task&nbsp;</strong></li> <ol> <li>x] # # - TEST - manually review each of the pages,&nbsp;</li> <li>] DEVICES laptop(win), mobile, mobile(android), mobile(tablet), BROWSERS&nbsp;</li> </ol></ol> <h2>[currently]</h2> <ol> <li><strong>[2016-12-dd] SUMMARY CHANGES THIS UPDATE</strong></li> <ol> <li>] We re-wrote and uploaded the view/{L1} pages which include the view/libraries, view/warehouses, view/servers, view/communities, view/calendars and view/atlases pages. These L1 pages had been re written previously for bootstrap v3. The pages used the bootstrap media component to display a 2 column listing of all the items in each respective app. We continue to use the media component on this page. We had to adjust the code in the boostrap v3 pages to reflect changes in bootstrap v4. We are using a bootsnipp (code snippet) named "million dollar listing" to create the individual media items.&nbsp;</li> <li>] NEW PRB with aligment of the images/text in each media object. We would like the description text to display beside the image. We can acheive this by removing the clearfix element between the image and the text, but it then breaks responsive of the text on smaller screens (aka the text stays to the right of the image and you cant see it). For now we have the clearfix which causes the text to display beneath the image</li> <li>] We are using -draft- icon images on each "media item" to represent the items category - ex - library, warehouse, .... The icons are NOT a permanent and properly designed/matched/size but temporary 'icon sets' that will see us through for now.&nbsp;</li> <li>&nbsp;</li> </ol></ol> <h2>[next]&nbsp;</h2> <ol> <li><strong>&gt;[18:00] NEW PRB</strong></li> <ol> <li>i] # # - FIX-PRB-nnnn&nbsp;- image text alignment inside media component.</li> </ol> <li><strong>[00:00] NEW task IN&nbsp;</strong></li> <ol> <li>i] # 6675 - upgrade images - research/replace - icon image sets</li> </ol> <li><strong>[00:00] NEW task IN&nbsp;</strong></li> <ol> <li>] # # - testing - more browser, more devices -&nbsp;</li> </ol></ol>