Index: lams_tool_daco/conf/language/lams/ApplicationResources_en_AU.properties
===================================================================
diff -u -rb812eb010aa5c6d01ef10b19d6325900b7ae5963 -r69c270a1166f3eee13a93eda2c1d5f21024471f3
--- lams_tool_daco/conf/language/lams/ApplicationResources_en_AU.properties	(.../ApplicationResources_en_AU.properties)	(revision b812eb010aa5c6d01ef10b19d6325900b7ae5963)
+++ lams_tool_daco/conf/language/lams/ApplicationResources_en_AU.properties	(.../ApplicationResources_en_AU.properties)	(revision 69c270a1166f3eee13a93eda2c1d5f21024471f3)
@@ -269,3 +269,5 @@
 label.completed.activity = Activity completed
 label.current.activity = Current activity
 label.not.started.activity = Activity not reached yet
+label.view.summary = View Summary
+label.view.records = View Records
\ No newline at end of file
Index: lams_tool_daco/web/WEB-INF/tags/PageMonitor.tag
===================================================================
diff -u -r5c2c403d7a8a0e1b7894ee7c49f3e0031a5a3610 -r69c270a1166f3eee13a93eda2c1d5f21024471f3
--- lams_tool_daco/web/WEB-INF/tags/PageMonitor.tag	(.../PageMonitor.tag)	(revision 5c2c403d7a8a0e1b7894ee7c49f3e0031a5a3610)
+++ lams_tool_daco/web/WEB-INF/tags/PageMonitor.tag	(.../PageMonitor.tag)	(revision 69c270a1166f3eee13a93eda2c1d5f21024471f3)
@@ -56,8 +56,8 @@
 	        <script src="${lams}/monitoring/includes/javascript/monitor-activity.js" type="text/javascript"></script>
 	        <script>
 				const INITIAL_TAB_ID = "${initialTabId}",
-					TOOL_CONTENT_ID = <c:out value="${param.toolContentID}" />,
-					MONITORING_STATISTIC_URL = "<c:url value="/monitoring/statistic.do?sessionMapID=${sessionMapID}"/>";
+					TOOL_CONTENT_ID = <c:out value="${param.toolContentID}" />;
+				var	MONITORING_STATISTIC_URL = "<c:url value="/monitoring/statistic.do?sessionMapID=${sessionMapID}"/>";
 	        </script>
         </c:if>
     </lams:head>
Index: lams_tool_daco/web/common/jqueryheader.jsp
===================================================================
diff -u -r9c34fd660838f37a7a22bfee4c6573848f895c9e -r69c270a1166f3eee13a93eda2c1d5f21024471f3
--- lams_tool_daco/web/common/jqueryheader.jsp	(.../jqueryheader.jsp)	(revision 9c34fd660838f37a7a22bfee4c6573848f895c9e)
+++ lams_tool_daco/web/common/jqueryheader.jsp	(.../jqueryheader.jsp)	(revision 69c270a1166f3eee13a93eda2c1d5f21024471f3)
@@ -1,23 +1,15 @@
 <%@ include file="/common/taglibs.jsp"%>
-<c:set var="lams"><lams:LAMSURL/></c:set>
-<c:set var="tool"><lams:WebAppURL/></c:set>
+<c:set var="lams" scope="request"><lams:LAMSURL/></c:set>
+<c:set var="tool" scope="request"><lams:WebAppURL/></c:set>
 <c:set var="ctxPath" value="${pageContext.request.contextPath}" scope="request"/>
 
- 	<!-- ********************  CSS ********************** -->
-	<link href="<c:url value='/includes/css/daco.css'/>" rel="stylesheet" type="text/css">
-	<lams:css/>
-	<link rel="stylesheet" href="${lams}css/jquery.tablesorter.theme.bootstrap5.css">
-	<link rel="stylesheet" href="${lams}css/jquery.tablesorter.pager5.css"> 
+ <!-- ********************  CSS ********************** -->
+<link href="<c:url value='/includes/css/daco.css'/>" rel="stylesheet" type="text/css">
+<link rel="stylesheet" href="${lams}css/jquery.tablesorter.theme.bootstrap5.css">
+<link rel="stylesheet" href="${lams}css/jquery.tablesorter.pager5.css"> 
 
- 	<!-- ********************  javascript ********************** -->
-	<lams:JSImport src="includes/javascript/common.js" />
-
-	<script type="text/javascript" src="${lams}includes/javascript/jquery.js"></script> 
-	<script type="text/javascript" src="${lams}includes/javascript/jquery.tablesorter.js"></script> 
-	<script type="text/javascript" src="${lams}includes/javascript/jquery.tablesorter-pager.js"></script> 
-	<script type="text/javascript" src="${lams}includes/javascript/jquery.tablesorter-widgets.js"></script> 
-
-	<script type="text/javascript" src="${lams}includes/javascript/bootstrap.tabcontroller.js"></script>    
-	<script type="text/javascript" src="${lams}includes/javascript/bootstrap.min.js"></script>		
-	
-	<lams:JSImport src="includes/javascript/dacoCommon.js" relative="true" />
\ No newline at end of file
+<!-- ********************  javascript ********************** -->
+<script type="text/javascript" src="${lams}includes/javascript/jquery.tablesorter.js"></script> 
+<script type="text/javascript" src="${lams}includes/javascript/jquery.tablesorter-pager.js"></script> 
+<script type="text/javascript" src="${lams}includes/javascript/jquery.tablesorter-widgets.js"></script> 
+<lams:JSImport src="includes/javascript/dacoCommon.js" relative="true" />
\ No newline at end of file
Index: lams_tool_daco/web/includes/javascript/dacoCommon.js
===================================================================
diff -u -rb31ac55045b51d2098eb4b66772e3d6e2a5a89b6 -r69c270a1166f3eee13a93eda2c1d5f21024471f3
--- lams_tool_daco/web/includes/javascript/dacoCommon.js	(.../dacoCommon.js)	(revision b31ac55045b51d2098eb4b66772e3d6e2a5a89b6)
+++ lams_tool_daco/web/includes/javascript/dacoCommon.js	(.../dacoCommon.js)	(revision 69c270a1166f3eee13a93eda2c1d5f21024471f3)
@@ -1,4 +1,3 @@
-   
    // Finds a corresponding image and shows it
    function showBusy(targetDiv){
 		if($(targetDiv+"_Busy") != null){
@@ -20,13 +19,13 @@
 	    elem.name=name;
 	    arr[arr.length]=elem;
 	}
+	
 	function checkCheckbox(checkboxName){
 		var checkbox = document.getElementById(checkboxName);
 		checkbox.checked=true;
 	}
 	
 	function resizeHorizontalRecordListFrame(elementIdPrefix,questionListLength){
-
 		var horizontalRecordListFrame = document.getElementById(elementIdPrefix+'horizontalRecordListFrame');
 	    var doc = horizontalRecordListFrame.contentDocument? horizontalRecordListFrame.contentDocument : horizontalRecordListFrame.contentWindow.document;
         var body = doc.body;
@@ -35,4 +34,3 @@
             html.clientHeight, html.scrollHeight, html.offsetHeight );
         horizontalRecordListFrame.style.height = height + 60 + "px";
 	}
-		
Fisheye: Tag 69c270a1166f3eee13a93eda2c1d5f21024471f3 refers to a dead (removed) revision in file `lams_tool_daco/web/includes/javascript/dacoMonitoring.js'.
Fisheye: No comparison available.  Pass `N' to diff?
Index: lams_tool_daco/web/pages/learning/learning.jsp
===================================================================
diff -u -r52a6369ce66a2ea70d38bfa2e627dfcde6354b10 -r69c270a1166f3eee13a93eda2c1d5f21024471f3
--- lams_tool_daco/web/pages/learning/learning.jsp	(.../learning.jsp)	(revision 52a6369ce66a2ea70d38bfa2e627dfcde6354b10)
+++ lams_tool_daco/web/pages/learning/learning.jsp	(.../learning.jsp)	(revision 69c270a1166f3eee13a93eda2c1d5f21024471f3)
@@ -28,19 +28,6 @@
 		<c:set var="learningCurrentTab" value="1" />
 	</c:otherwise>
 </c:choose>
-<%-- To switch between the vertical/horizontal view --%>
-<c:set var="ellipsisControl">
-<c:choose>
-	<c:when test="${sessionMap.learningView=='horizontal'}">
-		<i class="fa-solid fa-ellipsis ms-2" title="<fmt:message key="label.common.view.change" />"
-	 		onclick="javascript:changeView('${sessionMapID}',${displayedRecordNumber})" id="ellipsis"></i>
-	</c:when>
-	<c:otherwise>
-		<i class="fa-solid fa-ellipsis-vertical ms-2" title="<fmt:message key="label.common.view.change" />"
-	 		onclick="javascript:changeView('${sessionMapID}',${displayedRecordNumber})" id="ellipsis"></i>
-	</c:otherwise>
-</c:choose>
-</c:set> 
 <%-- push mode into request so it is available in the tab pages --%>
 <c:set var="mode" scope="request">${mode}</c:set>
 
Index: lams_tool_daco/web/pages/learning/questionSummaries.jsp
===================================================================
diff -u -r8969536d397a74ec1c26188bdd4b207dc605c569 -r69c270a1166f3eee13a93eda2c1d5f21024471f3
--- lams_tool_daco/web/pages/learning/questionSummaries.jsp	(.../questionSummaries.jsp)	(revision 8969536d397a74ec1c26188bdd4b207dc605c569)
+++ lams_tool_daco/web/pages/learning/questionSummaries.jsp	(.../questionSummaries.jsp)	(revision 69c270a1166f3eee13a93eda2c1d5f21024471f3)
@@ -29,11 +29,11 @@
         <div class="row table-active">
             <div class="col-3 offset-6 singleSummaryCell">
                 <c:choose>
-                    <c:when test="${empty userFullName}">
+                    <c:when test="${empty sessionMap.userFullName}">
                         <fmt:message key="label.learning.tableheader.summary.learner" />
                     </c:when>
                     <c:otherwise>
-                        <c:out value="${userFullName}" escapeXml="true"/>
+                        <c:out value="${sessionMap.userFullName}" escapeXml="true"/>
                     </c:otherwise>
                 </c:choose>
             </div>
Index: lams_tool_daco/web/pages/monitoring/editactivity.jsp
===================================================================
diff -u -r7b3ea39ddf6e10186cf9916562121c205bb0e5ad -r69c270a1166f3eee13a93eda2c1d5f21024471f3
--- lams_tool_daco/web/pages/monitoring/editactivity.jsp	(.../editactivity.jsp)	(revision 7b3ea39ddf6e10186cf9916562121c205bb0e5ad)
+++ lams_tool_daco/web/pages/monitoring/editactivity.jsp	(.../editactivity.jsp)	(revision 69c270a1166f3eee13a93eda2c1d5f21024471f3)
@@ -1,50 +1,121 @@
 <%@ include file="/common/taglibs.jsp"%>
-<c:set var="sessionMap" value="${sessionScope[sessionMapID]}"/>
-<c:set var="daco" value="${sessionMap.daco}"/>
 
-<div class="voffset10">
-
-<c:if test="${!sessionMap.isPageEditable}">
-	<lams:Alert type="warn" id="no-edit" close="false">
-		<fmt:message key="message.learning.alertContentEdit" />
-	</lams:Alert>
-</c:if>
-
-<table class="table table-condensed">
-	<tr>
-		<td width="10%" nowrap>
-			<fmt:message key="label.authoring.basic.title" />
-			:
-		</td>
-		<td>
-			<c:out value="${daco.title}" escapeXml="true" />
-		</td>
-	</tr>
-
-	<tr>
-		<td width="10%" nowrap valign="top">
-			<fmt:message key="label.authoring.basic.instruction" />
-			:
-		</td>
-		<td>
-			<c:out value="${daco.instructions}" escapeXml="false" />
-		</td>
-	</tr>
-	<c:if test="${sessionMap.isPageEditable}">
+<c:set var="adTitle"><fmt:message key="tab.monitoring.edit.activity" /></c:set>
+<lams:AdvancedAccordian title="${adTitle}">
+	<c:choose>
+		<c:when test="${sessionMap.isPageEditable}">
+			<form id='define-later-form' method='post' action='../authoring/definelater.do' target='definelater'>
+				<input type="hidden" name="<csrf:tokenname/>" value="<csrf:tokenvalue/>"/>
+				<input type="hidden" name="toolContentID" value="${sessionMap.toolContentID}" />
+				<input type="hidden" name="contentFolderID" value="${sessionMap.contentFolderID}" />
+			</form>
+	
+			<button type="button" onclick="launchDefineLaterPopup()" class="btn btn-secondary float-end me-2 mb-3">
+				<fmt:message key="label.monitoring.edit.activity.edit" />
+			</button>
+		</c:when>
+		
+		<c:otherwise>
+			<lams:Alert5 type="warn" id="no-edit">
+				<fmt:message key="message.learning.alertContentEdit" />
+			</lams:Alert5>
+		</c:otherwise>
+	</c:choose>
+          	
+	<table class="table table-striped table-condensed">
 		<tr>
-			<td colspan="2">
-				<form id='define-later-form' method='post' action='../authoring/definelater.do' target='definelater'>
-					<input type="hidden" name="<csrf:tokenname/>" value="<csrf:tokenvalue/>"/>
-					<input type="hidden" name="toolContentID" value="${sessionMap.toolContentID}" />
-					<input type="hidden" name="contentFolderID" value="${sessionMap.contentFolderID}" />
-				</form>
+			<td nowrap>
+				<fmt:message key="label.authoring.basic.title" />
+			</td>
+			<td>
+				<c:out value="${daco.title}" escapeXml="true" />
+			</td>
+		</tr>
 	
-				<a href="#nogo" onclick="javascript:launchDefineLaterPopup()" class="btn btn-default pull-right">
-					<fmt:message key="label.monitoring.edit.activity.edit" />
-				</a>
+		<tr>
+			<td nowrap valign="top">
+				<fmt:message key="label.authoring.basic.instruction" />
 			</td>
+			<td>
+				<c:out value="${daco.instructions}" escapeXml="false" />
+			</td>
 		</tr>
-	</c:if>
-</table>
-
-</div>
\ No newline at end of file
+	
+		<tr>
+			<td>
+				<fmt:message key="label.common.min" />
+			</td>
+			<td>
+				<c:choose>
+					<c:when test="${daco.minRecords==0}">
+						<fmt:message key="label.authoring.advanced.record.nolimit" />
+					</c:when>
+					<c:otherwise>
+						${daco.minRecords}
+					</c:otherwise>
+				</c:choose>	
+			</td>
+		</tr>
+		<tr>
+			<td>
+				<fmt:message key="label.common.max" />
+			</td>
+			<td>
+				<c:choose>
+					<c:when test="${daco.maxRecords==0}">
+						<fmt:message key="label.authoring.advanced.record.nolimit" />
+					</c:when>
+					<c:otherwise>
+						${daco.maxRecords}
+					</c:otherwise>
+				</c:choose>	
+			</td>
+		</tr>
+		<tr>
+			<td>
+				<fmt:message key="label.authoring.advanced.notify.onlearnerentry" />
+			</td>
+			<td>
+				<c:choose>
+					<c:when test="${daco.notifyTeachersOnLearnerEntry}">
+						<fmt:message key="label.monitoring.advancedsettings.on" />
+					</c:when>
+					<c:otherwise>
+						<fmt:message key="label.monitoring.advancedsettings.off" />
+					</c:otherwise>
+				</c:choose>	
+			</td>
+		</tr>
+		<tr>
+			<td>
+				<fmt:message key="label.authoring.advanced.notify.onrecordsubmit" />
+			</td>
+			<td>
+				<c:choose>
+					<c:when test="${daco.notifyTeachersOnRecordSumbit}">
+						<fmt:message key="label.monitoring.advancedsettings.on" />
+					</c:when>
+					<c:otherwise>
+						<fmt:message key="label.monitoring.advancedsettings.off" />
+					</c:otherwise>
+				</c:choose>	
+			</td>
+		</tr>
+		
+		<tr>
+			<td>
+				<fmt:message key="label.authoring.advanced.lock.on.finished" />
+			</td>
+			<td>
+				<c:choose>
+					<c:when test="${daco.lockOnFinished}">
+						<fmt:message key="label.monitoring.advancedsettings.on" />
+					</c:when>
+					<c:otherwise>
+						<fmt:message key="label.monitoring.advancedsettings.off" />
+					</c:otherwise>
+				</c:choose>	
+			</td>
+		</tr>
+	</table>
+</lams:AdvancedAccordian>
Index: lams_tool_daco/web/pages/monitoring/listRecords.jsp
===================================================================
diff -u -r1d797a122973488f0a007957b73a4c680a7eb932 -r69c270a1166f3eee13a93eda2c1d5f21024471f3
--- lams_tool_daco/web/pages/monitoring/listRecords.jsp	(.../listRecords.jsp)	(revision 1d797a122973488f0a007957b73a4c680a7eb932)
+++ lams_tool_daco/web/pages/monitoring/listRecords.jsp	(.../listRecords.jsp)	(revision 69c270a1166f3eee13a93eda2c1d5f21024471f3)
@@ -1,89 +1,71 @@
-<%@ include file="/common/taglibs.jsp"%>
 <!DOCTYPE html>
+<%@ include file="/common/taglibs.jsp"%>
+<%-- This page/learning/listRecords.jsp page modifies its content depending on the page it was included from. --%>
+<c:if test="${not empty param.includeMode}">
+	<c:set var="includeMode" value="${param.includeMode}" />
+</c:if>
+<c:if test="${empty includeMode}">
+	<c:set var="includeMode" value="monitoring" />
+</c:if>
+<c:if test="${not empty param.sessionMapID}">
+	<c:set var="sessionMapID" value="${param.sessionMapID}" />
+</c:if>
+<c:set var="sessionMap" value="${sessionScope[sessionMapID]}" />
+<c:set var="userGroup" value="${sessionMap.monitoringSummary}" />
 
-<lams:html> 
-<lams:head>
-		<%-- This page/learning/listRecords.jsp page modifies its content depending on the page it was included from. --%>
-		<c:if test="${not empty param.includeMode}">
-			<c:set var="includeMode" value="${param.includeMode}" />
-		</c:if>
-		<c:if test="${empty includeMode}">
-			<c:set var="includeMode" value="monitoring" />
-		</c:if>
-		<c:if test="${not empty param.sessionMapID}">
-			<c:set var="sessionMapID" value="${param.sessionMapID}" />
-		</c:if>
-		<c:set var="sessionMap" value="${sessionScope[sessionMapID]}" />
-		<c:set var="userGroup" value="${sessionMap.monitoringSummary}" />
+<c:set var="title"><fmt:message key="title.monitoring.recordlist" /></c:set>
+<lams:PageMonitor title="${title}" hideHeader="true">
+	<link href="<c:url value='/includes/css/daco.css'/>" rel="stylesheet" type="text/css">
 			
-		<%@ include file="/common/header.jsp"%>
+	<lams:JSImport src="includes/javascript/dacoCommon.js" relative="true" />
+	<script type="text/javascript">
+		function checkCheckbox(checkboxName){
+			var checkbox = document.getElementById(checkboxName);
+			checkbox.checked=true;
+		}	
+	</script> 
 
-		<lams:JSImport src="includes/javascript/dacoMonitoring.js" relative="true" />
-		<script type="text/javascript">
-			function checkCheckbox(checkboxName){
-				var checkbox = document.getElementById(checkboxName);
-				checkbox.checked=true;
-			}	
-		</script> 
-		<title>
-			<fmt:message key="title.monitoring.recordlist" />
-		</title>
-</lams:head> 
-<body class="stripes">
-
-<c:set var="title"><fmt:message key="title.monitoring.recordlist" /></c:set>
-<lams:Page type="monitor" title="${title}">
-
-	<%-- Switch between the horizontal and vertical views --%>
-	<c:url var="changeViewUrl" value='/monitoring/changeView.do'>
-		<c:param name="sessionMapID" value="${sessionMapID}" />
-		<c:param name="toolSessionID" value="${toolSessionID}" />
-		<c:param name="userId" value="${userId}" />
-		<c:param name="sort" value="${sort}" />
-	</c:url>
-
-	<span class="pull-right voffset5">
-	<c:choose>
-		<c:when test="${sessionMap.learningView=='horizontal'}">
-		<i class="fa fa-ellipsis-h loffset10" title="<fmt:message key="label.common.view.change" />"
-		 onclick="javascript:document.location.href='${changeViewUrl}'" id="ellipsis"></i>
-		</c:when>
-		<c:otherwise>
-		<i class="fa fa-ellipsis-v loffset10" title="<fmt:message key="label.common.view.change" />"
-		 onclick="javascript:document.location.href='${changeViewUrl}'" id="ellipsis"></i>
-		</c:otherwise>
-	</c:choose>
-	</span>
-
-	<h4>
-	<c:if test="${sessionMap.isGroupedActivity}">
-		<fmt:message key="label.monitoring.group" />: ${userGroup.sessionName}
-	</c:if>
-	</h4>
+	<div class="container-main">
+		<h1 class="mb-4">
+			${title}
+		</h1>
 	
- 	<c:forEach var="user" items="${userGroup.users}">
-		<table class="table table-striped table-condensed">
-		<tr>
-			<th><fmt:message key="label.monitoring.fullname" /></th>
-			<th><fmt:message key="label.monitoring.recordcount" /></th>
-		</tr>
-		<tr>
-			<td style="height: 20px;">
-				 <c:out value="${user.fullName}" escapeXml="true"/>
-			</td>
-			<td>
-				 ${user.recordCount}
-			</td>
-		</tr>
-		</table>
- 		<c:if test="${not empty user.records}">
-			<c:set var="recordList" value="${user.records}" />
- 			<%@ include file="/pages/learning/listRecords.jsp" %>
+		<c:if test="${sessionMap.isGroupedActivity}">
+			<h2>
+				<fmt:message key="label.monitoring.group" />: ${userGroup.sessionName}
+			</h2>
 		</c:if>
-	</c:forEach> 
+		
+	 	<c:forEach var="user" items="${userGroup.users}">
+	 		<h3 class="card-subheader fs-4">
+	 			<fmt:message key="label.export.file.user" />:&nbsp;<c:out value="${user.fullName}" escapeXml="true"/>
+	 		</h3>
+			
+	 		<c:if test="${not empty user.records}">
+				<c:set var="recordList" value="${user.records}" />
+	 			<%@ include file="/pages/learning/listRecords.jsp" %>
+			</c:if>
+		</c:forEach> 
 
-	<div id="footer">
+		<div class="activity-bottom-buttons">
+			<button type="button" onclick="window.close()" class="btn btn-primary">
+				<i class="fa-regular fa-circle-xmark me-1"></i>
+				<fmt:message key="label.close" />
+			</button>
+
+			<%-- Switch between the horizontal and vertical views --%>
+			<c:url var="changeViewUrl" value='/monitoring/changeView.do'>
+				<c:param name="sessionMapID" value="${sessionMapID}" />
+				<c:param name="toolSessionID" value="${toolSessionID}" />
+				<c:param name="userId" value="${userId}" />
+				<c:param name="sort" value="${sort}" />
+			</c:url>
+		
+			<button type="button" class="btn btn-secondary btn-sm me-2" onclick="document.location.href='${changeViewUrl}'">
+				<i class="fa-solid ${sessionMap.learningView=='horizontal' ? 'fa-ellipsis' : 'fa-ellipsis-vertical'} me-2" 
+						title="<fmt:message key="label.common.view.change" />" id="ellipsis"></i>
+				<fmt:message key="label.common.view.change" />
+			</button>
+		</div>
 	</div>
-</lams:Page>
-</body>
-</lams:html>
+</lams:PageMonitor>
Index: lams_tool_daco/web/pages/monitoring/monitoring.jsp
===================================================================
diff -u -r9dcc3e2d26b504f92d919f53f0d45dd4093a82a2 -r69c270a1166f3eee13a93eda2c1d5f21024471f3
--- lams_tool_daco/web/pages/monitoring/monitoring.jsp	(.../monitoring.jsp)	(revision 9dcc3e2d26b504f92d919f53f0d45dd4093a82a2)
+++ lams_tool_daco/web/pages/monitoring/monitoring.jsp	(.../monitoring.jsp)	(revision 69c270a1166f3eee13a93eda2c1d5f21024471f3)
@@ -1,45 +1,15 @@
 <!DOCTYPE html>
-        
-
 <%@ include file="/common/taglibs.jsp"%>
 <%@ page import="org.lamsfoundation.lams.tool.daco.DacoConstants"%>
 
-<c:url var="refreshSummaryUrl" value="/monitoring/summary.do?sessionMapID=${sessionMapID}"/>
-<c:url var="statisticsUrl" value="/monitoring/statistic.do?sessionMapID=${sessionMapID}"/>
+<c:set var="title"><fmt:message key="label.common.heading" /></c:set>
+<lams:PageMonitor title="${title}" 
+	helpToolSignature="<%= DacoConstants.TOOL_SIGNATURE %>"
+	initialTabId="${vmonitoringCurrentTab}"
+	tab1Label="label.common.summary"
+	tab2Label="tab.monitoring.edit.activity"
+	tab3Label="tab.monitoring.statistics"
+	tab1Jsp="summary.jsp"
+	tab2Jsp="editactivity.jsp"
+	tab3Jsp="statistics.jsp"/>
 
-<lams:html>
-	<lams:head>
-		<%@ include file="/common/jqueryheader.jsp" %>
-		
-		<script>
-			var currentTab = "${monitoringCurrentTab}";
-			var gStatisticsUrl = "${statisticsUrl}"; // used by the tab functions
-			var gRefreshUrl = "${refreshSummaryUrl}"; // used by the tab functions
-		</script>
-		<lams:JSImport src="includes/javascript/dacoMonitoring.js" relative="true" /> 
-		
-		<title><fmt:message key="title.monitoring" /></title>
-
-	</lams:head>
-	<body id="body" class="stripes" onLoad="init()">
-	<c:set var="title"><fmt:message key="label.common.heading" /></c:set>
- 	<lams:Page type="navbar" title="${title}"> 
-
-		<lams:Tabs control="true" title="${title}" helpToolSignature="<%= DacoConstants.TOOL_SIGNATURE %>" helpModule="monitoring" refreshOnClickAction="javascript:refreshPage()">
-			<lams:Tab id="1" key="label.common.summary"/>
-			<lams:Tab id="2" key="tab.monitoring.edit.activity"/>
-			<lams:Tab id="3" key="tab.monitoring.statistics"/>
-		</lams:Tabs>	
-
-  		<lams:TabBodyArea>
-			<lams:TabBodys>			
-					<lams:TabBody id="1" page="summary.jsp"/>
-					<lams:TabBody id="2" page="editactivity.jsp"/>	
-					<lams:TabBody id="3" page="statistics.jsp"/>
-			</lams:TabBodys> 
-		</lams:TabBodyArea> 
-
-	<div id="footer"></div>
-	</lams:Page>
-</body>
-</lams:html>
Index: lams_tool_daco/web/pages/monitoring/questionSummaries.jsp
===================================================================
diff -u -r7475d08afc280b5e2e5ddf04e8bf35e3166aaf80 -r69c270a1166f3eee13a93eda2c1d5f21024471f3
--- lams_tool_daco/web/pages/monitoring/questionSummaries.jsp	(.../questionSummaries.jsp)	(revision 7475d08afc280b5e2e5ddf04e8bf35e3166aaf80)
+++ lams_tool_daco/web/pages/monitoring/questionSummaries.jsp	(.../questionSummaries.jsp)	(revision 69c270a1166f3eee13a93eda2c1d5f21024471f3)
@@ -1,29 +1,31 @@
-<%@ include file="/common/taglibs.jsp"%>
 <!DOCTYPE html>
+<%@ include file="/common/taglibs.jsp"%>
+<c:set var="sessionMap" value="${sessionScope[sessionMapID]}" />
 
-<lams:html>
-<lams:head>
-		<%@ include file="/common/header.jsp"%>
-		<title>
-			<fmt:message key="label.common.summary" />
-		</title>
-</lams:head> 
-<body class="stripes">
 <c:set var="title"><fmt:message key="label.common.summary" /></c:set>
-<lams:Page type="monitor" title="${title}">
-
-	<c:if test="${not empty param.includeMode}">
-		<c:set var="includeMode" value="${param.includeMode}" />
-	</c:if>
-	<c:if test="${empty includeMode}">
-		<c:set var="includeMode" value="monitoring" />
-	</c:if>
-	<%@ include file="/pages/learning/questionSummaries.jsp" %>
-
-	<div id="footer">
+<lams:PageMonitor title="${title}" hideHeader="true">
+	<link href="<c:url value='/includes/css/daco.css'/>" rel="stylesheet" type="text/css">
+	
+	<lams:JSImport src="includes/javascript/dacoCommon.js" relative="true" />
+	
+	<div class="container-main">
+		<h1 class="mb-4">
+			${title}
+		</h1>
+		
+		<c:if test="${not empty param.includeMode}">
+			<c:set var="includeMode" value="${param.includeMode}" />
+		</c:if>
+		<c:if test="${empty includeMode}">
+			<c:set var="includeMode" value="monitoring" />
+		</c:if>
+		<%@ include file="/pages/learning/questionSummaries.jsp" %>
+		
+		<div class="activity-bottom-buttons">
+			<button type="button" onclick="window.close()" class="btn btn-primary">
+				<i class="fa-regular fa-circle-xmark me-1"></i>
+				<fmt:message key="label.close" />
+			</button>
+		</div>
 	</div>
-
-</lams:Page>
-</body>
-</lams:html>
-	
\ No newline at end of file
+</lams:PageMonitor>
Index: lams_tool_daco/web/pages/monitoring/statisticsarea.jsp
===================================================================
diff -u -r7475d08afc280b5e2e5ddf04e8bf35e3166aaf80 -r69c270a1166f3eee13a93eda2c1d5f21024471f3
--- lams_tool_daco/web/pages/monitoring/statisticsarea.jsp	(.../statisticsarea.jsp)	(revision 7475d08afc280b5e2e5ddf04e8bf35e3166aaf80)
+++ lams_tool_daco/web/pages/monitoring/statisticsarea.jsp	(.../statisticsarea.jsp)	(revision 69c270a1166f3eee13a93eda2c1d5f21024471f3)
@@ -1,12 +1,11 @@
 <%@ include file="/common/taglibs.jsp"%>
 <c:set var="sessionMap" value="${sessionScope[sessionMapID]}" />
 
-<div class="voffset10">
 <c:choose>
 	<c:when test="${empty sessionSummaries}">
-		<lams:Alert type="info" id="no-session-stats" close="false">
+		<lams:Alert5 type="info" id="no-session-stats">
 			<fmt:message key="message.monitoring.summary.no.session" />
-		</lams:Alert>
+		</lams:Alert5>
 	</c:when>
 
 	<c:otherwise>
@@ -40,5 +39,3 @@
 	</table>
 	</c:otherwise>
 </c:choose>
-</div>
-
Index: lams_tool_daco/web/pages/monitoring/summary.jsp
===================================================================
diff -u -r9c34fd660838f37a7a22bfee4c6573848f895c9e -r69c270a1166f3eee13a93eda2c1d5f21024471f3
--- lams_tool_daco/web/pages/monitoring/summary.jsp	(.../summary.jsp)	(revision 9c34fd660838f37a7a22bfee4c6573848f895c9e)
+++ lams_tool_daco/web/pages/monitoring/summary.jsp	(.../summary.jsp)	(revision 69c270a1166f3eee13a93eda2c1d5f21024471f3)
@@ -2,19 +2,21 @@
 <c:set var="sessionMap" value="${sessionScope[sessionMapID]}" />
 <c:set var="monitoringSummary" value="${sessionMap.monitoringSummary}" />
 <c:set var="anyRecordsAvailable" value="false" />	
-<c:set var="daco" value="${sessionMap.daco}"/>
-<c:set var="lams"><lams:LAMSURL/></c:set>
-				
+<c:set var="daco" value="${sessionMap.daco}" scope="request"/>
+
+<%@ include file="/common/jqueryheader.jsp" %>
 <script type="text/javascript" src="${lams}/includes/javascript/monitorToolSummaryAdvanced.js"></script>
 <script type="text/javascript" src="${lams}/includes/javascript/portrait5.js" ></script>
-
 <script type="text/javascript">
+	MONITORING_STATISTIC_URL = "<c:url value="/monitoring/statistic.do?sessionMapID=${sessionMapID}"/>" + "&reqID=" + (new Date()).getTime();;
+
 	function exportSummary(){
 		location.href = "<c:url value='/monitoring/exportToSpreadsheet.do'/>?sessionMapID=${sessionMapID}&reqID=" + (new Date()).getTime();
 	};
 	
   	$(document).ready(function(){
-	    
+  		doStatistic();
+  		
 		$(".tablesorter").tablesorter({
 			theme: 'bootstrap',
 			headerTemplate : '{content} {icon}',
@@ -50,28 +52,30 @@
 								userId = userData["userId"],
 								fullName = userData["userFullName"];;
 							
-							rows += '<tr>';
+							rows += '<tr>' +
+										'<td>' + definePortraitPopover(userData["portraitId"], userId, fullName, fullName) + '</td>' +
 							
-							rows += '<td>'+ definePortraitPopover(userData["portraitId"], userId, fullName, fullName) +'</td>';
-							
-							rows += '<td align="center">';
-							rows += userData["recordCount"];
-							rows += '</td>';
-							rows += '<td align="center">';
+										'<td align="center">' +
+											userData["recordCount"] +
+										'</td>' +
+										
+										'<td align="center">';
 							if ( userData["recordCount"] > 0) {
 								var url = '<c:url value="/monitoring/listRecords.do"/>?sessionMapID=${sessionMapID}&toolSessionID='+$(table).attr('data-session-id')+'&sort=1&userId='+userData["userId"];
 								var popUpTitle = '<spring:escapeBody javaScriptEscape="true"><fmt:message key="title.monitoring.recordlist" /></spring:escapeBody>';
-								rows +=	'&nbsp;&nbsp;<a href="#" onclick="javascript:launchPopup(\''+url+'\',\''+popUpTitle+'\');" class="btn btn-default btn-xs">';
-								rows += 'View Records'
+								rows +=		'<button type="button" onclick="launchPopup(\''+url+'\',\''+popUpTitle+'\')" class="btn btn-light btn-sm ms-2">' +
+												'<i class="fa-solid fa-eye me-1"></i>' +
+												'<spring:escapeBody javaScriptEscape="true"><fmt:message key="label.view.records" /></spring:escapeBody>' +
+											'</button>'; 
 								url = '<c:url value="/monitoring/getQuestionSummaries.do"/>?sessionMapID=${sessionMapID}&toolSessionID='+$(table).attr('data-session-id')+'&userId='+userData["userId"];
 								popUpTitle = '<spring:escapeBody javaScriptEscape="true"><fmt:message key="label.common.summary" /></spring:escapeBody>';
-								rows += '</a>&nbsp;&nbsp;<a href="#" onclick="javascript:launchPopup(\''+url+'\',\''+popUpTitle+'\');" class="btn btn-default btn-xs">';
-								rows += 'View Summary'
-								rows += '</a>';
+								rows += 	'<button type="button" onclick="launchPopup(\''+url+'\',\''+popUpTitle+'\')" class="btn btn-light btn-sm ms-2">' +
+												'<i class="fa-solid fa-eye me-1"></i>' +
+												'<spring:escapeBody javaScriptEscape="true"><fmt:message key="label.view.summary" /></spring:escapeBody>' +
+											'</button>';
 							} 
-							rows += '</td>';
-							
-							rows += '</tr>';
+							rows += 	'</td>' +
+									'</tr>';
 						}
 			            
 						json.total = data.total_rows;
@@ -86,159 +90,91 @@
 	  	})
 </script>
 
-<div class="panel">
-<div class="pull-right">
-	<c:if test="${not sessionMap.isGroupedActivity }">
-		<c:forEach var="sessionSummary" items="${monitoringSummary}" varStatus="status">
-			<c:url var="viewRecordList" value="/monitoring/listRecords.do?sessionMapID=${sessionMapID}&toolSessionID=${sessionSummary.sessionId}&sort=1" />
-		</c:forEach>	
-		<a href="#nogo" onclick="javascript:launchPopup('${viewRecordList}','RecordList')" class="btn btn-default btn-xs">
-			<fmt:message key="label.monitoring.viewrecords.all" />
-		</a>					
-	</c:if>
-	<a href="javascript:exportSummary();" class="btn btn-default btn-xs"><fmt:message key="button.export" /></a>
-</div>
+<h1>
+	<c:out value="${daco.title}" escapeXml="true"/>
+</h1>
 
-<h4>
-  <c:out value="${daco.title}" escapeXml="true"/>
-</h4>
-
-
-<div class="instructions voffset5">
-  <c:out value="${daco.instructions}" escapeXml="false"/>
+<div class="instructions">
+	<c:out value="${daco.instructions}" escapeXml="false"/>
 </div>
 
-</div>
-
 <c:choose>
 	<c:when test="${empty monitoringSummary}">
-		<lams:Alert type="info" id="no-session-summary" close="false">
+		<lams:Alert5 type="info" id="no-session-summary">
 			<fmt:message key="message.monitoring.summary.no.session" />
-		</lams:Alert>
+		</lams:Alert5>
 	</c:when>
+	
 	<c:otherwise>
 		<c:if test="${sessionMap.isGroupedActivity}">
 			<div class="panel-group" id="accordionSessions" role="tablist" aria-multiselectable="true"> 
 		</c:if>
 
 		<c:forEach var="sessionSummary" items="${monitoringSummary}" varStatus="status">
 			<c:url var="viewRecordList" value="/monitoring/listRecords.do?sessionMapID=${sessionMapID}&toolSessionID=${sessionSummary.sessionId}&sort=1" />
- 		<c:if test="${sessionMap.isGroupedActivity}">
-			    <div class="panel panel-default" >
-			        <div class="panel-heading" id="heading${sessionSummary.sessionId}">
-						<span class="panel-title collapsable-icon-left">
-			        	<a class="${status.first ? '' : 'collapsed'}" role="button" data-toggle="collapse" href="#collapse${sessionSummary.sessionId}" 
-							aria-expanded="${status.first ? 'false' : 'true'}" aria-controls="collapse${sessionSummary.sessionId}" >
-						<fmt:message key="label.learning.tableheader.summary.group" />: <c:out value="${sessionSummary.sessionName}"/></a>
+			
+ 			<c:if test="${sessionMap.isGroupedActivity}">
+			    <div class="lcard" >
+			        <div class="card-header" id="heading${sessionSummary.sessionId}">
+						<span class="card-title collapsable-icon-left">
+				        	<button class="btn btn-secondary-darker no-shadow ${status.first ? '' : 'collapsed'}" type="button" data-bs-toggle="collapse" data-bs-target="#collapse${sessionSummary.sessionId}" 
+									aria-expanded="${status.first}" aria-controls="collapse${sessionSummary.sessionId}" >
+								<fmt:message key="label.learning.tableheader.summary.group" />: <c:out value="${sessionSummary.sessionName}"/>
+							</button>
 						</span>
- 						<a href="#nogo" onclick="javascript:launchPopup('${viewRecordList}','RecordList')" class="btn btn-default btn-xs pull-right">
-						<fmt:message key="label.monitoring.viewrecords.all" />
-						</a>					
+						
+ 						<button type="button" onclick="launchPopup('${viewRecordList}','RecordList')" class="btn btn-light btn-sm no-shadow float-end">
+ 							<i class="fa-solid fa-eye me-1"></i>
+							<fmt:message key="label.monitoring.viewrecords.all" />
+						</button>				
 			        </div>
-			        <div id="collapse${sessionSummary.sessionId}" class="panel-collapse collapse ${status.first ? 'in' : ''}" role="tabpanel" aria-labelledby="heading${sessionSummary.sessionId}">
-		</c:if>
+			        
+			        <div id="collapse${sessionSummary.sessionId}" class="card-collapse collapse ${status.first ? 'show' : ''}">
+			</c:if>
 		
-					<!-- Details for the group / whole of class -->
-				
-					<lams:TSTable numColumns="3" dataId="data-session-id='${sessionSummary.sessionId}'">
-						<th><fmt:message key="label.monitoring.fullname" /></th>
-						<th align="center"  width="8%"><fmt:message key="label.monitoring.recordcount" /></th>
-						<th align="center"  width="25%"></th>
-					</lams:TSTable>
+			<!-- Details for the group / whole of class -->
+			<lams:TSTable5 numColumns="3" dataId="data-session-id='${sessionSummary.sessionId}'">
+				<th><fmt:message key="label.monitoring.fullname" /></th>
+				<th align="center" width="8%"><fmt:message key="label.monitoring.recordcount" /></th>
+				<th align="center" width="35%"></th>
+			</lams:TSTable5>
 
-		<c:if test="${sessionMap.isGroupedActivity}">
+			<c:if test="${sessionMap.isGroupedActivity}">
 					</div> <!-- end collapse area  -->
 				</div> <!-- end collapse panel  -->
-				${status.last ? '' : '<div class="voffset5">&nbsp;</div>'}
-		</c:if>
-
+			</c:if>
 		</c:forEach>
+		
 		<c:if test="${sessionMap.isGroupedActivity}">
 			</div> <!-- end panel-group for accordian -->
 		</c:if>
 
+		<div class="clearfix">
+			<c:if test="${not sessionMap.isGroupedActivity }">
+				<c:forEach var="sessionSummary" items="${monitoringSummary}" varStatus="status">
+					<c:url var="viewRecordList" value="/monitoring/listRecords.do?sessionMapID=${sessionMapID}&toolSessionID=${sessionSummary.sessionId}&sort=1" />
+				</c:forEach>
+					
+				<button type="button" onclick="launchPopup('${viewRecordList}','RecordList')" class="btn btn-light btn-sm float-end ms-2">
+					<i class="fa-solid fa-eye me-1"></i>
+					<fmt:message key="label.monitoring.viewrecords.all" />
+				</button>					
+			</c:if>
+			
+			<button type="button" onclick="exportSummary()" class="btn btn-light btn-sm float-end">
+				<i class="fa fa-download me-1" aria-hidden="true"></i>
+				<fmt:message key="button.export" />
+			</button>
+		</div>
 	</c:otherwise>
 </c:choose>
 
-<c:set var="adTitle"><fmt:message key="label.monitoring.advancedsettings" /></c:set>
-<lams:AdvancedAccordian title="${adTitle}">
-          	
-<table class="table table-striped table-condensed">
-	<tr>
-		<td>
-			<fmt:message key="label.common.min" />
-		</td>
-		<td>
-			<c:choose>
-				<c:when test="${daco.minRecords==0}">
-					<fmt:message key="label.authoring.advanced.record.nolimit" />
-				</c:when>
-				<c:otherwise>
-					${daco.minRecords}
-				</c:otherwise>
-			</c:choose>	
-		</td>
-	</tr>
-	<tr>
-		<td>
-			<fmt:message key="label.common.max" />
-		</td>
-		<td>
-			<c:choose>
-				<c:when test="${daco.maxRecords==0}">
-					<fmt:message key="label.authoring.advanced.record.nolimit" />
-				</c:when>
-				<c:otherwise>
-					${daco.maxRecords}
-				</c:otherwise>
-			</c:choose>	
-		</td>
-	</tr>
-	<tr>
-		<td>
-			<fmt:message key="label.authoring.advanced.notify.onlearnerentry" />
-		</td>
-		<td>
-			<c:choose>
-				<c:when test="${daco.notifyTeachersOnLearnerEntry}">
-					<fmt:message key="label.monitoring.advancedsettings.on" />
-				</c:when>
-				<c:otherwise>
-					<fmt:message key="label.monitoring.advancedsettings.off" />
-				</c:otherwise>
-			</c:choose>	
-		</td>
-	</tr>
-	<tr>
-		<td>
-			<fmt:message key="label.authoring.advanced.notify.onrecordsubmit" />
-		</td>
-		<td>
-			<c:choose>
-				<c:when test="${daco.notifyTeachersOnRecordSumbit}">
-					<fmt:message key="label.monitoring.advancedsettings.on" />
-				</c:when>
-				<c:otherwise>
-					<fmt:message key="label.monitoring.advancedsettings.off" />
-				</c:otherwise>
-			</c:choose>	
-		</td>
-	</tr>
-	
-	<tr>
-		<td>
-			<fmt:message key="label.authoring.advanced.lock.on.finished" />
-		</td>
-		<td>
-			<c:choose>
-				<c:when test="${daco.lockOnFinished}">
-					<fmt:message key="label.monitoring.advancedsettings.on" />
-				</c:when>
-				<c:otherwise>
-					<fmt:message key="label.monitoring.advancedsettings.off" />
-				</c:otherwise>
-			</c:choose>	
-		</td>
-	</tr>
-</table>
-</lams:AdvancedAccordian>
+<h2 class="card-subheader fs-4" id="header-statistics">
+	<fmt:message key="tab.monitoring.statistics" />
+</h2>
+<%@ include file="statistics.jsp"%>
+
+ <h2 class="card-subheader fs-4" id="header-settings">
+	Settings
+</h2>
+<%@ include file="editactivity.jsp" %>