Author: lkaufmann Date: 2014-05-15 16:55:00 +0200 (Thu, 15 May 2014) New Revision: 1944 Url: http://forge.codelutin.com/projects/wao/repository/revisions/1944 Log: Refs #4997 : Update display for boats screen Modified: trunk/wao-web/src/main/webapp/WEB-INF/content/obsmer/boats.jsp trunk/wao-web/src/main/webapp/wao.css Modified: trunk/wao-web/src/main/webapp/WEB-INF/content/obsmer/boats.jsp =================================================================== --- trunk/wao-web/src/main/webapp/WEB-INF/content/obsmer/boats.jsp 2014-05-15 14:33:21 UTC (rev 1943) +++ trunk/wao-web/src/main/webapp/WEB-INF/content/obsmer/boats.jsp 2014-05-15 14:55:00 UTC (rev 1944) @@ -222,6 +222,7 @@ </div> <div> + <div class="arrow-right"></div> <h2> <s:text name="wao.ui.boats.title"> <s:param value="%{pagination.nbRecords}"/> @@ -349,6 +350,7 @@ <s:if test="authenticatedWaoUser.authorizedToViewBoatDetails"> <div> + <div class="arrow-right"></div> <div id="boat-details"> <div class="alert alert-info"> <s:text name="wao.ui.tip.youMustChooseBoat" /> Modified: trunk/wao-web/src/main/webapp/wao.css =================================================================== --- trunk/wao-web/src/main/webapp/wao.css 2014-05-15 14:33:21 UTC (rev 1943) +++ trunk/wao-web/src/main/webapp/wao.css 2014-05-15 14:55:00 UTC (rev 1944) @@ -544,17 +544,38 @@ } #boats-filters-list-details-layout > div { - margin-left: 50px; + padding: 0 20px 0 30px; + border-right: 1px solid #AAA; + position: relative; } #boats-filters-list-details-layout > div:nth-child(1) { padding-top: 60px; + background: #DEDEDE; } +#boats-filters-list-details-layout > div:nth-child(2) { + background: #E6E6E6; +} + #boats-filters-list-details-layout > div:nth-child(3) { /*max-width: 35%;*/ flex: 1; + background: #EEEEEE; + border-right: 0; } + +#boats-filters-list-details-layout .arrow-right { + position: absolute; + top: 20px; + left: 0; + width: 0; + height: 0; + border-top: 10px solid transparent; + border-bottom: 10px solid transparent; + border-left: 10px solid #BBB; +} + #editor { max-height: 250px; height: 250px;