1255: Migrate search result presentation

Task-Url: https://pm.winseda.de/issues/1255

search/incl/result_item.jsp

 <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
 <%@ taglib prefix="s" uri="http://www.springframework.org/tags" %>
 
-<div style="clear: both;">
+
+<div class="search-results-item d-flex flex-row">
+
 	<div class="search-results-image" id="search-results-image-~{index}">
 		<div class="no-preview-overlay">
 		    <s:message code="~eu.dariah.de.minfba.search.view.result.resources.no_preview" />
@@ -21,62 +23,15 @@
 		</div>
 
 	</div>
-
-	<div style="margin-left: 170px;">
-		<div class="panel panel-search-result search-results-resource-item">
-			<div class="panel-heading">
-				<div class="search-results-resources-collection">~{datasource}<span class="score pull-right">~{score}</span></div>
-				<!-- <h3 class="panel-title"><a href='<s:url value="/item/~{type}/~{resultId}/" />'>~{title} <i class="fa fa-link" aria-hidden="true"></i></a></h3> -->
-				<h3 class="panel-title">~{title}</h3>
-			</div>
-			<div class="panel-body">
-				<div>
-					~{link}
-					<div class="search-result-objects" id="search-result-objects-~{index}">
-					</div>
-					<div class="panel-group search-result-subpanel" id="search-results-content-~{index}-accordion">
-						<div class="panel panel-default">
-							<div class="panel-heading">
-								<a class="collapsed" data-toggle="collapse" data-parent="search-results-content-~{index}-accordion" href="#search-results-content-~{index}-body">
-									<s:message code="~eu.dariah.de.minfba.search.view.result.resources.content" />
-								</a>
-							</div>
-							<div style="height: 0px;" id="search-results-content-~{index}-body" class="panel-collapse collapse">
-								<div class="panel-body">~{snippet}</div>
-							</div>
-						</div>
-					</div>
-					
-					<div class="panel-group search-result-subpanel original-data-panel" id="search-results-original-~{index}-accordion">
-						<div class="panel panel-default">
-							<div class="panel-heading">
-								<a class="collapsed" data-toggle="collapse" data-parent="search-results-original-~{index}-accordion" href="#search-results-original-~{index}-body">
-									<s:message code="~eu.dariah.de.minfba.search.view.result.original.content" />
-								</a>
-							</div>
-							<div style="height: 0px;" id="search-results-original-~{index}-body" class="panel-collapse collapse">
-								<div class="panel-body">~{original}</div>
-							</div>
-						</div>
-					</div>
-					
-					<c:if test="${explain}">
-						<div class="panel-group search-result-subpanel"
-							id="search-results-resources-~{index}-accordion">
-							<div class="panel panel-default">
-								<div class="panel-heading">
-									<a class="collapsed" data-toggle="collapse" data-parent="search-results-resources-~{index}-accordion" href="#search-results-resources-~{index}-body">
-										<s:message code="~eu.dariah.de.minfba.search.view.result.resources.explanation" />
-									</a>
-								</div>
-								<div style="height: 0px;" id="search-results-resources-~{index}-body" class="panel-collapse collapse">
-									<div class="panel-body">~{explanation}</div>
-								</div>
-							</div>
-						</div>
-					</c:if>
-				</div>
-			</div>
-		</div>
+	
+	<div class="flex-fill" style="background-color: red;">
+		lorem ipsum
 	</div>
-</div>
+
\ No newline at end of file
+
+</div>
+
+
+
+
+	
\ No newline at end of file

search/incl/result_item_premigrate.jsp

+<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
+<%@ taglib prefix="s" uri="http://www.springframework.org/tags" %>
+
+<div class="col-12">
+	<div class="search-results-image" id="search-results-image-~{index}">
+		<div class="no-preview-overlay">
+		    <s:message code="~eu.dariah.de.minfba.search.view.result.resources.no_preview" />
+		</div>
+		<div id="search-results-image-carousel-~{index}" class="carousel slide hide" data-interval="false">
+			<div class="carousel-inner" role="listbox"></div>
+
+			<!-- Controls -->
+			<a class="left carousel-control" href="#search-results-image-carousel-~{index}" role="button" data-slide="prev"> 
+				<span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
+				<span class="sr-only">Previous</span>
+			</a> 
+			<a class="right carousel-control" href="#search-results-image-carousel-~{index}" role="button" data-slide="next"> 
+				<span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
+				<span class="sr-only">Next</span>
+			</a>
+		</div>
+
+	</div>
+
+	<div style="margin-left: 170px;">
+		<div class="panel panel-search-result search-results-resource-item">
+			<div class="panel-heading">
+				<div class="search-results-resources-collection">~{datasource}<span class="score pull-right">~{score}</span></div>
+				<!-- <h3 class="panel-title"><a href='<s:url value="/item/~{type}/~{resultId}/" />'>~{title} <i class="fa fa-link" aria-hidden="true"></i></a></h3> -->
+				<h3 class="panel-title">~{title}</h3>
+			</div>
+			<div class="panel-body">
+				<div>
+					~{link}
+					<div class="search-result-objects" id="search-result-objects-~{index}">
+					</div>
+					<div class="panel-group search-result-subpanel" id="search-results-content-~{index}-accordion">
+						<div class="panel panel-default">
+							<div class="panel-heading">
+								<a class="collapsed" data-toggle="collapse" data-parent="search-results-content-~{index}-accordion" href="#search-results-content-~{index}-body">
+									<s:message code="~eu.dariah.de.minfba.search.view.result.resources.content" />
+								</a>
+							</div>
+							<div style="height: 0px;" id="search-results-content-~{index}-body" class="panel-collapse collapse">
+								<div class="panel-body">~{snippet}</div>
+							</div>
+						</div>
+					</div>
+					
+					<div class="panel-group search-result-subpanel original-data-panel" id="search-results-original-~{index}-accordion">
+						<div class="panel panel-default">
+							<div class="panel-heading">
+								<a class="collapsed" data-toggle="collapse" data-parent="search-results-original-~{index}-accordion" href="#search-results-original-~{index}-body">
+									<s:message code="~eu.dariah.de.minfba.search.view.result.original.content" />
+								</a>
+							</div>
+							<div style="height: 0px;" id="search-results-original-~{index}-body" class="panel-collapse collapse">
+								<div class="panel-body">~{original}</div>
+							</div>
+						</div>
+					</div>
+					
+					<c:if test="${explain}">
+						<div class="panel-group search-result-subpanel"
+							id="search-results-resources-~{index}-accordion">
+							<div class="panel panel-default">
+								<div class="panel-heading">
+									<a class="collapsed" data-toggle="collapse" data-parent="search-results-resources-~{index}-accordion" href="#search-results-resources-~{index}-body">
+										<s:message code="~eu.dariah.de.minfba.search.view.result.resources.explanation" />
+									</a>
+								</div>
+								<div style="height: 0px;" id="search-results-resources-~{index}-body" class="panel-collapse collapse">
+									<div class="panel-body">~{explanation}</div>
+								</div>
+							</div>
+						</div>
+					</c:if>
+				</div>
+			</div>
+		</div>
+	</div>
+</div>
\ No newline at end of file

templates/main.jsp

@@ -30,7 +30,7 @@
 					<div id="primary-content-area" class="row">
 						<!-- Notifications -->
 						<div id="notifications-area"></div>
-						<div class="grid-hidden grid-lg-visible col-lg-4 col-xl-4" >
+						<div class="grid-hidden grid-lg-visible col-lg-4 col-xl-3" >
 							<div class="sidebar-container"> 
 								<div id="editor-sidebar" class="sidebar">
 									<c:if test="${sideOpts!=null}">
@@ -40,7 +40,7 @@
 			              	</div>
 			      		</div>
 			      		
-			      		<div class="col-12 col-lg-8 col-xl-7">
+			      		<div class="col-12 col-lg-8 col-xl-8">
 			      			<main class="main">
 								<!-- Content -->
 								<tiles:insertAttribute name="content"/>