Implement Journal view.

v2/css/styles.css

@@ -78,6 +78,7 @@ input[type="checkbox"], input[type="radio"] {
 	-webkit-appearance: none;
 	-moz-appearance: none;
 	appearance: none;
+	cursor: inherit;
  }
 
 input[type="checkbox"]:checked {
@@ -270,6 +271,14 @@ a {
 	overflow-y: auto;
 }
 
+.popup-item-disabled, .popup-title-disabled {
+	pointer-events: none;
+	user-select: none;
+}
+.popup-item-disabled {
+	opacity: .6;
+}
+
 .popup-footer :hover{
 	background-color: #808080;
 }
@@ -481,8 +490,8 @@ a {
 	color: white;
 	overflow: auto;
 	z-index: 1;
-	margin-top: 9px;
 	margin-left: -2px;
+	margin-top: 5px;
 }
 
 .filterBox-header {
@@ -736,7 +745,7 @@ a {
 	display: flex;
 	align-items: center;
 	justify-content: space-between;
-	overflow: hidden;
+	z-index: 1;
 }
 
 .tool_rightitems {
@@ -1355,6 +1364,83 @@ a {
 	left: -10000px;
 }
 
+/* journal screen */
+.toolbar-disabled {
+	pointer-events: none;
+	filter: brightness(0.6);
+}
+.journal-toolleft {
+	gap: 10px !important;
+}
+.journal-list-container {
+	position: absolute;
+	top: 55px;
+	left: 0;
+	height: calc(100vh - 110px);
+	overflow-y: auto;
+	width: 100%;
+	background-color: white;
+}
+.journal-list-container.expanded {
+	height: calc(100vh - 55px);
+}
+
+.journal-warningbox {
+	background-color: #000000;
+	height: 55px;
+	color: white;
+	display: flex;
+	align-items: center;
+	padding-inline: 12px;
+	position: relative;
+	z-index: 1;
+}
+#journal-listview {
+	margin-inline: auto;
+	padding-left: 10px;
+	padding-right: 40px;
+}
+#journal-listview .activity-name.nonEditing {
+	border: none;
+	cursor: inherit;
+	outline: none;
+}
+#journal-listview .listview_left, .assignment-container {
+	width: 100%;
+}
+#journal-listview span, #journal-listview .journal-checkbox {
+	flex-shrink: 0;
+}
+#journal-listview .journal-checkbox {
+	width: 18px;
+	height: 18px;
+}
+#journal-listview .journal-star {
+	padding: 10px .5rem;
+}
+.assignment-container {
+	display: flex;
+	margin-left: 4vw;
+	column-gap: 2vw;
+	align-items: center;
+	flex-wrap: wrap;
+}
+.assignment-container h3 {
+	margin-block: 0px;
+}
+.journal-footer {
+	position: absolute;
+	inset: 0;
+	top: auto;
+	justify-content: left;
+}
+.journal-footer .icon {
+	margin-right: .7rem !important;
+}
+#journal-sync {
+	margin-left: 34% !important;
+}
+
 /* neighborhood screen */
 .server-error {
 	display: flex;