소스 검색

update jsp files in orig

Shinsuke Sugaya 7 년 전
부모
커밋
a0105659db

+ 317 - 308
src/main/webapp/WEB-INF/orig/view/advance.jsp

@@ -11,328 +11,337 @@
 		title="<la:message key="labels.index_osdd_title" />"
 	/>
 </c:if>
-<link href="${fe:url('/css/style-base.css')}" rel="stylesheet" type="text/css" />
+<link href="${fe:url('/css/bootstrap.min.css')}" rel="stylesheet" type="text/css" />
 <link href="${fe:url('/css/style.css')}" rel="stylesheet" type="text/css" />
 <link href="${fe:url('/css/font-awesome.min.css')}" rel="stylesheet" type="text/css" />
 </head>
 <body>
 	<la:form styleClass="form-stacked" action="/search/" method="get" styleId="searchForm">
 		${fe:facetForm()}${fe:geoForm()}
-		<nav class="navbar navbar-dark bg-inverse navbar-static-top pos-f-t">
-			<la:link styleClass="navbar-brand" href="/">
-				<img src="${fe:url('/images/logo-head.png')}"
-					alt="<la:message key="labels.header_brand_name" />" />
-			</la:link>
-			<ul class="nav navbar-nav pull-right">
-				<c:choose>
-					<c:when test="${!empty username && username != 'guest'}">
-						<li class="nav-item">
-							<div class="dropdown">
-								<a class="nav-link dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true"
-									aria-expanded="false"
-								> <i class="fa fa-user"></i>${username}
-								</a>
-								<div class="dropdown-menu" aria-labelledby="userMenu">
-									<c:if test="${editableUser == true}">
-										<la:link href="/profile" styleClass="dropdown-item">
-											<la:message key="labels.profile" />
-										</la:link>
-									</c:if>
-									<c:if test="${adminUser == true}">
-										<la:link href="/admin" styleClass="dropdown-item">
-											<la:message key="labels.administration" />
-										</la:link>
-									</c:if>
-									<la:link href="/logout/" styleClass="dropdown-item">
-										<la:message key="labels.logout" />
-									</la:link>
-								</div>
-							</div>
-						</li>
-					</c:when>
-					<c:when test="${ pageLoginLink }">
-						<li class="nav-item username"><la:link href="/login" styleClass="nav-link" role="button" aria-haspopup="true"
-								aria-expanded="false"
-							>
-								<i class="fa fa-sign-in"></i>
-								<la:message key="labels.login" />
-							</la:link></li>
-					</c:when>
-				</c:choose>
-				<li class="nav-item"><la:link href="/help" styleClass="nav-link help-link">
-						<i class="fa fa-question-circle"></i>
-						<la:message key="labels.index_help" />
-					</la:link></li>
-			</ul>
-		</nav>
-		<div id="content" class="container">
-			<div class="row content">
-				<div class="center-block">
-					<h2>
-						<la:message key="labels.advance_search_title" />
-					</h2>
-					<div class="notification">${notification}</div>
-					<div>
-						<la:info id="msg" message="true">
-							<div class="alert alert-info">${msg}</div>
-						</la:info>
-						<la:errors header="errors.front_header" footer="errors.front_footer" prefix="errors.front_prefix"
-							suffix="errors.front_suffix"
-						/>
-					</div>
-					<div class="form-group row">
-						<label for="as_q" class="col-lg-3 col-md-4 col-sm-5 col-xs-6 col-form-label"><la:message
-								key="labels.advance_search_must_queries"
-							/></label>
-						<div class="col-lg-5 col-md-8 col-sm-7 col-xs-6">
-							<input class="form-control" type="text" id="as_q" name="as.q" value="${f:h(fe:join(as.q))}">
-						</div>
-						<div class="col-lg-4 hidden-md-down">
-							<!-- TODO -->
-						</div>
-					</div>
-					<div class="form-group row">
-						<label for="as_epq" class="col-lg-3 col-md-4 col-sm-5 col-xs-6 col-form-label"><la:message
-								key="labels.advance_search_phrase_query"
-							/></label>
-						<div class="col-lg-5 col-md-8 col-sm-7 col-xs-6">
-							<input class="form-control" type="text" id="as_epq" name="as.epq" value="${f:h(fe:join(as.epq))}">
-						</div>
-						<div class="col-lg-4 hidden-md-down">
-							<!-- TODO -->
-						</div>
-					</div>
-					<div class="form-group row">
-						<label for="as_oq" class="col-lg-3 col-md-4 col-sm-5 col-xs-6 col-form-label"><la:message
-								key="labels.advance_search_should_queries"
-							/></label>
-						<div class="col-lg-5 col-md-8 col-sm-7 col-xs-6">
-							<input class="form-control" type="text" id="as_oq" name="as.oq" value="${f:h(fe:join(as.oq))}">
-						</div>
-						<div class="col-lg-4 hidden-md-down">
-							<!-- TODO -->
-						</div>
-					</div>
-					<div class="form-group row">
-						<label for="as_nq" class="col-lg-3 col-md-4 col-sm-5 col-xs-6 col-form-label"><la:message
-								key="labels.advance_search_not_queries"
-							/></label>
-						<div class="col-lg-5 col-md-8 col-sm-7 col-xs-6">
-							<input class="form-control" type="text" id="as_nq" name="as.nq" value="${f:h(fe:join(as.nq))}">
-						</div>
-						<div class="col-lg-4 hidden-md-down">
-							<!-- TODO -->
-						</div>
-					</div>
-					<div class="form-group row">
-						<label for="contentNum" class="col-lg-3 col-md-4 col-sm-5 col-xs-6 col-form-label"><la:message
-								key="labels.index_num"
-							/></label>
-						<div class="col-lg-5 col-md-8 col-sm-7 col-xs-6">
-							<la:select property="num" styleId="numSearchOption" styleClass="form-control">
-								<option value="">
-									<la:message key="labels.search_result_select_num" />
-								</option>
-								<la:option value="10">10</la:option>
-								<la:option value="20">20</la:option>
-								<la:option value="30">30</la:option>
-								<la:option value="40">40</la:option>
-								<la:option value="50">50</la:option>
-								<la:option value="100">100</la:option>
-							</la:select>
-						</div>
-						<div class="col-lg-4 hidden-md-down">
-							<!-- TODO -->
-						</div>
-					</div>
-					<div class="form-group row">
-						<label for="contentSort" class="col-lg-3 col-md-4 col-sm-5 col-xs-6 col-form-label"><la:message
-								key="labels.index_sort"
-							/></label>
-						<div class="col-lg-5 col-md-8 col-sm-7 col-xs-6">
-							<la:select property="sort" styleId="sortSearchOption" styleClass="form-control">
-								<option value="">
-									<la:message key="labels.search_result_select_sort" />
-								</option>
-								<la:option value="score.desc">
-									<la:message key="labels.search_result_sort_score_desc" />
-								</la:option>
-								<la:option value="filename.asc">
-									<la:message key="labels.search_result_sort_filename_asc" />
-								</la:option>
-								<la:option value="filename.desc">
-									<la:message key="labels.search_result_sort_filename_desc" />
-								</la:option>
-								<la:option value="created.asc">
-									<la:message key="labels.search_result_sort_created_asc" />
-								</la:option>
-								<la:option value="created.desc">
-									<la:message key="labels.search_result_sort_created_desc" />
-								</la:option>
-								<la:option value="content_length.asc">
-									<la:message key="labels.search_result_sort_content_length_asc" />
-								</la:option>
-								<la:option value="content_length.desc">
-									<la:message key="labels.search_result_sort_content_length_desc" />
-								</la:option>
-								<la:option value="last_modified.asc">
-									<la:message key="labels.search_result_sort_last_modified_asc" />
-								</la:option>
-								<la:option value="last_modified.desc">
-									<la:message key="labels.search_result_sort_last_modified_desc" />
-								</la:option>
-								<c:if test="${searchLogSupport}">
-									<la:option value="click_count.asc">
-										<la:message key="labels.search_result_sort_click_count_asc" />
-									</la:option>
-									<la:option value="click_count.desc">
-										<la:message key="labels.search_result_sort_click_count_desc" />
-									</la:option>
-								</c:if>
-								<c:if test="${favoriteSupport}">
-									<la:option value="favorite_count.asc">
-										<la:message key="labels.search_result_sort_favorite_count_asc" />
-									</la:option>
-									<la:option value="favorite_count.desc">
-										<la:message key="labels.search_result_sort_favorite_count_desc" />
-									</la:option>
-								</c:if>
-							</la:select>
-						</div>
-						<div class="col-lg-4 hidden-md-down">
-							<!-- TODO -->
-						</div>
-					</div>
-					<div class="form-group row">
-						<label for="contentLang" class="col-lg-3 col-md-4 col-sm-5 col-xs-6 col-form-label"><la:message
-								key="labels.index_lang"
-							/></label>
-						<div class="col-lg-5 col-md-8 col-sm-7 col-xs-6">
-							<la:select property="lang" styleId="langSearchOption" multiple="true" styleClass="form-control">
-								<c:forEach var="item" items="${langItems}">
-									<la:option value="${f:u(item.value)}">${f:h(item.label)}</la:option>
-								</c:forEach>
-							</la:select>
-						</div>
-						<div class="col-lg-4 hidden-md-down">
-							<!-- TODO -->
-						</div>
-					</div>
-					<c:if test="${displayLabelTypeItems}">
-						<div class="form-group row">
-							<label for="contentLabelType" class="col-lg-3 col-md-4 col-sm-5 col-xs-6 col-form-label"><la:message
-									key="labels.index_label"
-								/></label>
-							<div class="col-lg-5 col-md-8 col-sm-7 col-xs-6">
-								<la:select property="fields.label" styleId="labelTypeSearchOption" multiple="true" styleClass="form-control">
-									<c:forEach var="item" items="${labelTypeItems}">
-										<la:option value="${f:u(item.value)}">${f:h(item.label)}</la:option>
-									</c:forEach>
-								</la:select>
-							</div>
-							<div class="col-lg-4 hidden-md-down">
-								<!-- TODO -->
-							</div>
-						</div>
-					</c:if>
-					<div class="form-group row">
-						<label for="as_timestamp" class="col-lg-3 col-md-4 col-sm-5 col-xs-6 col-form-label"><la:message
-								key="labels.advance_search_timestamp"
-							/></label>
-						<div class="col-lg-5 col-md-8 col-sm-7 col-xs-6">
-							<select id="as_timestamp" name="as.timestamp" class="form-control">
-								<option value=""><la:message key="labels.advance_search_timestamp_default" /></option>
-								<option value="[now-1d/d TO *]"
-									<c:if test="${as.timestamp.contains('[now-1d/d TO *]')}">selected</c:if>
-								><la:message key="labels.advance_search_timestamp_pastday" /></option>
-								<option value="[now-1w/d TO *]"
-									<c:if test="${as.timestamp.contains('[now-1w/d TO *]')}">selected</c:if>
-								><la:message key="labels.advance_search_timestamp_pastweek" /></option>
-								<option value="[now-1M/d TO *]"
-									<c:if test="${as.timestamp.contains('[now-1M/d TO *]')}">selected</c:if>
-								><la:message key="labels.advance_search_timestamp_pastmonth" /></option>
-								<option value="[now-1y/d TO *]"
-									<c:if test="${as.timestamp.contains('[now-1y/d TO *]')}">selected</c:if>
-								><la:message key="labels.advance_search_timestamp_pastyear" /></option>
-							</select>
-						</div>
-						<div class="col-lg-4 hidden-md-down">
-							<!-- TODO -->
-						</div>
-					</div>
-					<div class="form-group row">
-						<label for="as_filetype" class="col-lg-3 col-md-4 col-sm-5 col-xs-6 col-form-label"><la:message
-								key="labels.advance_search_filetype"
-							/></label>
-						<div class="col-lg-5 col-md-8 col-sm-7 col-xs-6">
-							<select id="as_filetype" name="as.filetype" class="form-control">
-								<option value=""><la:message key="labels.advance_search_filetype_default" /></option>
-								<option value="html" <c:if test="${as.filetype.contains('html')}">selected</c:if>><la:message
-										key="labels.advance_search_filetype_html"
-									/></option>
-								<option value="pdf" <c:if test="${as.filetype.contains('pdf')}">selected</c:if>><la:message
-										key="labels.advance_search_filetype_pdf"
-									/></option>
-								<option value="word" <c:if test="${as.filetype.contains('word')}">selected</c:if>><la:message
-										key="labels.advance_search_filetype_word"
-									/></option>
-								<option value="excel" <c:if test="${as.filetype.contains('excel')}">selected</c:if>><la:message
-										key="labels.advance_search_filetype_excel"
-									/></option>
-								<option value="powerpoint" <c:if test="${as.filetype.contains('powerpoint')}">selected</c:if>><la:message
-										key="labels.advance_search_filetype_powerpoint"
-									/></option>
-							</select>
-						</div>
-						<div class="col-lg-4 hidden-md-down">
-							<!-- TODO -->
-						</div>
-					</div>
-					<div class="form-group row">
-						<label for="as_occt" class="col-lg-3 col-md-4 col-sm-5 col-xs-6 col-form-label"><la:message
-								key="labels.advance_search_occt"
-							/></label>
-						<div class="col-lg-5 col-md-8 col-sm-7 col-xs-6">
-							<select id="as_occt" name="as.occt" class="form-control">
-								<option value=""><la:message key="labels.advance_search_occt_default" /></option>
-								<option value="allintitle" <c:if test="${as.occt.contains('allintitle')}">selected</c:if>><la:message
-										key="labels.advance_search_occt_allintitle"
-									/></option>
-								<option value="allinurl" <c:if test="${as.occt.contains('allinurl')}">selected</c:if>><la:message
-										key="labels.advance_search_occt_allinurl"
-									/></option>
-							</select>
-						</div>
-						<div class="col-lg-4 hidden-md-down">
-							<!-- TODO -->
-						</div>
-					</div>
-					<div class="form-group row">
-						<label for="as_sitesearch" class="col-lg-3 col-md-4 col-sm-5 col-xs-6 col-form-label"><la:message
-								key="labels.advance_search_sitesearch"
-							/></label>
-						<div class="col-lg-5 col-md-8 col-sm-7 col-xs-6">
-							<input class="form-control" type="text" id="as_sitesearch" name="as.sitesearch" value="${f:h(fe:join(as.sitesearch))}">
-						</div>
-						<div class="col-lg-4 hidden-md-down">
-							<!-- TODO -->
-						</div>
+		<header>
+			<nav class="navbar navbar-expand-md navbar-dark fixed-top bg-dark">
+				<div class="container">
+					<la:link styleClass="navbar-brand d-inline-flex" href="/">
+						<img src="${fe:url('/images/logo-head.png')}"
+							alt="<la:message key="labels.header_brand_name" />"
+							class="align-items-center" />
+					</la:link>
+					<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbar" aria-controls="navbar"
+						aria-expanded="false" aria-label="Toggle navigation">
+						<span class="navbar-toggler-icon"></span>
+					</button>
+					<div class="collapse navbar-collapse" id="navbar">
+						<div class="mr-auto"></div>
+						<ul class="nav navbar-nav">
+							<c:choose>
+								<c:when test="${!empty username && username != 'guest'}">
+									<li class="nav-item">
+										<div class="dropdown">
+											<a class="nav-link dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true"
+												aria-expanded="false"
+											> <i class="fa fa-fw fa-user"></i>${username}
+											</a>
+											<div class="dropdown-menu" aria-labelledby="userMenu">
+												<c:if test="${editableUser == true}">
+													<la:link href="/profile" styleClass="dropdown-item">
+														<la:message key="labels.profile" />
+													</la:link>
+												</c:if>
+												<c:if test="${adminUser == true}">
+													<la:link href="/admin" styleClass="dropdown-item">
+														<la:message key="labels.administration" />
+													</la:link>
+												</c:if>
+												<la:link href="/logout/" styleClass="dropdown-item">
+													<la:message key="labels.logout" />
+												</la:link>
+											</div>
+										</div>
+									</li>
+								</c:when>
+								<c:when test="${ pageLoginLink }">
+									<li class="nav-item"><la:link href="/login" styleClass="nav-link" role="button" aria-haspopup="true"
+											aria-expanded="false"
+										>
+											<i class="fa fa-fw fa-sign-in"></i>
+											<la:message key="labels.login" />
+										</la:link></li>
+								</c:when>
+							</c:choose>
+							<li class="nav-item"><la:link href="/help" styleClass="nav-link help-link">
+									<i class="fa fa-fw fa-question-circle"></i>
+									<la:message key="labels.index_help" />
+								</la:link></li>
+						</ul>
 					</div>
+				</div>
+			</nav>
+		</header>
 
-					<div class="center">
-						<button type="submit" name="search" id="searchButton" class="btn btn-primary">
-							<i class="fa fa-search"></i>
-							<la:message key="labels.index_form_search_btn" />
-						</button>
+		<main id="content" class="container">
+			<h2>
+				<la:message key="labels.advance_search_title" />
+			</h2>
+			<div class="notification">${notification}</div>
+			<div>
+				<la:info id="msg" message="true">
+					<div class="alert alert-info">${msg}</div>
+				</la:info>
+				<la:errors header="errors.front_header" footer="errors.front_footer" prefix="errors.front_prefix"
+					suffix="errors.front_suffix"
+				/>
+			</div>
+			<div class="form-group row">
+				<label for="as_q" class="col-lg-3 col-md-4 col-sm-5 col-12 col-form-label"><la:message
+						key="labels.advance_search_must_queries"
+					/></label>
+				<div class="col-lg-5 col-md-8 col-sm-7 col-xs-6">
+					<input class="form-control" type="text" id="as_q" name="as.q" value="${f:h(fe:join(as.q))}">
+				</div>
+				<div class="col-lg-4 d-none d-lg-flex align-items-center">
+					<!-- TODO -->
+				</div>
+			</div>
+			<div class="form-group row">
+				<label for="as_epq" class="col-lg-3 col-md-4 col-sm-5 col-12 col-form-label"><la:message
+						key="labels.advance_search_phrase_query"
+					/></label>
+				<div class="col-lg-5 col-md-8 col-sm-7 col-xs-6">
+					<input class="form-control" type="text" id="as_epq" name="as.epq" value="${f:h(fe:join(as.epq))}">
+				</div>
+				<div class="col-lg-4 d-none d-lg-flex align-items-center">
+					<!-- TODO -->
+				</div>
+			</div>
+			<div class="form-group row">
+				<label for="as_oq" class="col-lg-3 col-md-4 col-sm-5 col-12 col-form-label"><la:message
+						key="labels.advance_search_should_queries"
+					/></label>
+				<div class="col-lg-5 col-md-8 col-sm-7 col-xs-6">
+					<input class="form-control" type="text" id="as_oq" name="as.oq" value="${f:h(fe:join(as.oq))}">
+				</div>
+				<div class="col-lg-4 d-none d-lg-flex align-items-center">
+					<!-- TODO -->
+				</div>
+			</div>
+			<div class="form-group row">
+				<label for="as_nq" class="col-lg-3 col-md-4 col-sm-5 col-12 col-form-label"><la:message
+						key="labels.advance_search_not_queries"
+					/></label>
+				<div class="col-lg-5 col-md-8 col-sm-7 col-xs-6">
+					<input class="form-control" type="text" id="as_nq" name="as.nq" value="${f:h(fe:join(as.nq))}">
+				</div>
+				<div class="col-lg-4 d-none d-lg-flex align-items-center">
+					<!-- TODO -->
+				</div>
+			</div>
+			<div class="form-group row">
+				<label for="contentNum" class="col-lg-3 col-md-4 col-sm-5 col-12 col-form-label"><la:message
+						key="labels.index_num"
+					/></label>
+				<div class="col-lg-5 col-md-8 col-sm-7 col-xs-6">
+					<la:select property="num" styleId="numSearchOption" styleClass="form-control">
+						<option value="">
+							<la:message key="labels.search_result_select_num" />
+						</option>
+						<la:option value="10">10</la:option>
+						<la:option value="20">20</la:option>
+						<la:option value="30">30</la:option>
+						<la:option value="40">40</la:option>
+						<la:option value="50">50</la:option>
+						<la:option value="100">100</la:option>
+					</la:select>
+				</div>
+				<div class="col-lg-4 d-none d-lg-flex align-items-center">
+					<!-- TODO -->
+				</div>
+			</div>
+			<div class="form-group row">
+				<label for="contentSort" class="col-lg-3 col-md-4 col-sm-5 col-12 col-form-label"><la:message
+						key="labels.index_sort"
+					/></label>
+				<div class="col-lg-5 col-md-8 col-sm-7 col-xs-6">
+					<la:select property="sort" styleId="sortSearchOption" styleClass="form-control">
+						<option value="">
+							<la:message key="labels.search_result_select_sort" />
+						</option>
+						<la:option value="score.desc">
+							<la:message key="labels.search_result_sort_score_desc" />
+						</la:option>
+						<la:option value="filename.asc">
+							<la:message key="labels.search_result_sort_filename_asc" />
+						</la:option>
+						<la:option value="filename.desc">
+							<la:message key="labels.search_result_sort_filename_desc" />
+						</la:option>
+						<la:option value="created.asc">
+							<la:message key="labels.search_result_sort_created_asc" />
+						</la:option>
+						<la:option value="created.desc">
+							<la:message key="labels.search_result_sort_created_desc" />
+						</la:option>
+						<la:option value="content_length.asc">
+							<la:message key="labels.search_result_sort_content_length_asc" />
+						</la:option>
+						<la:option value="content_length.desc">
+							<la:message key="labels.search_result_sort_content_length_desc" />
+						</la:option>
+						<la:option value="last_modified.asc">
+							<la:message key="labels.search_result_sort_last_modified_asc" />
+						</la:option>
+						<la:option value="last_modified.desc">
+							<la:message key="labels.search_result_sort_last_modified_desc" />
+						</la:option>
+						<c:if test="${searchLogSupport}">
+							<la:option value="click_count.asc">
+								<la:message key="labels.search_result_sort_click_count_asc" />
+							</la:option>
+							<la:option value="click_count.desc">
+								<la:message key="labels.search_result_sort_click_count_desc" />
+							</la:option>
+						</c:if>
+						<c:if test="${favoriteSupport}">
+							<la:option value="favorite_count.asc">
+								<la:message key="labels.search_result_sort_favorite_count_asc" />
+							</la:option>
+							<la:option value="favorite_count.desc">
+								<la:message key="labels.search_result_sort_favorite_count_desc" />
+							</la:option>
+						</c:if>
+					</la:select>
+				</div>
+				<div class="col-lg-4 d-none d-lg-flex align-items-center">
+					<!-- TODO -->
+				</div>
+			</div>
+			<div class="form-group row">
+				<label for="contentLang" class="col-lg-3 col-md-4 col-sm-5 col-12 col-form-label"><la:message
+						key="labels.index_lang"
+					/></label>
+				<div class="col-lg-5 col-md-8 col-sm-7 col-xs-6">
+					<la:select property="lang" styleId="langSearchOption" multiple="true" styleClass="form-control">
+						<c:forEach var="item" items="${langItems}">
+							<la:option value="${f:u(item.value)}">${f:h(item.label)}</la:option>
+						</c:forEach>
+					</la:select>
+				</div>
+				<div class="col-lg-4 d-none d-lg-flex align-items-center">
+					<!-- TODO -->
+				</div>
+			</div>
+			<c:if test="${displayLabelTypeItems}">
+				<div class="form-group row">
+					<label for="contentLabelType" class="col-lg-3 col-md-4 col-sm-5 col-12 col-form-label"><la:message
+							key="labels.index_label"
+						/></label>
+					<div class="col-lg-5 col-md-8 col-sm-7 col-xs-6">
+						<la:select property="fields.label" styleId="labelTypeSearchOption" multiple="true" styleClass="form-control">
+							<c:forEach var="item" items="${labelTypeItems}">
+								<la:option value="${f:u(item.value)}">${f:h(item.label)}</la:option>
+							</c:forEach>
+						</la:select>
+					</div>
+					<div class="col-lg-4 d-none d-lg-flex align-items-center">
+						<!-- TODO -->
 					</div>
 				</div>
+			</c:if>
+			<div class="form-group row">
+				<label for="as_timestamp" class="col-lg-3 col-md-4 col-sm-5 col-12 col-form-label"><la:message
+						key="labels.advance_search_timestamp"
+					/></label>
+				<div class="col-lg-5 col-md-8 col-sm-7 col-xs-6">
+					<select id="as_timestamp" name="as.timestamp" class="form-control">
+						<option value=""><la:message key="labels.advance_search_timestamp_default" /></option>
+						<option value="[now-1d/d TO *]"
+							<c:if test="${as.timestamp.contains('[now-1d/d TO *]')}">selected</c:if>
+						><la:message key="labels.advance_search_timestamp_pastday" /></option>
+						<option value="[now-1w/d TO *]"
+							<c:if test="${as.timestamp.contains('[now-1w/d TO *]')}">selected</c:if>
+						><la:message key="labels.advance_search_timestamp_pastweek" /></option>
+						<option value="[now-1M/d TO *]"
+							<c:if test="${as.timestamp.contains('[now-1M/d TO *]')}">selected</c:if>
+						><la:message key="labels.advance_search_timestamp_pastmonth" /></option>
+						<option value="[now-1y/d TO *]"
+							<c:if test="${as.timestamp.contains('[now-1y/d TO *]')}">selected</c:if>
+						><la:message key="labels.advance_search_timestamp_pastyear" /></option>
+					</select>
+				</div>
+				<div class="col-lg-4 d-none d-lg-flex align-items-center">
+					<!-- TODO -->
+				</div>
+			</div>
+			<div class="form-group row">
+				<label for="as_filetype" class="col-lg-3 col-md-4 col-sm-5 col-12 col-form-label"><la:message
+						key="labels.advance_search_filetype"
+					/></label>
+				<div class="col-lg-5 col-md-8 col-sm-7 col-xs-6">
+					<select id="as_filetype" name="as.filetype" class="form-control">
+						<option value=""><la:message key="labels.advance_search_filetype_default" /></option>
+						<option value="html" <c:if test="${as.filetype.contains('html')}">selected</c:if>><la:message
+								key="labels.advance_search_filetype_html"
+							/></option>
+						<option value="pdf" <c:if test="${as.filetype.contains('pdf')}">selected</c:if>><la:message
+								key="labels.advance_search_filetype_pdf"
+							/></option>
+						<option value="word" <c:if test="${as.filetype.contains('word')}">selected</c:if>><la:message
+								key="labels.advance_search_filetype_word"
+							/></option>
+						<option value="excel" <c:if test="${as.filetype.contains('excel')}">selected</c:if>><la:message
+								key="labels.advance_search_filetype_excel"
+							/></option>
+						<option value="powerpoint" <c:if test="${as.filetype.contains('powerpoint')}">selected</c:if>><la:message
+								key="labels.advance_search_filetype_powerpoint"
+							/></option>
+					</select>
+				</div>
+				<div class="col-lg-4 d-none d-lg-flex align-items-center">
+					<!-- TODO -->
+				</div>
+			</div>
+			<div class="form-group row">
+				<label for="as_occt" class="col-lg-3 col-md-4 col-sm-5 col-12 col-form-label"><la:message
+						key="labels.advance_search_occt"
+					/></label>
+				<div class="col-lg-5 col-md-8 col-sm-7 col-xs-6">
+					<select id="as_occt" name="as.occt" class="form-control">
+						<option value=""><la:message key="labels.advance_search_occt_default" /></option>
+						<option value="allintitle" <c:if test="${as.occt.contains('allintitle')}">selected</c:if>><la:message
+								key="labels.advance_search_occt_allintitle"
+							/></option>
+						<option value="allinurl" <c:if test="${as.occt.contains('allinurl')}">selected</c:if>><la:message
+								key="labels.advance_search_occt_allinurl"
+							/></option>
+					</select>
+				</div>
+				<div class="col-lg-4 d-none d-lg-flex align-items-center">
+					<!-- TODO -->
+				</div>
+			</div>
+			<div class="form-group row">
+				<label for="as_sitesearch" class="col-lg-3 col-md-4 col-sm-5 col-12 col-form-label"><la:message
+						key="labels.advance_search_sitesearch"
+					/></label>
+				<div class="col-lg-5 col-md-8 col-sm-7 col-xs-6">
+					<input class="form-control" type="text" id="as_sitesearch" name="as.sitesearch" value="${f:h(fe:join(as.sitesearch))}">
+				</div>
+				<div class="col-lg-4 d-none d-lg-flex align-items-center">
+					<!-- TODO -->
+				</div>
+			</div>
+
+			<div class="row">
+				<button type="submit" name="search" id="searchButton" class="btn btn-primary btn-lg mx-auto">
+					<i class="fa fa-search"></i>
+					<la:message key="labels.index_form_search_btn" />
+				</button>
 			</div>
-			<jsp:include page="footer.jsp" />
-		</div>
+		</main>
+		<jsp:include page="footer.jsp" />
 	</la:form>
 	<input type="hidden" id="contextPath" value="${contextPath}" />
 	<script type="text/javascript" src="${fe:url('/js/jquery-3.2.1.min.js')}"></script>
-	<script type="text/javascript" src="${fe:url('/js/bootstrap.js')}"></script>
+	<script type="text/javascript" src="${fe:url('/js/bootstrap.min.js')}"></script>
 	<script type="text/javascript" src="${fe:url('/js/suggestor.js')}"></script>
 	<script type="text/javascript" src="${fe:url('/js/advance.js')}"></script>
 </body>

+ 10 - 14
src/main/webapp/WEB-INF/orig/view/error/badRequest.jsp

@@ -7,7 +7,7 @@
 <meta name="viewport" content="width=device-width, initial-scale=1">
 <meta http-equiv="X-UA-Compatible" content="IE=edge">
 <title><la:message key="labels.system_error_title" /></title>
-<link href="${fe:url('/css/style-base.css')}" rel="stylesheet"
+<link href="${fe:url('/css/bootstrap.min.css')}" rel="stylesheet"
 	type="text/css" />
 <link href="${fe:url('/css/style.css')}" rel="stylesheet"
 	type="text/css" />
@@ -16,23 +16,19 @@
 </head>
 <body class="error">
 	<jsp:include page="../header.jsp" />
-	<div class="container">
-		<div class="content">
-			<div class="center row">
-				<div class="col-md-12">
-					<h2>
-						<la:message key="labels.request_error_title" />
-					</h2>
-					<div class="errormessage"><la:message key="labels.bad_request" /></div>
-				</div>
-			</div>
+	<main class="container">
+		<div class="text-center">
+			<h2>
+				<la:message key="labels.request_error_title" />
+			</h2>
+			<div class="errormessage"><la:message key="labels.bad_request" /></div>
 		</div>
-		<jsp:include page="../footer.jsp" />
-	</div>
+	</main>
+	<jsp:include page="../footer.jsp" />
 	<input type="hidden" id="contextPath" value="<%=request.getContextPath()%>" />
 	<script type="text/javascript"
 		src="${fe:url('/js/jquery-3.2.1.min.js')}"></script>
-	<script type="text/javascript" src="${fe:url('/js/bootstrap.js')}"></script>
+	<script type="text/javascript" src="${fe:url('/js/bootstrap.min.js')}"></script>
 	<script type="text/javascript" src="${fe:url('/js/suggestor.js')}"></script>
 	<script type="text/javascript" src="${fe:url('/js/search.js')}"></script>
 </body>

+ 14 - 18
src/main/webapp/WEB-INF/orig/view/error/error.jsp

@@ -6,7 +6,7 @@
 <meta name="viewport" content="width=device-width, initial-scale=1">
 <meta http-equiv="X-UA-Compatible" content="IE=edge">
 <title><la:message key="labels.system_error_title" /></title>
-<link href="${fe:url('/css/style-base.css')}" rel="stylesheet"
+<link href="${fe:url('/css/bootstrap.min.css')}" rel="stylesheet"
 	type="text/css" />
 <link href="${fe:url('/css/style.css')}" rel="stylesheet"
 	type="text/css" />
@@ -15,28 +15,24 @@
 </head>
 <body class="error">
 	<jsp:include page="../header.jsp" />
-	<div class="container">
-		<div class="content">
-			<div class="center row">
-				<div class="col-md-12">
-					<h2>
-						<la:message key="labels.error_title" />
-					</h2>
-					<div>
-						<la:info id="msg" message="true">
-							<div class="alert alert-info">${msg}</div>
-						</la:info>
-						<la:errors styleClass="list-unstyled"/>
-					</div>
-				</div>
+	<main class="container">
+		<div class="text-center">
+			<h2>
+				<la:message key="labels.error_title" />
+			</h2>
+			<div>
+				<la:info id="msg" message="true">
+					<div class="alert alert-info">${msg}</div>
+				</la:info>
+				<la:errors styleClass="list-unstyled"/>
 			</div>
 		</div>
-		<jsp:include page="../footer.jsp" />
-	</div>
+	</main>
+	<jsp:include page="../footer.jsp" />
 	<input type="hidden" id="contextPath" value="<%=request.getContextPath()%>" />
 	<script type="text/javascript"
 		src="${fe:url('/js/jquery-3.2.1.min.js')}"></script>
-	<script type="text/javascript" src="${fe:url('/js/bootstrap.js')}"></script>
+	<script type="text/javascript" src="${fe:url('/js/bootstrap.min.js')}"></script>
 	<script type="text/javascript" src="${fe:url('/js/suggestor.js')}"></script>
 	<script type="text/javascript" src="${fe:url('/js/search.js')}"></script>
 </body>

+ 12 - 16
src/main/webapp/WEB-INF/orig/view/error/notFound.jsp

@@ -6,7 +6,7 @@
 <meta name="viewport" content="width=device-width, initial-scale=1">
 <meta http-equiv="X-UA-Compatible" content="IE=edge">
 <title><la:message key="labels.system_error_title" /></title>
-<link href="${fe:url('/css/style-base.css')}" rel="stylesheet"
+<link href="${fe:url('/css/bootstrap.min.css')}" rel="stylesheet"
 	type="text/css" />
 <link href="${fe:url('/css/style.css')}" rel="stylesheet"
 	type="text/css" />
@@ -15,26 +15,22 @@
 </head>
 <body class="error">
 	<jsp:include page="../header.jsp" />
-	<div class="container">
-		<div class="content">
-			<div class="center row">
-				<div class="col-md-12">
-					<h2>
-						<la:message key="labels.page_not_found_title" />
-					</h2>
-					<div class="message">
-						<la:message key="labels.check_url" />
-						<br /> ${f:h(url)}
-					</div>
-				</div>
+	<main class="container">
+		<div class="text-center">
+			<h2>
+				<la:message key="labels.page_not_found_title" />
+			</h2>
+			<div>
+				<la:message key="labels.check_url" />
+				<br /> ${f:h(url)}
 			</div>
 		</div>
-		<jsp:include page="../footer.jsp" />
-	</div>
+	</main>
+	<jsp:include page="../footer.jsp" />
 	<input type="hidden" id="contextPath" value="<%=request.getContextPath()%>" />
 	<script type="text/javascript"
 		src="${fe:url('/js/jquery-3.2.1.min.js')}"></script>
-	<script type="text/javascript" src="${fe:url('/js/bootstrap.js')}"></script>
+	<script type="text/javascript" src="${fe:url('/js/bootstrap.min.js')}"></script>
 	<script type="text/javascript" src="${fe:url('/js/suggestor.js')}"></script>
 	<script type="text/javascript" src="${fe:url('/js/search.js')}"></script>
 </body>

+ 10 - 14
src/main/webapp/WEB-INF/orig/view/error/system.jsp

@@ -7,7 +7,7 @@
 <meta name="viewport" content="width=device-width, initial-scale=1">
 <meta http-equiv="X-UA-Compatible" content="IE=edge">
 <title><la:message key="labels.system_error_title" /></title>
-<link href="${fe:url('/css/style-base.css')}" rel="stylesheet"
+<link href="${fe:url('/css/bootstrap.min.css')}" rel="stylesheet"
 	type="text/css" />
 <link href="${fe:url('/css/style.css')}" rel="stylesheet"
 	type="text/css" />
@@ -16,23 +16,19 @@
 </head>
 <body class="error">
 	<jsp:include page="../header.jsp" />
-	<div class="container">
-		<div class="content">
-			<div class="center row">
-				<div class="col-md-12">
-					<h2>
-						<la:message key="labels.system_error_title" />
-					</h2>
-					<div class="errormessage"><la:message key="labels.contact_site_admin" /></div>
-				</div>
-			</div>
+	<main class="container">
+		<div class="text-center">
+			<h2>
+				<la:message key="labels.system_error_title" />
+			</h2>
+			<div class="errormessage"><la:message key="labels.contact_site_admin" /></div>
 		</div>
-		<jsp:include page="../footer.jsp" />
-	</div>
+	</main>
+	<jsp:include page="../footer.jsp" />
 	<input type="hidden" id="contextPath" value="<%=request.getContextPath()%>" />
 	<script type="text/javascript"
 		src="${fe:url('/js/jquery-3.2.1.min.js')}"></script>
-	<script type="text/javascript" src="${fe:url('/js/bootstrap.js')}"></script>
+	<script type="text/javascript" src="${fe:url('/js/bootstrap.min.js')}"></script>
 	<script type="text/javascript" src="${fe:url('/js/suggestor.js')}"></script>
 	<script type="text/javascript" src="${fe:url('/js/search.js')}"></script>
 </body>

+ 3 - 3
src/main/webapp/WEB-INF/orig/view/footer.jsp

@@ -1,7 +1,7 @@
 <%@page pageEncoding="UTF-8" contentType="text/html; charset=UTF-8"%>
-<footer class="bd-footer text-muted" role="contentinfo">
-	<div id="footer" class="container center">
-		<p>
+<footer role="contentinfo">
+	<div class="container text-center">
+		<p class="textmuted">
 			<la:message key="labels.footer.copyright" />
 		</p>
 	</div>

+ 74 - 69
src/main/webapp/WEB-INF/orig/view/header.jsp

@@ -2,80 +2,85 @@
 <la:form action="/search" method="get" styleId="searchForm"
 	role="search">
 	${fe:facetForm()}${fe:geoForm()}
-	<nav class="navbar navbar-dark bg-inverse navbar-fixed-top">
-		<la:link styleClass="navbar-brand" href="/">
-			<img src="${fe:url('/images/logo-head.png')}"
-				alt="<la:message key="labels.header_brand_name" />" />
-		</la:link>
-		<div
-			class="search-box navbar-form col-lg-5 col-md-6 col-sm-6 col-xs-8"
-			role="search">
-			<div class="input-group">
-				<la:text property="q" maxlength="1000" styleId="query"
-					styleClass="form-control" autocomplete="off" />
-				<span class="input-group-btn">
-					<button type="submit" name="search" id="searchButton"
-						class="btn btn-primary">
-						<i class="fa fa-search"></i>
-					</button>
-					<button type="button" class="btn btn-secondary"
-						data-toggle="control-options" data-target="#searchOptions"
-						id="searchOptionsButton">
-						<i class="fa fa-cog"></i> <span class="sr-only"><la:message
-								key="labels.header_form_option_btn" /></span>
-					</button>
-				</span>
-			</div>
-		</div>
-		<ul class="nav navbar-nav hidden-xs-down pull-right">
-			<c:choose>
-				<c:when test="${!empty username && username != 'guest'}">
-					<li class="nav-item">
-						<div class="dropdown">
-							<a class="nav-link dropdown-toggle" data-toggle="dropdown"
-								href="#" role="button" aria-haspopup="true"
-								aria-expanded="false"> <i class="fa fa-user"></i>
-								<span>${username}</span>
-							</a>
-							<div class="dropdown-menu" aria-labelledby="userMenu">
-								<c:if test="${editableUser == true}">
-									<la:link href="/profile" styleClass="dropdown-item">
-										<la:message key="labels.profile" />
-									</la:link>
-								</c:if>
-								<c:if test="${adminUser == true}">
-									<la:link href="/admin" styleClass="dropdown-item">
-										<la:message key="labels.administration" />
-									</la:link>
-								</c:if>
-								<la:link href="/logout/" styleClass="dropdown-item">
-									<la:message key="labels.logout" />
-								</la:link>
-							</div>
-						</div>
-					</li>
-				</c:when>
-				<c:when test="${ pageLoginLink }">
-					<li class="nav-item"><la:link href="/login"
-							styleClass="nav-link  " role="button" aria-haspopup="true"
+	<header>
+		<nav class="navbar navbar-expand-md navbar-dark fixed-top bg-dark">
+			<div id="content" class="container">
+				<la:link styleClass="navbar-brand d-inline-flex" href="/">
+					<img src="${fe:url('/images/logo-head.png')}"
+						alt="<la:message key="labels.header_brand_name" />"
+						class="align-items-center" />
+				</la:link>
+				<div
+					class="navbar-form col-md-6 col-sm-8 col-6 mr-auto p-0"
+					role="search">
+					<div class="input-group">
+						<la:text property="q" maxlength="1000" styleId="query"
+							styleClass="form-control" autocomplete="off" />
+						<span class="input-group-append">
+							<button type="submit" name="search" id="searchButton"
+								class="btn btn-primary">
+								<i class="fa fa-search"></i>
+							</button>
+							<button type="button" class="btn"
+								data-toggle="control-options" data-target="#searchOptions"
+								id="searchOptionsButton">
+								<i class="fa fa-cog"></i> <span class="sr-only"><la:message
+										key="labels.header_form_option_btn" /></span>
+							</button>
+						</span>
+					</div>
+				</div>
+				<ul class="nav navbar-nav d-none d-md-flex">
+					<c:choose>
+						<c:when test="${!empty username && username != 'guest'}">
+							<li class="nav-item">
+								<div class="dropdown">
+									<a class="nav-link dropdown-toggle" data-toggle="dropdown"
+										href="#" role="button" aria-haspopup="true"
+										aria-expanded="false"> <i class="fa fa-fw fa-user"></i>
+										<span>${username}</span>
+									</a>
+									<div class="dropdown-menu" aria-labelledby="userMenu">
+										<c:if test="${editableUser == true}">
+											<la:link href="/profile" styleClass="dropdown-item">
+												<la:message key="labels.profile" />
+											</la:link>
+										</c:if>
+										<c:if test="${adminUser == true}">
+											<la:link href="/admin" styleClass="dropdown-item">
+												<la:message key="labels.administration" />
+											</la:link>
+										</c:if>
+										<la:link href="/logout/" styleClass="dropdown-item">
+											<la:message key="labels.logout" />
+										</la:link>
+									</div>
+								</div>
+							</li>
+						</c:when>
+						<c:when test="${ pageLoginLink }">
+							<li class="nav-item"><la:link href="/login"
+									styleClass="nav-link  " role="button" aria-haspopup="true"
+									aria-expanded="false">
+									<i class="fa fa-fw fa-sign-in"></i>
+									<span><la:message key="labels.login" /></span>
+								</la:link></li>
+						</c:when>
+					</c:choose>
+					<li class="nav-item"><la:link href="/help" styleClass="nav-link" role="help" aria-haspopup="true"
 							aria-expanded="false">
-							<i class="fa fa-sign-in"></i>
-							<span><la:message key="labels.login" /></span>
+							<i class="fa fa-fw fa-question-circle"></i>
+							<span><la:message key="labels.index_help" /></span>
 						</la:link></li>
-				</c:when>
-			</c:choose>
-			<li class="nav-item"><la:link href="/help" styleClass="nav-link" role="help" aria-haspopup="true"
-					aria-expanded="false">
-					<i class="fa fa-question-circle"></i>
-					<span><la:message key="labels.index_help" /></span>
-				</la:link></li>
-		</ul>
-	</nav>
+				</ul>
+			</div>
+		</nav>
+	</header>
 	<div id="searchOptions" class="control-options">
 		<div class="container">
 			<jsp:include page="/WEB-INF/view/searchOptions.jsp" />
 			<div>
-				<button type="button" class="btn btn-secondary" id="searchOptionsClearButton">
+				<button type="button" class="btn" id="searchOptionsClearButton">
 					<la:message key="labels.search_options_clear" />
 				</button>
 				<button type="submit" class="btn btn-primary">
@@ -86,7 +91,7 @@
 					<i class="fa fa-cog"></i>
 					<la:message key="labels.advance" />
 				</la:link>
-				<button type="button" class="btn btn-secondary pull-right"
+				<button type="button" class="btn pull-right"
 					data-toggle="control-options" data-target="#searchOptions"
 					id="searchOptionsCloseButton">
 					<i class="fa fa-times-circle"></i>

+ 9 - 9
src/main/webapp/WEB-INF/orig/view/help.jsp

@@ -6,31 +6,31 @@
 <meta name="viewport" content="width=device-width, initial-scale=1">
 <meta http-equiv="X-UA-Compatible" content="IE=edge">
 <title><la:message key="labels.search_title" /></title>
-<link href="${fe:url('/css/style-base.css')}" rel="stylesheet"
+<link href="${fe:url('/css/bootstrap.min.css')}" rel="stylesheet"
 	type="text/css" />
 <link href="${fe:url('/css/style.css')}" rel="stylesheet" type="text/css" />
 <link href="${fe:url('/css/font-awesome.min.css')}"
 	rel="stylesheet" type="text/css" />
 </head>
-<body class="help">
+<body>
 	<jsp:include page="header.jsp" />
-	<div class="container">
+	<main class="container">
 		<div class="row">
-			<div class="col-md-12">
+			<div class="col">
 
 				<jsp:include page="${helpPage}" />
 
 			</div>
 		</div>
-		<p class="pull-right move-to-top">
+		<div class="text-right">
 			<a href="#"><la:message key="labels.footer_back_to_top" /></a>
-		</p>
-		<jsp:include page="footer.jsp" />
-	</div>
+		</div>
+	</main>
+	<jsp:include page="footer.jsp" />
 	<input type="hidden" id="contextPath" value="${contextPath}" />
 	<script type="text/javascript"
 		src="${fe:url('/js/jquery-3.2.1.min.js')}"></script>
-	<script type="text/javascript" src="${fe:url('/js/bootstrap.js')}"></script>
+	<script type="text/javascript" src="${fe:url('/js/bootstrap.min.js')}"></script>
 	<script type="text/javascript" src="${fe:url('/js/suggestor.js')}"></script>
 	<script type="text/javascript" src="${fe:url('/js/help.js')}"></script>
 </body>

+ 86 - 77
src/main/webapp/WEB-INF/orig/view/index.jsp

@@ -11,65 +11,94 @@
 		href="${fe:url('/osdd')}"
 		title="<la:message key="labels.index_osdd_title" />" />
 </c:if>
-<link href="${fe:url('/css/style-base.css')}" rel="stylesheet"
+<link href="${fe:url('/css/bootstrap.min.css')}" rel="stylesheet"
 	type="text/css" />
 <link href="${fe:url('/css/style.css')}" rel="stylesheet" type="text/css" />
 <link href="${fe:url('/css/font-awesome.min.css')}" rel="stylesheet"
 	type="text/css" />
 </head>
 <body>
-	<la:form styleClass="form-stacked" action="search" method="get"
-		styleId="searchForm">
+	<la:form action="search" method="get" styleId="searchForm">
 		${fe:facetForm()}${fe:geoForm()}
-		<nav class="navbar navbar-dark bg-inverse navbar-static-top pos-f-t">
-			<div id="content" class="container">
-				<ul class="nav navbar-nav pull-right">
-					<c:choose>
-						<c:when test="${!empty username && username != 'guest'}">
-							<li class="nav-item">
-								<div class="dropdown">
-									<a class="nav-link dropdown-toggle" data-toggle="dropdown"
-										href="#" role="button" aria-haspopup="true"
-										aria-expanded="false"> <i class="fa fa-user"></i>${username}
-									</a>
-									<div class="dropdown-menu" aria-labelledby="userMenu">
-										<c:if test="${editableUser == true}">
-											<la:link href="/profile" styleClass="dropdown-item">
-												<la:message key="labels.profile" />
-											</la:link>
-										</c:if>
-										<c:if test="${adminUser == true}">
-											<la:link href="/admin" styleClass="dropdown-item">
-												<la:message key="labels.administration" />
-											</la:link>
-										</c:if>
-										<la:link href="/logout/" styleClass="dropdown-item">
-											<la:message key="labels.logout" />
-										</la:link>
-									</div>
-								</div>
-							</li>
-						</c:when>
-						<c:when test="${ pageLoginLink }">
-							<li class="nav-item username"><la:link href="/login"
-									styleClass="nav-link" role="button" aria-haspopup="true"
-									aria-expanded="false">
-									<i class="fa fa-sign-in"></i>
-									<la:message key="labels.login" />
+		<header>
+			<nav class="navbar navbar-expand-md navbar-dark fixed-top bg-dark">
+				<div id="content" class="container">
+					<div class="navbar-brand"></div>
+					<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbar"
+							aria-controls="navbar" aria-expanded="false" aria-label="Toggle navigation">
+						<span class="navbar-toggler-icon"></span>
+					</button>
+					<div class="collapse navbar-collapse" id="navbar">
+						<div class="mr-auto"></div>
+						<ul class="nav navbar-nav">
+							<c:choose>
+								<c:when test="${!empty username && username != 'guest'}">
+									<li class="nav-item">
+										<div class="dropdown">
+											<a class="nav-link dropdown-toggle" data-toggle="dropdown"
+												href="#" role="button" aria-haspopup="true"
+												aria-expanded="false"> <i class="fa fa-fw fa-user"></i>${username}
+											</a>
+											<div class="dropdown-menu" aria-labelledby="userMenu">
+												<c:if test="${editableUser == true}">
+													<la:link href="/profile" styleClass="dropdown-item">
+														<la:message key="labels.profile" />
+													</la:link>
+												</c:if>
+												<c:if test="${adminUser == true}">
+													<la:link href="/admin" styleClass="dropdown-item">
+														<la:message key="labels.administration" />
+													</la:link>
+												</c:if>
+												<la:link href="/logout/" styleClass="dropdown-item">
+													<la:message key="labels.logout" />
+												</la:link>
+											</div>
+										</div>
+									</li>
+								</c:when>
+								<c:when test="${ pageLoginLink }">
+									<li class="nav-item"><la:link href="/login"
+											styleClass="nav-link" role="button" aria-haspopup="true"
+											aria-expanded="false">
+											<i class="fa fa-fw fa-sign-in"></i>
+											<la:message key="labels.login" />
+										</la:link></li>
+								</c:when>
+							</c:choose>
+							<li class="nav-item"><la:link href="/help"
+									styleClass="nav-link help-link">
+									<i class="fa fa-fw fa-question-circle"></i>
+									<la:message key="labels.index_help" />
 								</la:link></li>
-						</c:when>
-					</c:choose>
-					<li class="nav-item"><la:link href="/help"
-							styleClass="nav-link help-link">
-							<i class="fa fa-question-circle"></i>
-							<la:message key="labels.index_help" />
-						</la:link></li>
-				</ul>
+						</ul>
+					</div>
+				</div>
+			</nav>
+		</header>
+		<div id="searchOptions" class="control-options">
+			<div class="container">
+				<jsp:include page="searchOptions.jsp" />
+				<div>
+					<button type="button" class="btn" id="searchOptionsClearButton">
+						<la:message key="labels.search_options_clear" />
+					</button>
+					<la:link href="/search/advance" styleClass="btn btn-info">
+						<i class="fa fa-cog"></i>
+						<la:message key="labels.advance" />
+					</la:link>
+					<button type="button" class="btn pull-right"
+						data-toggle="control-options" data-target="#searchOptions"
+						id="searchOptionsCloseButton">
+						<i class="fa fa-times-circle"></i>
+						<la:message key="labels.search_options_close" />
+					</button>
+				</div>
 			</div>
-		</nav>
-		<div class="container">
-			<div class="row content">
-				<div class="center-block searchFormBox">
+		</div>
+		<main class="container">
+			<div class="row">
+				<div class="col text-center searchFormBox">
 					<h1 class="mainLogo">
 						<img src="${fe:url('/images/logo.png')}"
 							alt="<la:message key="labels.index_title" />" />
@@ -85,7 +114,7 @@
 					</div>
 					<fieldset>
 						<div class="clearfix">
-							<div class="centered col-lg-5 col-md-6 col-sm-6 col-xs-8">
+							<div class="mx-auto col-10 col-sm-8 col-md-8 col-lg-6">
 								<la:text styleClass="query form-control center-block"
 									property="q" size="50" maxlength="1000" styleId="contentQuery"
 									autocomplete="off" />
@@ -93,7 +122,7 @@
 						</div>
 						<c:if test="${!empty popularWords}">
 							<div class="clearfix">
-								<p class="popularWordBody ellipsis">
+								<p class="text-truncate">
 									<la:message key="labels.search_popular_word_word" />
 									<c:forEach var="item" varStatus="s" items="${popularWords}">
 										<c:if test="${s.index < 3}">
@@ -101,7 +130,7 @@
 												href="/search?q=${f:u(item)}${fe:facetQuery()}${fe:geoQuery()}">${f:h(item)}</la:link>
 										</c:if>
 										<c:if test="${3 <= s.index}">
-											<la:link styleClass="hidden-xs"
+											<la:link styleClass="d-none d-sm-inline"
 												href="/search?q=${f:u(item)}${fe:facetQuery()}${fe:geoQuery()}">${f:h(item)}</la:link>
 										</c:if>
 									</c:forEach>
@@ -114,7 +143,7 @@
 								<i class="fa fa-search"></i>
 								<la:message key="labels.index_form_search_btn" />
 							</button>
-							<button type="button" class="btn btn-secondary"
+							<button type="button" class="btn"
 								data-toggle="control-options" data-target="#searchOptions"
 								id="searchOptionsButton">
 								<i class="fa fa-cog"></i>
@@ -124,33 +153,13 @@
 					</fieldset>
 				</div>
 			</div>
-			<jsp:include page="footer.jsp" />
-		</div>
-		<div id="searchOptions" class="control-options">
-			<div class="container">
-				<jsp:include page="searchOptions.jsp" />
-				<div>
-					<button type="button" class="btn btn-secondary" id="searchOptionsClearButton">
-						<la:message key="labels.search_options_clear" />
-					</button>
-					<la:link href="/search/advance" styleClass="btn btn-info">
-						<i class="fa fa-cog"></i>
-						<la:message key="labels.advance" />
-					</la:link>
-					<button type="button" class="btn btn-secondary pull-right"
-						data-toggle="control-options" data-target="#searchOptions"
-						id="searchOptionsCloseButton">
-						<i class="fa fa-times-circle"></i>
-						<la:message key="labels.search_options_close" />
-					</button>
-				</div>
-			</div>
-		</div>
+		</main>
+		<jsp:include page="footer.jsp" />
 	</la:form>
 	<input type="hidden" id="contextPath" value="${contextPath}" />
 	<script type="text/javascript"
 		src="${fe:url('/js/jquery-3.2.1.min.js')}"></script>
-	<script type="text/javascript" src="${fe:url('/js/bootstrap.js')}"></script>
+	<script type="text/javascript" src="${fe:url('/js/bootstrap.min.js')}"></script>
 	<script type="text/javascript" src="${fe:url('/js/suggestor.js')}"></script>
 	<script type="text/javascript" src="${fe:url('/js/index.js')}"></script>
 </body>

+ 14 - 28
src/main/webapp/WEB-INF/orig/view/login/index.jsp

@@ -6,17 +6,11 @@
 <meta name="viewport" content="width=device-width, initial-scale=1">
 <meta http-equiv="X-UA-Compatible" content="IE=edge">
 <title><la:message key="labels.login.title" /></title>
-<link href="${fe:url('/css/style-base.css')}" rel="stylesheet"
-	type="text/css" />
-<link href="${fe:url('/css/style.css')}" rel="stylesheet" type="text/css" />
-<link href="${fe:url('/css/admin/style.css')}" rel="stylesheet"
-	type="text/css" />
-<link href="${fe:url('/css/admin/font-awesome.min.css')}"
-	rel="stylesheet" type="text/css" />
-<link href="${fe:url('/css/admin/adminlte.min.css')}" rel="stylesheet"
-	type="text/css" />
-<link href="${fe:url('/css/admin/skins/skin-blue.min.css')}"
-	rel="stylesheet" type="text/css" />
+<link href="${fe:url('/css/admin/bootstrap.min.css')}" rel="stylesheet" type="text/css" />
+<link href="${fe:url('/css/admin/font-awesome.min.css')}" rel="stylesheet" type="text/css" />
+<link href="${fe:url('/css/admin/adminlte.min.css')}" rel="stylesheet" type="text/css" />
+<link href="${fe:url('/css/admin/skins/skin-blue.min.css')}" rel="stylesheet" type="text/css" />
+<link href="${fe:url('/css/admin/style.css')}" rel="stylesheet" type="text/css" />
 <!--[if lt IE 9]>
 <script src="${fe:url('/css/admin/html5shiv.min.js')}"></script>
 <script src="${fe:url('/css/admin/respond.min.js')}"></script>
@@ -64,31 +58,23 @@
 							placeholder="${ph_password}" />
 					</div>
 				</div>
-				<div class="row">
-					<div class="col-xs-3"></div>
-					<!-- /.col -->
-					<div class="col-xs-6">
-						<button type="submit" name="login"
-							class="btn btn-primary btn-block btn-flat"
-							value="<la:message key="labels.login"/>">
-							<i class="fa fa-sign-in"></i>
-							<la:message key="labels.login" />
-						</button>
-					</div>
-					<!-- /.col -->
-					<div class="col-xs-3"></div>
-					<!-- /.col -->
+				<div class="text-center">
+					<button type="submit" name="login"
+						class="btn btn-primary btn-block btn-flat"
+						value="<la:message key="labels.login"/>">
+						<i class="fa fa-sign-in"></i>
+						<la:message key="labels.login" />
+					</button>
 				</div>
 			</la:form>
 		</div>
 		<!-- /.login-box-body -->
 	</div>
 	<!-- /.login-box -->
-	<jsp:include page="../footer.jsp" />
 	<input type="hidden" id="contextPath" value="${contextPath}" />
 	<script type="text/javascript"
-		src="${fe:url('/js/jquery-3.2.1.min.js')}"></script>
-	<script type="text/javascript" src="${fe:url('/js/bootstrap.js')}"></script>
+		src="${fe:url('/js/admin/jquery-3.2.1.min.js')}"></script>
+	<script type="text/javascript" src="${fe:url('/js/admin/bootstrap.min.js')}"></script>
 	<script type="text/javascript" src="${fe:url('/js/login.js')}"></script>
 </body>
 </html>

+ 19 - 33
src/main/webapp/WEB-INF/orig/view/profile/index.jsp

@@ -6,17 +6,11 @@
 <meta name="viewport" content="width=device-width, initial-scale=1">
 <meta http-equiv="X-UA-Compatible" content="IE=edge">
 <title><la:message key="labels.profile.title" /></title>
-<link href="${fe:url('/css/style-base.css')}" rel="stylesheet"
-	type="text/css" />
-<link href="${fe:url('/css/style.css')}" rel="stylesheet" type="text/css" />
-<link href="${fe:url('/css/admin/style.css')}" rel="stylesheet"
-	type="text/css" />
-<link href="${fe:url('/css/admin/font-awesome.min.css')}"
-	rel="stylesheet" type="text/css" />
-<link href="${fe:url('/css/admin/adminlte.min.css')}" rel="stylesheet"
-	type="text/css" />
-<link href="${fe:url('/css/admin/skins/skin-blue.min.css')}"
-	rel="stylesheet" type="text/css" />
+<link href="${fe:url('/css/admin/bootstrap.min.css')}" rel="stylesheet" type="text/css" />
+<link href="${fe:url('/css/admin/font-awesome.min.css')}" rel="stylesheet" type="text/css" />
+<link href="${fe:url('/css/admin/adminlte.min.css')}" rel="stylesheet" type="text/css" />
+<link href="${fe:url('/css/admin/skins/skin-blue.min.css')}" rel="stylesheet" type="text/css" />
+<link href="${fe:url('/css/admin/style.css')}" rel="stylesheet" type="text/css" />
 <!--[if lt IE 9]>
 <script src="${fe:url('/css/admin/html5shiv.min.js')}"></script>
 <script src="${fe:url('/css/admin/respond.min.js')}"></script>
@@ -73,36 +67,28 @@
 							     placeholder="${ph_confirm_password}" />
 					</div>
 				</div>
-				<div class="row">
-					<div class="col-xs-2"></div>
-					<!-- /.col -->
-					<div class="col-xs-8">
-						<la:link href="/"
-							styleClass="btn btn-default">
-							<i class="fa fa-arrow-circle-left"></i>
-							<la:message key="labels.profile.back" />
-						</la:link>
-						<button type="submit" name="changePassword"
-							class="btn btn-warning"
-							value="<la:message key="labels.profile.update"/>">
-							<i class="fa fa-pencil"></i>
-							<la:message key="labels.profile.update" />
-						</button>
-					</div>
-					<!-- /.col -->
-					<div class="col-xs-2"></div>
-					<!-- /.col -->
+				<div class="text-center">
+					<la:link href="/"
+						styleClass="btn btn-default">
+						<i class="fa fa-arrow-circle-left"></i>
+						<la:message key="labels.profile.back" />
+					</la:link>
+					<button type="submit" name="changePassword"
+						class="btn btn-warning"
+						value="<la:message key="labels.profile.update"/>">
+						<i class="fa fa-pencil"></i>
+						<la:message key="labels.profile.update" />
+					</button>
 				</div>
 			</la:form>
 		</div>
 		<!-- /.login-box-body -->
 	</div>
 	<!-- /.login-box -->
-	<jsp:include page="../footer.jsp" />
 	<input type="hidden" id="contextPath" value="${contextPath}" />
 	<script type="text/javascript"
-		src="${fe:url('/js/jquery-3.2.1.min.js')}"></script>
-	<script type="text/javascript" src="${fe:url('/js/bootstrap.js')}"></script>
+		src="${fe:url('/js/admin/jquery-3.2.1.min.js')}"></script>
+	<script type="text/javascript" src="${fe:url('/js/admin/bootstrap.min.js')}"></script>
 	<script type="text/javascript" src="${fe:url('/js/profile.js')}"></script>
 </body>
 </html>

+ 81 - 85
src/main/webapp/WEB-INF/orig/view/search.jsp

@@ -12,7 +12,7 @@
 		href="${fe:url('/osdd')}"
 		title="<la:message key="labels.index_osdd_title" />" />
 </c:if>
-<link href="${fe:url('/css/style-base.css')}" rel="stylesheet"
+<link href="${fe:url('/css/bootstrap.min.css')}" rel="stylesheet"
 	type="text/css" />
 <link href="${fe:url('/css/style.css')}" rel="stylesheet" type="text/css" />
 <link href="${fe:url('/css/font-awesome.min.css')}" rel="stylesheet"
@@ -20,83 +20,79 @@
 </head>
 <body class="search">
 	<jsp:include page="header.jsp" />
-	<div id="content" class="container">
-		<div class="row">
-			<div class="col-md-12">
-				<ul class="searchOptionLabels">
-					<li><la:message key="labels.searchoptions_menu_sort" /> <a
-						href="#searchOptions" class="label label-primary"
-						data-toggle="control-options"> <c:if test="${empty sort}">
-								<la:message key="labels.searchoptions_score" />
-							</c:if> <c:if test="${sort=='score.desc'}">
-								<la:message key="labels.searchoptions_score" />
-							</c:if> <c:if test="${sort=='filename.asc'}">
-								<la:message key="labels.search_result_sort_filename_asc" />
-							</c:if> <c:if test="${sort=='filename.desc'}">
-								<la:message key="labels.search_result_sort_filename_desc" />
-							</c:if> <c:if test="${sort=='created.asc'}">
-								<la:message key="labels.search_result_sort_created_asc" />
-							</c:if> <c:if test="${sort=='created.desc'}">
-								<la:message key="labels.search_result_sort_created_desc" />
-							</c:if> <c:if test="${sort=='content_length.asc'}">
-								<la:message key="labels.search_result_sort_content_length_asc" />
-							</c:if> <c:if test="${sort=='content_length.desc'}">
-								<la:message key="labels.search_result_sort_content_length_desc" />
-							</c:if> <c:if test="${sort=='last_modified.asc'}">
-								<la:message key="labels.search_result_sort_last_modified_asc" />
-							</c:if> <c:if test="${sort=='last_modified.desc'}">
-								<la:message key="labels.search_result_sort_last_modified_desc" />
-							</c:if> <c:if test="${sort=='click_count.asc'}">
-								<la:message key="labels.search_result_sort_click_count_asc" />
-							</c:if> <c:if test="${sort=='click_count.desc'}">
-								<la:message key="labels.search_result_sort_click_count_desc" />
-							</c:if> <c:if test="${sort=='favorite_count.asc'}">
-								<la:message key="labels.search_result_sort_favorite_count_asc" />
-							</c:if> <c:if test="${sort=='favorite_count.desc'}">
-								<la:message key="labels.search_result_sort_favorite_count_desc" />
-							</c:if> <c:if test="${sort.indexOf(',') >= 0}">
-								<la:message key="labels.search_result_sort_multiple" />
-							</c:if>
-					</a></li>
-					<li><la:message key="labels.searchoptions_menu_num" /> <a
-						href="#searchOptions" class="label label-primary"
-						data-toggle="control-options"> <la:message
-								key="labels.searchoptions_num" arg0="${f:h(num)}" />
-					</a></li>
-					<li><la:message key="labels.searchoptions_menu_lang" /> <a
-						href="#searchOptions" class="label label-primary"
-						data-toggle="control-options"> <c:if test="${empty lang}">
-								<la:message key="labels.searchoptions_all" />
-							</c:if> <c:if test="${!empty lang}">
-								<c:forEach var="sLang" items="${lang}">
-									<c:forEach var="item" items="${langItems}">
-										<c:if test="${item.value==sLang}">${f:h(item.label)}</c:if>
-									</c:forEach>
-								</c:forEach>
-							</c:if>
-					</a></li>
-					<c:if test="${displayLabelTypeItems}">
-						<li><la:message key="labels.searchoptions_menu_labels" /> <a
-							href="#searchOptions" class="label label-primary"
-							data-toggle="control-options"> <c:if
-									test="${empty fields.label}">
-									<la:message key="labels.searchoptions_all" />
-								</c:if> <c:if test="${!empty fields.label}">
-									<c:forEach var="sLabel" items="${fields.label}">
-										<c:forEach var="item" items="${labelTypeItems}">
-											<c:if test="${item.value==sLabel}">${f:h(item.label)}</c:if>
-										</c:forEach>
-									</c:forEach>
-								</c:if>
-						</a></li>
+	<main id="content" class="container">
+		<ul class="list-inline">
+			<li class="list-inline-item"><la:message key="labels.searchoptions_menu_sort" /> <a
+				href="#searchOptions" class="badge badge-primary"
+				data-toggle="control-options"> <c:if test="${empty sort}">
+						<la:message key="labels.searchoptions_score" />
+					</c:if> <c:if test="${sort=='score.desc'}">
+						<la:message key="labels.searchoptions_score" />
+					</c:if> <c:if test="${sort=='filename.asc'}">
+						<la:message key="labels.search_result_sort_filename_asc" />
+					</c:if> <c:if test="${sort=='filename.desc'}">
+						<la:message key="labels.search_result_sort_filename_desc" />
+					</c:if> <c:if test="${sort=='created.asc'}">
+						<la:message key="labels.search_result_sort_created_asc" />
+					</c:if> <c:if test="${sort=='created.desc'}">
+						<la:message key="labels.search_result_sort_created_desc" />
+					</c:if> <c:if test="${sort=='content_length.asc'}">
+						<la:message key="labels.search_result_sort_content_length_asc" />
+					</c:if> <c:if test="${sort=='content_length.desc'}">
+						<la:message key="labels.search_result_sort_content_length_desc" />
+					</c:if> <c:if test="${sort=='last_modified.asc'}">
+						<la:message key="labels.search_result_sort_last_modified_asc" />
+					</c:if> <c:if test="${sort=='last_modified.desc'}">
+						<la:message key="labels.search_result_sort_last_modified_desc" />
+					</c:if> <c:if test="${sort=='click_count.asc'}">
+						<la:message key="labels.search_result_sort_click_count_asc" />
+					</c:if> <c:if test="${sort=='click_count.desc'}">
+						<la:message key="labels.search_result_sort_click_count_desc" />
+					</c:if> <c:if test="${sort=='favorite_count.asc'}">
+						<la:message key="labels.search_result_sort_favorite_count_asc" />
+					</c:if> <c:if test="${sort=='favorite_count.desc'}">
+						<la:message key="labels.search_result_sort_favorite_count_desc" />
+					</c:if> <c:if test="${sort.indexOf(',') >= 0}">
+						<la:message key="labels.search_result_sort_multiple" />
 					</c:if>
-				</ul>
-			</div>
-		</div>
+			</a></li>
+			<li class="list-inline-item"><la:message key="labels.searchoptions_menu_num" /> <a
+				href="#searchOptions" class="badge badge-primary"
+				data-toggle="control-options"> <la:message
+						key="labels.searchoptions_num" arg0="${f:h(num)}" />
+			</a></li>
+			<li class="list-inline-item"><la:message key="labels.searchoptions_menu_lang" /> <a
+				href="#searchOptions" class="badge badge-primary"
+				data-toggle="control-options"> <c:if test="${empty lang}">
+						<la:message key="labels.searchoptions_all" />
+					</c:if> <c:if test="${!empty lang}">
+						<c:forEach var="sLang" items="${lang}">
+							<c:forEach var="item" items="${langItems}">
+								<c:if test="${item.value==sLang}">${f:h(item.label)}</c:if>
+							</c:forEach>
+						</c:forEach>
+					</c:if>
+			</a></li>
+			<c:if test="${displayLabelTypeItems}">
+				<li class="list-inline-item"><la:message key="labels.searchoptions_menu_labels" /> <a
+					href="#searchOptions" class="badge badge-primary"
+					data-toggle="control-options"> <c:if
+							test="${empty fields.label}">
+							<la:message key="labels.searchoptions_all" />
+						</c:if> <c:if test="${!empty fields.label}">
+							<c:forEach var="sLabel" items="${fields.label}">
+								<c:forEach var="item" items="${labelTypeItems}">
+									<c:if test="${item.value==sLabel}">${f:h(item.label)}</c:if>
+								</c:forEach>
+							</c:forEach>
+						</c:if>
+				</a></li>
+			</c:if>
+		</ul>
 		<c:if test="${!empty popularWords}">
 			<div class="row">
-				<div class="col-md-12">
-					<p class="popularWordBody ellipsis">
+				<div class="col">
+					<p class="text-truncate">
 						<la:message key="labels.search_popular_word_word" />
 						<c:forEach var="item" varStatus="s" items="${popularWords}">
 							<c:if test="${s.index < 3}">
@@ -104,7 +100,7 @@
 									href="/search?q=${f:u(item)}${fe:facetQuery()}${fe:geoQuery()}">${f:h(item)}</la:link>
 							</c:if>
 							<c:if test="${3 <= s.index}">
-								<la:link styleClass="hidden-xs"
+								<la:link styleClass="d-none d-sm-inline"
 									href="/search?q=${f:u(item)}${fe:facetQuery()}${fe:geoQuery()}">${f:h(item)}</la:link>
 							</c:if>
 						</c:forEach>
@@ -114,8 +110,8 @@
 		</c:if>
 		<c:if test="${!empty relatedQueries}">
 			<div class="row">
-				<div class="col-md-12">
-					<p class="popularWordBody ellipsis">
+				<div class="col">
+					<p class="text-truncate">
 						<la:message key="labels.search_related_queries" />
 						<c:forEach var="item" varStatus="s" items="${relatedQueries}">
 							<c:if test="${s.index < 3}">
@@ -123,7 +119,7 @@
 									href="/search?q=${f:u(item)}${fe:facetQuery()}${fe:geoQuery()}">${f:h(item)}</la:link>
 							</c:if>
 							<c:if test="${3 <= s.index}">
-								<la:link styleClass="hidden-xs"
+								<la:link styleClass="d-none d-sm-inline"
 									href="/search?q=${f:u(item)}${fe:facetQuery()}${fe:geoQuery()}">${f:h(item)}</la:link>
 							</c:if>
 						</c:forEach>
@@ -133,7 +129,7 @@
 		</c:if>
 		<c:forEach var="item" varStatus="s" items="${relatedContents}">
 			<div class="row">
-				<div class="col-md-12">
+				<div class="col">
 					${item}
 				</div>
 			</div>
@@ -141,20 +137,20 @@
 		<c:choose>
 			<c:when test="${f:h(allRecordCount) != 0}">
 				<jsp:include page="searchResults.jsp" />
-				<p class="pull-right move-to-top">
+				<div class="text-right">
 					<a href="#"><la:message key="labels.footer_back_to_top" /></a>
-				</p>
+				</div>
 			</c:when>
 			<c:otherwise>
 				<jsp:include page="searchNoResult.jsp" />
 			</c:otherwise>
 		</c:choose>
-		<jsp:include page="footer.jsp" />
-	</div>
+	</main>
+	<jsp:include page="footer.jsp" />
 	<input type="hidden" id="contextPath" value="${contextPath}" />
 	<script type="text/javascript"
 		src="${fe:url('/js/jquery-3.2.1.min.js')}"></script>
-	<script type="text/javascript" src="${fe:url('/js/bootstrap.js')}"></script>
+	<script type="text/javascript" src="${fe:url('/js/bootstrap.min.js')}"></script>
 	<script type="text/javascript" src="${fe:url('/js/suggestor.js')}"></script>
 	<script type="text/javascript" src="${fe:url('/js/search.js')}"></script>
 </body>

+ 116 - 123
src/main/webapp/WEB-INF/orig/view/searchResults.jsp

@@ -1,7 +1,7 @@
 <%@page pageEncoding="UTF-8" contentType="text/html; charset=UTF-8"%>
 <%-- query matched some document --%>
 <div id="subheader" class="row">
-	<div class="col-md-12">
+	<div class="col">
 		<p>
 			<la:message key="labels.search_result_status"
 				arg0="${f:h(displayQuery)}" arg1="${f:h(allRecordCount)}"
@@ -25,119 +25,109 @@
 		</p>
 	</div>
 </c:if>
-<div id="result" class="row content">
+<div id="result" class="row">
 	<input type="hidden" id="queryId" value="${f:u(queryId)}" /> <input
 		type="hidden" id="rt" value="${f:u(requestedTime)}" />
-	<div class="col-md-8">
-		<ol>
-			<c:forEach var="doc" varStatus="s" items="${documentItems}">
-				<li id="result${s.index}">
-					<div class="media">
-						<div>
-							<h3 class="title ellipsis media-heading">
-								<a class="link" href="${doc.url_link}" data-uri="${doc.url_link}"
-									data-id="${doc.doc_id}" data-order="${s.index}">${doc.content_title}</a>
-							</h3>
-							<div class="body">
-								<div>
-									<c:if test="${thumbnailSupport && !empty doc.thumbnail}">
-										<div class="thumbnailBox media-left hidden-xs-down">
-											<a class="link" href="${doc.url_link}" data-uri="${doc.url_link}" data-id="${doc.doc_id}"
-												data-order="${s.index}"
-											> <img src="${fe:url('/images/blank.png')}"
-												data-src="${fe:url('/thumbnail/')}?docId=${f:u(doc.doc_id)}&queryId=${f:u(queryId)}" class="thumbnail"
-											>
-											</a>
-										</div>
-									</c:if>
-									<div class="media-body description">${doc.content_description}</div>
-								</div>
-								<div class="site ellipsis">
-									<cite>${f:h(doc.site_path)}</cite>
-									<c:if test="${doc.has_cache=='true'}">
-										<small class="hidden-md-down"> <la:link
-												href="/cache/?docId=${doc.doc_id}${appendHighlightParams}"
-												class="cache">
-												<la:message key="labels.search_result_cache" />
-											</la:link>
-										</small>
-									</c:if>
-									<c:if test="${doc.similar_docs_count!=null&&doc.similar_docs_count>1}">
-										<small class="hidden-md-down"> <la:link
-												href="/search?q=${f:u(q)}&ex_q=${f:u(queryEntry.value)}&sdh=${f:u(fe:sdh(doc.similar_docs_hash))}${fe:facetQuery()}${fe:geoQuery()}">
-												<la:message key="labels.search_result_similar"
-															arg0="${fe:formatNumber(doc.similar_docs_count-1)}" />
-											</la:link>
-										</small>
-									</c:if>
-								</div>
-								<div class="more hidden-md-up">
-									<a href="#result${s.index}"><la:message
-											key="labels.search_result_more" /></a>
-								</div>
-								<div class="info">
-									<small> <c:if
-											test="${doc.created!=null && doc.created!=''}">
-											<c:set var="hasInfo" value="true" />
-											<la:message key="labels.search_result_created" />
-											<fmt:formatDate value="${fe:parseDate(doc.created)}"
-												type="BOTH" pattern="yyyy-MM-dd HH:mm" />
-										</c:if> <c:if
-											test="${doc.last_modified!=null && doc.last_modified!=''}">
-											<c:if test="${hasInfo}">
-												<span class="br-xs"></span>
-												<span class="hidden-xs">-</span>
-											</c:if>
-											<c:set var="hasInfo" value="true" />
-											<la:message key="labels.search_result_last_modified" />
-											<fmt:formatDate value="${fe:parseDate(doc.last_modified)}"
-												type="BOTH" pattern="yyyy-MM-dd HH:mm" />
-										</c:if> <c:if
-											test="${doc.content_length!=null && doc.content_length!=''}">
-											<c:if test="${hasInfo}">
-												<span class="br-xs"></span>
-												<span class="hidden-xs">-</span>
-											</c:if>
-											<c:set var="hasInfo" value="true" />
-											<la:message key="labels.search_result_size"
-												arg0="${fe:formatNumber(doc.content_length)}" />
-										</c:if> <c:if test="${searchLogSupport}">
-											<c:if test="${hasInfo}">
-												<span class="br-xs"></span>
-												<span class="hidden-xs">-</span>
-											</c:if>
-											<c:set var="hasInfo" value="true" />
-											<la:message key="labels.search_click_count"
-												arg0="${f:h(doc.click_count)}" />
-										</c:if> <c:if test="${favoriteSupport}">
-											<c:if test="${hasInfo}">
-												<span class="br-xs"></span>
-												<span class="hidden-xs">-</span>
-											</c:if>
-											<c:set var="hasInfo" value="true" />
-											<a href="#${doc.doc_id}" class="favorite"><la:message
-													key="labels.search_result_favorite" />
-												(${f:h(doc.favorite_count)})</a>
-											<span class="favorited"><la:message
-													key="labels.search_result_favorited" /> <span
-												class="favorited-count">(${f:h(doc.favorite_count)})</span></span>
-										</c:if>
-									</small>
-								</div>
-							</div>
-						</div>
-					</div>
-				</li>
-			</c:forEach>
-		</ol>
-	</div>
-	<aside class="col-md-4 hidden-sm-down">
+	<ol class="list-unstyled col-md-8">
+		<c:forEach var="doc" varStatus="s" items="${documentItems}">
+			<li id="result${s.index}">
+				<h3 class="title text-truncate">
+					<a class="link" href="${doc.url_link}" data-uri="${doc.url_link}"
+						data-id="${doc.doc_id}" data-order="${s.index}">${doc.content_title}</a>
+				</h3>
+				<div class="body">
+					<c:if test="${thumbnailSupport && !empty doc.thumbnail}">
+						<a class="link mr-3 d-none d-sm-flex" href="${doc.url_link}" data-uri="${doc.url_link}" data-id="${doc.doc_id}"
+							data-order="${s.index}"
+						> <img src="${fe:url('/images/blank.png')}"
+							data-src="${fe:url('/thumbnail/')}?docId=${f:u(doc.doc_id)}&queryId=${f:u(queryId)}" class="thumbnail"
+						>
+						</a>
+					</c:if>
+					<div class="description">${doc.content_description}</div>
+				</div>
+				<div class="site text-truncate">
+					<cite>${f:h(doc.site_path)}</cite>
+					<c:if test="${doc.has_cache=='true'}">
+						<small class="d-none d-lg-inline-block"> <la:link
+								href="/cache/?docId=${doc.doc_id}${appendHighlightParams}"
+								class="cache">
+								<la:message key="labels.search_result_cache" />
+							</la:link>
+						</small>
+					</c:if>
+					<c:if test="${doc.similar_docs_count!=null&&doc.similar_docs_count>1}">
+						<small class="d-none d-lg-inline-block"> <la:link
+								href="/search?q=${f:u(q)}&ex_q=${f:u(queryEntry.value)}&sdh=${f:u(fe:sdh(doc.similar_docs_hash))}${fe:facetQuery()}${fe:geoQuery()}">
+								<la:message key="labels.search_result_similar"
+											arg0="${fe:formatNumber(doc.similar_docs_count-1)}" />
+							</la:link>
+						</small>
+					</c:if>
+				</div>
+				<div class="more">
+					<a href="#result${s.index}"><la:message
+							key="labels.search_result_more" /></a>
+				</div>
+				<div class="info">
+					<small> <c:if
+							test="${doc.created!=null && doc.created!=''}">
+							<c:set var="hasInfo" value="true" />
+							<la:message key="labels.search_result_created" />
+							<fmt:formatDate value="${fe:parseDate(doc.created)}"
+								type="BOTH" pattern="yyyy-MM-dd HH:mm" />
+						</c:if> <c:if
+							test="${doc.last_modified!=null && doc.last_modified!=''}">
+							<c:if test="${hasInfo}">
+								<div class="d-sm-none"></div>
+								<span class="d-none d-sm-inline">-</span>
+							</c:if>
+							<c:set var="hasInfo" value="true" />
+							<la:message key="labels.search_result_last_modified" />
+							<fmt:formatDate value="${fe:parseDate(doc.last_modified)}"
+								type="BOTH" pattern="yyyy-MM-dd HH:mm" />
+						</c:if> <c:if
+							test="${doc.content_length!=null && doc.content_length!=''}">
+							<c:if test="${hasInfo}">
+								<div class="d-sm-none"></div>
+								<span class="d-none d-sm-inline">-</span>
+							</c:if>
+							<c:set var="hasInfo" value="true" />
+							<la:message key="labels.search_result_size"
+								arg0="${fe:formatNumber(doc.content_length)}" />
+						</c:if> <c:if test="${searchLogSupport}">
+							<c:if test="${hasInfo}">
+								<div class="d-sm-none"></div>
+								<span class="d-none d-sm-inline">-</span>
+							</c:if>
+							<c:set var="hasInfo" value="true" />
+							<la:message key="labels.search_click_count"
+								arg0="${f:h(doc.click_count)}" />
+						</c:if> <c:if test="${favoriteSupport}">
+							<c:if test="${hasInfo}">
+								<div class="d-sm-none"></div>
+								<span class="d-none d-sm-inline">-</span>
+							</c:if>
+							<c:set var="hasInfo" value="true" />
+							<a href="#${doc.doc_id}" class="favorite"><la:message
+									key="labels.search_result_favorite" />
+								(${f:h(doc.favorite_count)})</a>
+							<span class="favorited"><la:message
+									key="labels.search_result_favorited" /> <span
+								class="favorited-count">(${f:h(doc.favorite_count)})</span></span>
+						</c:if>
+					</small>
+				</div>
+			</li>
+		</c:forEach>
+	</ol>
+	<aside class="col-md-4 d-none d-md-block">
 		<%-- Side Content --%>
 		<c:if test="${facetResponse != null}">
 			<c:forEach var="fieldData" items="${facetResponse.fieldList}">
 				<c:if
 					test="${fieldData.name == 'label' && fieldData.valueCountMap.size() > 0}">
-					<ul class="list-group m-b">
+					<ul class="list-group mb-2">
 						<li class="list-group-item text-uppercase"><la:message
 								key="labels.facet_label_title" /></li>
 						<c:forEach var="countEntry" items="${fieldData.valueCountMap}">
@@ -146,7 +136,7 @@
 								<li class="list-group-item"><la:link
 										href="/search?q=${f:u(q)}&ex_q=label%3a${f:u(countEntry.key)}&sdh=${f:u(fe:sdh(sh))}${fe:pagingQuery(null)}${fe:facetQuery()}${fe:geoQuery()}">
 											${f:h(fe:label(countEntry.key))} 
-											<span class="label label-default label-pill pull-right">${f:h(countEntry.value)}</span>
+											<span class="badge badge-secondary badge-pill float-right">${f:h(countEntry.value)}</span>
 									</la:link></li>
 							</c:if>
 						</c:forEach>
@@ -154,29 +144,29 @@
 				</c:if>
 			</c:forEach>
 			<c:forEach var="facetQueryView" items="${fe:facetQueryViewList()}">
-				<ul class="list-group m-b">
+				<ul class="list-group mb-2">
 					<li class="list-group-item text-uppercase"><la:message
 							key="${facetQueryView.title}" /></li>
 					<c:set var="facetFound" value="F"/>
 					<c:forEach var="queryEntry" items="${facetQueryView.queryMap}">
 						<c:if test="${facetResponse.queryCountMap[queryEntry.value] != 0}">
-							<li class="list-group-item p-l-md"><la:link
+							<li class="list-group-item"><la:link
 									href="/search?q=${f:u(q)}&ex_q=${f:u(queryEntry.value)}&sdh=${f:u(fe:sdh(sdh))}${fe:pagingQuery(queryEntry.value)}${fe:facetQuery()}${fe:geoQuery()}">
 									<la:message key="${queryEntry.key}" />
-									<span class="label label-default label-pill pull-right">${f:h(facetResponse.queryCountMap[queryEntry.value])}</span>
+									<span class="badge badge-secondary badge-pill float-right">${f:h(facetResponse.queryCountMap[queryEntry.value])}</span>
 								</la:link></li>
 							<c:set var="facetFound" value="T"/>
 						</c:if>
 					</c:forEach>
 					<c:if test="${facetFound == 'F'}">
-						<li class="list-group-item p-l-md"><la:message key="labels.facet_is_not_found" /></li>
+						<li class="list-group-item"><la:message key="labels.facet_is_not_found" /></li>
 					</c:if>
 				</ul>
 			</c:forEach>
 			<c:if test="${!empty ex_q}">
-				<div class="pull-right">
+				<div class="float-right">
 					<la:link href="/search?q=${f:u(q)}"
-						styleClass="btn btn-secondary btn-sm">
+						styleClass="btn btn-link btn-sm">
 						<la:message key="labels.facet_label_reset" />
 					</la:link>
 				</div>
@@ -184,39 +174,42 @@
 		</c:if>
 	</aside>
 </div>
-<div class="row center">
-	<nav id="subfooter">
+<div class="row">
+	<nav id="subfooter" class="mx-auto">
 		<ul class="pagination">
 			<c:if test="${existPrevPage}">
-				<li class="prev"><la:link aria-label="Previous"
+				<li class="page-item"><la:link class="page-link" aria-label="Previous"
 						href="/search/prev?q=${f:u(q)}&pn=${f:u(currentPageNumber)}&num=${f:u(pageSize)}&sdh=${f:u(fe:sdh(sdh))}${fe:pagingQuery(null)}${fe:facetQuery()}${fe:geoQuery()}">
 						<span aria-hidden="true">&laquo;</span>
 						<span class="sr-only"><la:message key="labels.prev_page" /></span>
 					</la:link></li>
 			</c:if>
 			<c:if test="${!existPrevPage}">
-				<li class="prev disabled" aria-label="Previous"><a href="#">
+				<li class="page-item disabled" aria-label="Previous"><a class="page-link" href="#">
 						<span aria-hidden="true">&laquo;</span> <span class="sr-only"><la:message
 								key="labels.prev_page" /></span>
 				</a></li>
 			</c:if>
 			<c:forEach var="pageNumber" varStatus="s" items="${pageNumberList}">
 				<li
-					<c:if test="${pageNumber < currentPageNumber - 2 || pageNumber > currentPageNumber + 2}">class="hidden-xs"</c:if>
-					<c:if test="${pageNumber == currentPageNumber && pageNumber >= currentPageNumber - 2 && pageNumber <= currentPageNumber + 2}">class="active"</c:if>>
-					<la:link
+					<c:choose>
+						<c:when test="${pageNumber < currentPageNumber - 2 || pageNumber > currentPageNumber + 2}">class="page-item d-none d-sm-inline"</c:when>
+						<c:when test="${pageNumber == currentPageNumber && pageNumber >= currentPageNumber - 2 && pageNumber <= currentPageNumber + 2}">class="page-item active"</c:when>
+						<c:otherwise>class="page-item"</c:otherwise>
+					</c:choose>>
+					<la:link class="page-link"
 						href="/search/move?q=${f:u(q)}&pn=${f:u(pageNumber)}&num=${f:u(pageSize)}&sdh=${f:u(fe:sdh(sdh))}${fe:pagingQuery(null)}${fe:facetQuery()}${fe:geoQuery()}">${f:h(pageNumber)}</la:link>
 				</li>
 			</c:forEach>
 			<c:if test="${existNextPage}">
-				<li class="next"><la:link aria-label="Next"
+				<li class="page-item"><la:link class="page-link" aria-label="Next"
 						href="/search/next?q=${f:u(q)}&pn=${f:u(currentPageNumber)}&num=${f:u(pageSize)}&sdh=${f:u(fe:sdh(sdh))}${fe:pagingQuery(null)}${fe:facetQuery()}${fe:geoQuery()}">
 						<span class="sr-only"><la:message key="labels.next_page" /></span>
 						<span aria-hidden="true">&raquo;</span>
 					</la:link></li>
 			</c:if>
 			<c:if test="${!existNextPage}">
-				<li class="next disabled" aria-label="Next"><a href="#"> <span
+				<li class="page-item disabled" aria-label="Next"><a class="page-link" href="#"> <span
 						class="sr-only"><la:message key="labels.next_page" /></span> <span
 						aria-hidden="true">&raquo;</span>
 				</a></li>