5 files changed, 557 insertions, 123 deletions

diff --git a/app/assets/stylesheets/application.css b/app/assets/stylesheets/application.css
index c034596be..568bed2bc 100644
--- a/app/assets/stylesheets/application.css
+++ b/app/assets/stylesheets/application.css
@@ -236,6 +236,7 @@ a.user.user-mention {
 
 #sidebar a.selected {line-height:1.7em; padding:1px 3px 2px 2px; margin-left:-2px; background-color:#9DB9D5; color:#fff; border-radius:2px;}
 #sidebar a.selected:hover {text-decoration:none;}
+#sidebar a.selected svg.icon-svg { stroke: #fff !important; }
 #sidebar .query.default {font-weight: bold;}
 #admin-menu a {line-height:1.7em;}
 #admin-menu a.selected:not(:has(svg))  {padding-left: 20px !important; background-position: 2px 40%;}
@@ -305,24 +306,44 @@ div + .drdn-items {border-top:1px solid #ccc;}
 }
 .drdn-items>span {color:#999;}
 
-.contextual .drdn-content {top:18px;}
-.contextual .drdn-items {padding:2px; min-width: 160px;}
-.contextual .drdn-items>a {display: flex; padding: 5px 8px;}
-.contextual .drdn-items>a.icon:not(:has(svg)) {padding-left: 24px; background-position-x: 4px;}
-.contextual .drdn-items>a:hover {color:#2A5685; border:1px solid #628db6; background-color:#eef5fd; border-radius:3px;}
+.contextual .drdn-content, .journal-actions .drdn-content {
+  top: 18px;
+}
+
+.contextual .drdn-items, .journal-actions .drdn-items {
+  padding: 2px;
+  min-width: 160px;
+}
+
+.contextual .drdn-items > a, .journal-actions .drdn-items > a {
+  display: flex;
+  padding: 5px 8px;
+}
+
+.contextual .drdn-items > a.icon:not(:has(svg)), .journal-actions .drdn-items > a.icon:not(:has(svg)) {
+  padding-left: 24px;
+  background-position-x: 4px;
+}
+
+.contextual .drdn-items > a:hover, .journal-actions .drdn-items > a:hover {
+  color: #2A5685;
+  border: 1px solid #628db6;
+  background-color: #eef5fd;
+  border-radius: 3px;
+}
 
 #project-jump.drdn {width:200px;display:inline-block;}
 #project-jump .drdn-trigger {
   width:100%;
   height:24px;
   display:inline-block;
-  padding:3px 18px 3px 6px;
+  padding:1.5px 18px 3px 6px;
   border-radius:3px;
   border:1px solid #ccc;
   margin:0 !important;
   vertical-align:middle;
   color:#555;
-  background:#fff url(/arrow_down.png) no-repeat 97% 50%;
+  background:#fff url(/chevron-down.svg) no-repeat 98% 50%;
 }
 #project-jump .drdn.expanded .drdn-trigger {background-image:url(/arrow_up.png);}
 #project-jump .drdn-content {width:280px;}
@@ -358,10 +379,14 @@ table.list td.buttons a, div.buttons a, table.list td.buttons span.icon-only { m
 table.list td.buttons a:last-child, div.buttons a:last-child { margin-right: 0; }
 table.list td.buttons img, div.buttons img {vertical-align:middle;}
 table.list td.reorder {width:15%; white-space:nowrap; text-align:center; }
-table.list table.progress td {padding-right:0px;}
+table.list table.progress td {padding-right:0; border-top: none;}
 table.list caption { text-align: left; padding: 0.5em 0.5em 0.5em 0; }
 table.list tr.overdue td.due_date  { color: #c22; }
+table.list thead.related-issues th { background-color: inherit; font-size: 11px; border: none; }
 #role-permissions-trackers table.list th {white-space:normal;}
+table.list div.wiki p {
+  margin: 0;
+}
 
 .table-list-cell {display: table-cell; vertical-align: top; padding:2px; }
 .table-list div.buttons {width: 15%;}
@@ -383,16 +408,16 @@ table.issues td.block_column {color:#777; font-size:90%; padding:4px 4px 4px 24p
 table.issues td.block_column>span {font-weight: bold; display: block; margin-bottom: 4px;}
 table.issues td.block_column>pre {white-space:normal;}
 
-tr.idnt td.subject, tr.idnt td.name {background: url(/arrow_right.png) no-repeat 2px 50%;}
-tr.idnt-1 td.subject, tr.idnt-1 td.name {padding-left: 24px; background-position: 8px 50%;}
-tr.idnt-2 td.subject, tr.idnt-2 td.name {padding-left: 40px; background-position: 24px 50%;}
-tr.idnt-3 td.subject, tr.idnt-3 td.name {padding-left: 56px; background-position: 40px 50%;}
-tr.idnt-4 td.subject, tr.idnt-4 td.name {padding-left: 72px; background-position: 56px 50%;}
-tr.idnt-5 td.subject, tr.idnt-5 td.name {padding-left: 88px; background-position: 72px 50%;}
-tr.idnt-6 td.subject, tr.idnt-6 td.name {padding-left: 104px; background-position: 88px 50%;}
-tr.idnt-7 td.subject, tr.idnt-7 td.name {padding-left: 120px; background-position: 104px 50%;}
-tr.idnt-8 td.subject, tr.idnt-8 td.name {padding-left: 136px; background-position: 120px 50%;}
-tr.idnt-9 td.subject, tr.idnt-9 td.name {padding-left: 152px; background-position: 136px 50%;}
+tr.idnt td.subject, tr.idnt td.name {background: url(/chevron-right-idnt.svg) no-repeat 2px 50%;}
+tr.idnt-1 td.subject, tr.idnt-1 td.name {padding-left: 24px; background-position: 4px 50%;}
+tr.idnt-2 td.subject, tr.idnt-2 td.name {padding-left: 40px; background-position: 20px 50%;}
+tr.idnt-3 td.subject, tr.idnt-3 td.name {padding-left: 56px; background-position: 36px 50%;}
+tr.idnt-4 td.subject, tr.idnt-4 td.name {padding-left: 72px; background-position: 52px 50%;}
+tr.idnt-5 td.subject, tr.idnt-5 td.name {padding-left: 88px; background-position: 68px 50%;}
+tr.idnt-6 td.subject, tr.idnt-6 td.name {padding-left: 104px; background-position: 84px 50%;}
+tr.idnt-7 td.subject, tr.idnt-7 td.name {padding-left: 120px; background-position: 100px 50%;}
+tr.idnt-8 td.subject, tr.idnt-8 td.name {padding-left: 136px; background-position: 116px 50%;}
+tr.idnt-9 td.subject, tr.idnt-9 td.name {padding-left: 152px; background-position: 132px 50%;}
 
 table.issue-report {table-layout:fixed;}
 table.issue-report tr.total, table.issue-report-detailed tr.total { font-weight: bold; border-top:2px solid #d0d7de;}
@@ -408,7 +433,7 @@ tr.entry.file td.filename a { margin-left: 26px; }
 tr.entry.file td.filename_no_report a { margin-left: 16px; }
 
 tr span.expander, .gantt_subjects div > span.expander {margin-left: 0; cursor: pointer;}
-.gantt_subjects div > span .icon-gravatar {float: none;}
+.gantt_subjects .avatar {margin-right: 4px;}
 .gantt_subjects div.project-name a, .gantt_subjects div.version-name a {margin-left: 4px;}
 
 tr.changeset { height: 20px }
@@ -431,16 +456,12 @@ tr.message td.last_message { font-size: 93%; white-space: nowrap; }
 tr.message.sticky td.subject { font-weight: bold; }
 tr.message td.subject:not(:has(.icon)) { padding-left: 20px; }
 
-body.avatars-on #replies .message.reply {padding-left: 32px;}
-#replies .reply:target h4.reply-header {background-color:#DDEEFF;}
-#replies h4 img.gravatar {margin-left:-32px;}
-
 tr.version.closed, tr.version.closed a { color: #999; }
 tr.version:not(.shared) td.name { padding-left: 20px; }
 tr.version td.date, tr.version td.status, tr.version td.sharing { text-align: center; white-space:nowrap; }
 
-#principals_for_new_member .icon-user {background:transparent;}
-#principals_for_new_member svg, #principals_for_new_member img {margin-right: 4px;}
+#principals_for_new_member .icon-user, #users_for_watcher .icon-user {background:transparent;}
+#principals_for_new_member svg, #principals_for_new_member .avatar  {margin-right: 4px;}
 
 tr.user td {width:13%;white-space: nowrap;}
 td.username, td.firstname, td.lastname, td.email {text-align:left !important;}
@@ -544,9 +565,9 @@ body.controller-gantts fieldset#options > div > div {
 td.center {text-align:center;}
 
 #watchers select {width: 95%; display: block;}
-#watchers img.gravatar {margin: 0 4px 2px 0;}
+#watchers .avatar {margin: 0 4px 2px 0;}
 #watchers svg.icon-svg {margin: 0 2px 2px 0;}
-#users_for_watcher img.gravatar {padding-bottom: 2px; margin-right: 4px;}
+#users_for_watcher .avatar {padding-bottom: 2px; margin-right: 4px;}
 #users_for_watcher svg {margin-right: 4px;}
 #users_for_watcher span.icon-user {display: inline;}
 
@@ -588,7 +609,6 @@ div.square {
 }
 .contextual {float:right; white-space: nowrap; line-height:1.4em;margin:5px 0px; padding-left: 10px; font-size:0.9em;}
 .contextual input, .contextual select {font-size:0.9em;}
-.message .contextual, #comments .contextual { margin-top: 0; }
 
 .splitcontent {overflow: auto; display: flex; flex-wrap: wrap;}
 .splitcontentleft {flex: 1; margin-right: 5px;}
@@ -604,9 +624,9 @@ select {
   -o-appearance: none;
   appearance: none;
   background-color: #fff;
-  background-image: url(/arrow_down.png);
+  background-image: url(/chevron-down.svg);
   background-repeat: no-repeat;
-  background-position: calc(100% - 7px) 50%;
+  background-position: calc(100% - 2px) 50%;
   padding-right: 20px;
 }
 input[type="file"] {border: 0; padding-left: 0; padding-right: 0; height: initial; background-color: initial; }
@@ -678,6 +698,36 @@ div.issue .attribute.string_cf .value .wiki p {margin-top: 0; margin-bottom: 0;}
 div.issue .attribute.text_cf .value .wiki p:first-of-type {margin-top: 0;}
 div.issue.overdue .due-date .value { color: #c22; }
 body.controller-issues h2.inline-flex {padding-right: 0}
+div#sticky-issue-header {
+  display: none;
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  background-color: white;
+  border-bottom: 1px solid #d0d7de;
+  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
+  font-size: 0.8125rem;
+  align-items: center;
+  z-index: 1000;
+  padding: 10px 6px;
+  border-radius: 0px;
+}
+div#sticky-issue-header.is-visible {
+  display: flex;
+}
+div#sticky-issue-header .issue-heading {
+  flex-shrink: 0;
+  white-space: nowrap;
+  margin-right: 6px;
+}
+div#sticky-issue-header .subject {
+  font-weight: bold;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  flex-grow: 1;
+}
 
 #issue_tree table.issues, #relations table.issues {border: 0;}
 #issue_tree table.issues td, #relations table.issues td {border: 0;}
@@ -740,29 +790,15 @@ div#issue-changesets div.changeset {border-bottom: 1px solid #ddd; padding: 4px;
 div#issue-changesets p { margin-top: 0; margin-bottom: 1em;}
 .changeset-comments {margin-bottom:1em;}
 
-div.journal .contextual {margin-top: 0;}
-div.journal.private-notes .wiki {border-left:2px solid #d22; padding-left:4px; margin-left:-6px;}
-div.journal ul.details, ul.revision-info {color:#959595; margin-bottom: 1.5em;}
-div.journal ul.details a, ul.revision-info a {color:#70A7CD;}
-div.journal ul.details a:hover, ul.revision-info a:hover {color:#D14848;}
-body.avatars-on div.journal {padding-left:32px;}
-div.journal h4 img.gravatar {margin-left:-32px;}
-div.journal span.update-info {color: #666; font-size: 0.9em;}
-
 #update {margin-bottom: 1.4em;}
 
-#history .tab-content {
-  padding: 0 8px;
-  margin-bottom: 10px;
-  border-right: 1px solid #d0d7de;
-  border-bottom: 1px solid #d0d7de;
-  border-left: 1px solid #d0d7de;
-  border-radius: 0 0 3px 3px / 0 0 3px 3px;
-  box-shadow: 0 1px 2px rgba(0,0,0,0.05);
-}
-
-#history div:target h4.note-header {background-color:#DDEEFF;}
 #history p.nodata {display: none;}
+/* Prevent content from being hidden behind a #sticky-issue-header when scrolling via anchor links. */
+.controller-issues.action-show div.wiki a[name],
+.controller-issues.action-show #history div[id^="note-"],
+.controller-issues.action-show #history div[id^="change-"] {
+  scroll-margin-top: 50px;
+}
 
 div#activity dl, #search-results { margin-left: 2em; }
 div#activity dd, #search-results dd { margin-bottom: 1em; padding-left: 22px; font-size: 0.8125rem;}
@@ -884,7 +920,11 @@ ul.projects div.description ul li {list-style-type:initial;}
   background-image: none;
   padding-left: 0;
 }
-#projects-index ul.projects div.root svg {
+#projects-index ul.projects .icon-bookmarked-project svg,
+#projects-index ul.projects .my-project svg {
+  margin-left: 4px;
+}
+#projects-index ul.projects div.root .icon-bookmarked-project svg, #projects-index ul.projects div.root .my-project svg {
   stroke-width: 2;
   margin-bottom: 10px;
 }
@@ -895,7 +935,12 @@ ul.projects div.description ul li {list-style-type:initial;}
   background-image: none;
   padding-left: 0;
 }
-#projects-index a.project ~ svg, table.projects tr.project td.name svg {
+#projects-index div.wiki p {
+  margin-top: 0px;
+}
+
+table.projects td.name .icon-bookmarked-project svg,
+table.projects td.name .my-project svg {
   margin-left: 4px;
 }
 
@@ -1059,17 +1104,14 @@ input#months { width: 46px; }
 
 .jstBlock .jstTabs { padding-right: 6px; }
 .jstBlock .wiki-preview { padding: 2px; }
-.jstBlock .wiki-preview p:first-child { padding-top: 0 !important; margin-top: 0 !important;}
-.jstBlock .wiki-preview p:last-child { padding-bottom: 0 !important; margin-bottom: 0 !important;}
+.jstBlock .wiki-preview > p:first-child { padding-top: 0 !important; margin-top: 0 !important;}
+.jstBlock .wiki-preview > p:last-child { padding-bottom: 0 !important; margin-bottom: 0 !important;}
 
 .tabular .wiki-preview, .tabular .jstTabs {width: 95%;}
 .tabular.settings .wiki-preview, .tabular.settings .jstTabs { width: 99%; }
 .tabular.settings .wiki-preview p {padding-left: 0 !important}
 .tabular .wiki-preview p {
   min-height: initial;
-  padding: 0;
-  padding-top: 1em !important;
-  padding-bottom: 1em !important;
   overflow: initial;
 }
 
@@ -1110,13 +1152,29 @@ span.required {color: #bb0000;}
 .attachments_fields input.description, #existing-attachments input.description {margin-left:4px; width:340px;}
 .attachments_fields>span, #existing-attachments>span {display:block; white-space:nowrap;}
 /* ToDo: delete this line when legacy icons are deleted */
-.attachments_fields , #existing-attachments .icon-attachment {background-image: none; padding-left: 0}
+.attachments_fields .icon-attachment, #existing-attachments .icon-attachment {background-image: none; padding-left: 0}
 .attachments_fields input.filename, #existing-attachments .filename {border:0; width:250px; color:#555; background-color:inherit; }
 .tabular input.filename {max-width:75% !important;}
-.attachments_fields input.filename {height:1.8em;}
-.attachments_fields .ajax-waiting input.filename {background:url(/hourglass.png) no-repeat 0px 50%;}
-.attachments_fields .ajax-loading input.filename {background:url(/loading.gif) no-repeat 0px 50%;}
 .attachments_fields div.ui-progressbar { width: 100px; height:14px; margin: 2px 0 -5px 8px; display: inline-block; }
+.attachments_fields input.filename {
+  height:1.8em;
+  padding-left: 3px;
+  padding-right: 0;
+}
+.attachments_fields .ajax-waiting {
+  padding-left: 16px;
+  background:url(/hourglass-empty.svg) no-repeat 0px 50%;
+}
+.attachments_fields .ajax-waiting .svg-attachment {
+  display: none;
+}
+.attachments_fields .ajax-loading {
+  padding-left: 16px;
+  background: url(/loading.gif) no-repeat 0px 50%;
+}
+.attachments_fields .ajax-loading .svg-attachment {
+  display: none;
+}
 
 a.remove-upload:hover {text-decoration:none !important;}
 .existing-attachment.deleted .filename {text-decoration:line-through; color:#999 !important;}
@@ -1130,13 +1188,10 @@ div.attachments span.author { font-size: 0.9em; color: #888; }
 div.thumbnails {margin:0.6em;}
 div.thumbnail {background:#fff;border:2px solid #ddd;display:inline-block;margin-right:2px;}
 div.thumbnail img {margin: 3px; vertical-align: middle;}
-#history div.thumbnails {margin-left: 2em;}
 
 p.other-formats { text-align: right; font-size:0.9em; color: #666; }
 .other-formats span + span:before { content: "| "; }
 
-a.atom { background: url(/feed.png) no-repeat 1px 50%; padding: 2px 0px 3px 16px; }
-
 em.info {font-style:normal;display:block;font-size:90%;color:#888;}
 em.info.error {padding-left:20px; background:url(/exclamation.png) no-repeat 0 50%;}
 
@@ -1255,11 +1310,45 @@ div.flash.warning svg.icon-svg, .conflict svg.icon-svg {
   color: #A6750C;
 }
 
+.warning .oauth-permissions { display:inline-block;text-align:left; }
+.warning .oauth-permissions p { margin-top:0;-webkit-margin-before:0;}
+
 #errorExplanation ul { font-size: 0.9em;}
 #errorExplanation h2, #errorExplanation p { display: none; }
 
 .conflict-details {font-size:93%;}
 
+/***** CommonMark Alerts *****/
+.markdown-alert {
+  border-left: 4px solid;
+  padding-left: 0.6em;
+  margin: 1em 0;
+}
+
+.markdown-alert-title {
+  font-weight: bold;
+}
+
+.markdown-alert-tip { border-color: #5db651; }
+.markdown-alert-tip .markdown-alert-title { color: #005f00; }
+.markdown-alert-tip .markdown-alert-title svg {stroke: #005f00; }
+
+.markdown-alert-important { border-color: #800080; }
+.markdown-alert-important .markdown-alert-title { color: #4b006e; }
+.markdown-alert-important .markdown-alert-title svg { stroke: #4b006e; }
+
+.markdown-alert-caution { border-color: #c22; }
+.markdown-alert-caution .markdown-alert-title { color: #880000; }
+.markdown-alert-caution .markdown-alert-title svg { stroke: #880000; }
+
+.markdown-alert-warning { border-color: #e4bc4b; }
+.markdown-alert-warning .markdown-alert-title { color: #a7760c; }
+.markdown-alert-warning .markdown-alert-title svg { stroke: #a7760c; }
+
+.markdown-alert-note { border-color: #169; }
+.markdown-alert-note .markdown-alert-title { color: #1e40af; }
+.markdown-alert-note .markdown-alert-title svg { stroke: #1e40af; }
+
 /***** Ajax indicator ******/
 #ajax-indicator {
 position: absolute; /* fixed not supported by IE */
@@ -1350,7 +1439,7 @@ p.cal.legend span {display:flex;}
 .tooltip span.tip{display: none; text-align:left;}
 .tooltip span.tip a { color: #169 !important; }
 
-.tooltip span.tip img.gravatar {
+.tooltip span.tip .avatar {
   float: none;
   margin: 0;
 }
@@ -1534,11 +1623,20 @@ div.wiki .external {
 div.wiki a {word-wrap: break-word;}
 div.wiki a.new {color: #b73535;}
 
-div.wiki p {line-height: 1.6;}
+div.wiki p {
+  line-height: 1.6;
+  margin-top: 1em;
+  margin-bottom: 1em;
+  padding: 0;
+}
 div.wiki ul, div.wiki ol {margin-bottom:1em;}
 div.wiki li {line-height: 1.6; margin-bottom: 0.125rem;}
 div.wiki li>ul, div.wiki li>ol {margin-bottom: 0;}
 
+div.wiki div.pre-wrapper {
+  position: relative;
+}
+
 div.wiki pre {
   margin: 1em 1em 1em 1.6em;
   padding: 8px;
@@ -1556,6 +1654,22 @@ div.wiki *:not(pre)>code, div.wiki>code {
   border-radius: 0.1em;
 }
 
+div.pre-wrapper a.copy-pre-content-link {
+  position: absolute;
+  top: 3px;
+  right: calc(1em + 3px);
+  cursor: pointer;
+  display: none;
+  border-radius: 3px;
+  background: #fff;
+  border: 1px solid #ccc;
+  padding: 0px 3px 3px 3px;
+}
+
+div.pre-wrapper:hover a.copy-pre-content-link {
+  display: block;
+}
+
 div.wiki ul.toc {
   background-color: #ffffdd;
   border: 1px solid #e4e4e4;
@@ -1589,10 +1703,11 @@ a.wiki-anchor:hover { color: #aaa !important; text-decoration: none; }
 h1:hover a.wiki-anchor, h2:hover a.wiki-anchor, h3:hover a.wiki-anchor, h4:hover a.wiki-anchor, h5:hover a.wiki-anchor, h6:hover a.wiki-anchor { display: inline; color: #ddd; }
 
 div.wiki img {vertical-align:middle; max-width:100%;}
-div.wiki>.task-list {
-  padding-left: 0px;
+
+div.wiki>.contains-task-list {
+  padding-left: 0;
 }
-div.wiki .task-list {
+div.wiki .contains-task-list {
   list-style-type: none;
 }
 div.wiki .task-list input.task-list-item-checkbox {
@@ -1624,6 +1739,7 @@ div.wiki .task-list input.task-list-item-checkbox {
 .handle {cursor: move;}
 
 #my-page .list th.checkbox, #my-page .list td.checkbox {display:none;}
+
 /***** Gantt chart *****/
 table.gantt-table {
   width: 100%;
@@ -1677,10 +1793,7 @@ table.gantt-table td {
   width: 100%;
 }
 .gantt_subjects div.issue-subject:hover { background-color:#ffffdd; }
-.gantt_selected_column_content { padding-left: 3px; padding-right: 3px;}
-.gantt_subjects .issue-subject img.icon-gravatar {
-  margin: 2px 5px 0px 2px;
-}
+.gantt_selected_column_content > div { padding-left: 3px; box-sizing: border-box; }
 
 .gantt_hdr_selected_column_name {
   position: absolute;
@@ -1701,6 +1814,21 @@ td.gantt_selected_column .gantt_hdr,.gantt_selected_column_container {
   width: 49px;
 }
 
+td.gantt_watcher_users_column div.issue_watcher_users ul {
+  margin: 0;
+  padding: 0;
+  list-style: none;
+}
+
+td.gantt_watcher_users_column div.issue_watcher_users ul li {
+  display: inline;
+}
+
+td.gantt_watcher_users_column div.issue_watcher_users ul li:not(:last-child)::after {
+  content: ', ';
+  white-space: pre;
+}
+
 .task {
   position: absolute;
   height:8px;
@@ -1737,6 +1865,68 @@ td.gantt_selected_column .gantt_hdr,.gantt_selected_column_container {
 .version-behind-schedule a, .issue-behind-schedule a {color: #f66914;}
 .version-overdue a, .issue-overdue a, .project-overdue a {color: #f00;}
 
+/***** User events (ex: journal, notes, replies, comments) *****/
+.journals h4.journal-header {
+  background-color: #f6f7f8;
+  border-bottom: 0;
+  padding: 8px;
+  align-items: center;
+  display: flex;
+  justify-content: space-between;
+}
+
+.journals h4.journal-header .update-info {
+  color: #666;
+  font-size: 0.9em;
+}
+
+.journals h4.journal-header .badge {
+  position: static;
+}
+
+.journals div:target h4.journal-header {
+  background-color:#DDEEFF;
+}
+
+.journals .journal-content {
+  padding-left: 8px;
+  margin-bottom: 1.2em;
+}
+
+.journals .journal .journal-content .wiki {
+  margin-left: 0.6em;
+}
+
+.journals .private-notes  {
+  border-left: 2px solid #d22;
+}
+
+.journals .journal-meta, .journals .journal-actions  {
+  display: inline-flex;
+  gap: 10px;
+}
+
+.journals .journal-meta .journal-link {
+  color: #555;
+}
+
+.journals .journal-actions .reaction-button-wrapper {
+  display: inline-flex;
+}
+
+.journals .journal-details, ul.revision-info {
+  color: #959595;
+  margin-bottom: 1.5em;
+}
+
+.journals .journal-details a, ul.revision-info a {
+  color: #70A7CD;
+}
+
+.journals .journal-details a:hover, ul.revision-info a:hover {
+  color: #D14848;
+}
+
 /***** Badges *****/
 .badge {
   position:relative;
@@ -1798,10 +1988,15 @@ td.gantt_selected_column .gantt_hdr,.gantt_selected_column_container {
   flex-shrink: 0;
 }
 
-a.icon:hover svg, a.icon-only:hover svg {
+a.icon:hover .icon-svg, a.icon-only:hover .icon-svg, span.icon-actions:hover .icon-svg {
   stroke: #c61a1a;
 }
 
+a.icon:hover .icon-svg-filled, a.icon-only:hover .icon-svg-filled {
+  stroke: none;
+  fill: #c61a1a;
+}
+
 svg.icon-ok {
   stroke: #5db651;
 }
@@ -1825,6 +2020,11 @@ svg.icon-svg {
   vertical-align: middle;
 }
 
+svg.icon-svg-filled {
+  fill: #169;
+  stroke: none;
+}
+
 svg.s20 {
   width: 1.25rem;
   height: 1.25rem;
@@ -1835,6 +2035,11 @@ svg.s18 {
   height: 1.125rem;
 }
 
+svg.s16 {
+  width: 1rem;
+  height: 1rem;
+}
+
 svg.s14 {
   width: 0.875rem;
   height: 0.875rem;
@@ -1976,21 +2181,16 @@ tr.ui-sortable-helper { border:1px solid #e4e4e4; }
 
 .contextual>*:not(:first-child), .buttons>.icon:not(:first-child), .contextual .journal-actions>*:not(:first-child) { margin-left: 5px; }
 
-img.gravatar {
-  vertical-align: middle;
-  border-radius: 20%;
-}
-
-div.issue img.gravatar {
+div.issue .avatar {
   float: left;
   margin: 0 12px 6px 0;
 }
 
-div.gravatar-with-child {
+div.avatar-with-child {
   position: relative;
 }
 
-div.gravatar-with-child > img.gravatar:nth-child(2) {
+div.avatar-with-child > .avatar:nth-child(2) {
   position: absolute;
   top: 30px;
   left: 30px;
@@ -1998,12 +2198,11 @@ div.gravatar-with-child > img.gravatar:nth-child(2) {
   border: 2px solid rgba(255, 255, 255, 0.9);
 }
 
-h2 img.gravatar, h3 img.gravatar {margin-right: 4px;}
+h2 .avatar, h3 .avatar {margin-right: 4px;}
 h4 img.gravatar {margin: -2px 4px -4px 0;}
+/*# TODO: check where this rule is still used*/
 td.username img.gravatar {margin: 0 0.5em 0 0; vertical-align: top;}
-#activity dt img.gravatar {margin: 0 1em 0 0;}
-/* Used on 12px Gravatar img tags without the icon background */
-.icon-gravatar {float: left; margin-right: 4px;}
+#activity dt .avatar {margin: 0 1em 0 0;}
 
 #activity dt, .journal {clear: left;}
 
@@ -2026,6 +2225,134 @@ color: #555; text-shadow: 1px 1px 0 #fff;
 
 img.filecontent.image {background-image: url(/transparent.png);}
 
+/* Avatar styles */
+.avatar {
+  border-radius: 20%;
+  display: inline-flex;
+  vertical-align: middle;
+}
+
+span[role="img"].avatar {
+  font-family: 'Roboto', 'Helvetica Neue', Helvetica, Arial, sans-serif;
+  align-items: center;
+  display: inline-flex;
+  font-size: calc(24px * .4);
+  justify-content: center;
+  user-select: none;
+  font-weight: 700;
+}
+.avatar.s13 {
+  block-size: 13px;
+  inline-size: 13px;
+}
+span[role="img"].avatar.s13 {
+  font-size: calc(16px * .3);
+}
+.avatar.s16 {
+  block-size: 16px;
+  inline-size: 16px;
+}
+span[role="img"].avatar.s16 {
+  font-size: calc(16px * .4);
+}
+.avatar.s22 {
+  block-size: 22px;
+  inline-size: 22px;
+}
+span[role="img"].avatar.s22 {
+  font-size: calc(22px * .4);
+}
+.avatar.s24 {
+  block-size: 24px;
+  inline-size: 24px;
+}
+span[role="img"].avatar.s24  {
+  font-size: calc(24px * .4);
+}
+.avatar.s40 {
+  block-size: 40px;
+  inline-size: 40px;
+}
+span[role="img"].avatar.s40  {
+  font-size: calc(40px * .4);
+}
+.avatar.s50 {
+  block-size: 50px;
+  inline-size: 50px;
+}
+span[role="img"].avatar.s50  {
+  font-size: calc(50px * .4);
+}
+
+.avatar-color-0 {
+  background-color: #880000;
+  color: #FFFFFF;
+}
+.avatar-color-1 {
+  background-color: #ff0000;
+  color: #000000;
+}
+.avatar-color-2 {
+  background-color: #00ff00;
+  color: #000000;
+}
+.avatar-color-3 {
+  background-color: #008800;
+  color: #FFFFFF;
+}
+.avatar-color-4 {
+  background-color: #0000ff;
+  color: #FFFFFF;
+}
+.avatar-color-5 {
+  background-color: #000088;
+  color: #FFFFFF;
+}
+.avatar-color-6 {
+  background-color: #ff8800;
+  color: #000000;
+}
+.avatar-color-7 {
+  background-color: #ff0088;
+  color: #000000;
+}
+
+/* Reaction styles */
+.reaction-button:hover, .reaction-button:active {
+  text-decoration: none;
+}
+.reaction-button .icon-label {
+  margin-left: 3px;
+  margin-bottom: -1px;
+  font-weight: bold;
+}
+.reaction-button.readonly {
+  cursor: default;
+}
+.reaction-button.readonly .icon-svg {
+  stroke: #999;
+}
+.reaction-button.readonly .icon-label {
+  color: #999;
+}
+div.issue.details .reaction {
+  float: right;
+  font-size: 0.9em;
+  margin-top: 0.5em;
+  margin-left: 10px;
+  clear: right;
+}
+div.message .reaction {
+  float: right;
+  font-size: 0.9em;
+  margin-left: 10px;
+}
+div.news .reaction {
+  float: right;
+  font-size: 0.9em;
+  margin-left: 10px;
+}
+
 /* Custom JQuery styles */
 .ui-autocomplete, .ui-menu {
   border-radius: 2px;
diff --git a/app/assets/stylesheets/responsive.css b/app/assets/stylesheets/responsive.css
index ec580037c..b3e8bddd8 100644
--- a/app/assets/stylesheets/responsive.css
+++ b/app/assets/stylesheets/responsive.css
@@ -385,7 +385,7 @@
     list-style: none;
   }
 
-  .flyout-menu #watchers {
+  .flyout-menu #watchers, .flyout-menu .queries {
     display: -webkit-flex;
     display: -webkit-box;
     display: flex;
@@ -402,11 +402,11 @@
     order: 3;
   }
 
-  .flyout-menu #watchers h3 {
+  #sidebar-wrapper {
     margin-left: -8px;
   }
 
-  .flyout-menu #watchers ul li {
+  .flyout-menu #watchers ul li, .flyout-menu ul.queries li {
     display: -webkit-flex;
     display: -webkit-box;
     display: flex;
@@ -418,6 +418,16 @@
     -webkit-align-items: center;
     -webkit-box-align: center;
     align-items: center;
+    border-top: 1px solid rgba(255,255,255,.1);
+  }
+
+  .flyout-menu #watchers ul li a, .flyout-menu ul.queries li a {
+    border-top: none;
+  }
+
+  .flyout-menu ul.queries li a.icon-clear-query {
+    flex-shrink: 0;
+    padding-right: 8px;
   }
 
   .flyout-menu ul li a {
@@ -440,7 +450,7 @@
     color: white;
   }
 
-  .flyout-menu .icon svg {
+  .flyout-menu .icon svg, .flyout-menu .icon-only svg {
     stroke: white;
   }
 
@@ -771,6 +781,10 @@
     width: 100%; /* let subject have one full width column */
   }
 
+  #issue_tree .issue:has(.buttons a) > td.subject, #relations .issue:has(.buttons a) > td.subject {
+    padding-right: 40px;
+  }
+
   #issue_tree .issue > td:not(.subject), #relations .issue > td:not(.subject) {
     width: 20%; /* three columns for all cells that are not subject */
   }
@@ -844,6 +858,19 @@
     font-size: 1.1em;
     text-align: left;
   }
+
+  /* Sticky issue header */
+  /* When project-jump.drdn is visible in mobile layout, offset the sticky header by its height to prevent it from being hidden. */
+  div#sticky-issue-header {
+    top: 64px;
+  }
+
+  /* Prevent content from being hidden behind #sticky-issue-header and project-jump when scrolling via anchor links. */
+  .controller-issues.action-show div.wiki a[name],
+  .controller-issues.action-show #history div[id^="note-"],
+  .controller-issues.action-show #history div[id^="change-"] {
+    scroll-margin-top: 114px;
+  }
 }
 
 @media all and (max-width: 599px) {
diff --git a/app/assets/stylesheets/rtl.css b/app/assets/stylesheets/rtl.css
index 550071462..20a2a73dc 100644
--- a/app/assets/stylesheets/rtl.css
+++ b/app/assets/stylesheets/rtl.css
@@ -21,12 +21,29 @@ h1, h2, h3, h4 {padding:2px 00px 1px 10px;}
 #main-menu {left:auto;right:6px;margin-right:0;margin-left:-500px;}
 #main-menu li {float:right;margin:0px 0px 0px 2px;}
 
-#admin-menu a {padding-left:0;padding-right:20px;}
+#admin-menu a:not(:has(svg)) {padding-left:0;padding-right:20px;}
+
+#sidebar {float:left; padding-right: 20px; padding-left: 8px; border-left: 0; border-right: 1px solid #d0d7de;}
+* html #sidebar hr {left: auto; right: -6px;}
+
+#main.collapsedsidebar #sidebar {
+  padding-left: 0;
+  padding-right: 20px;
+}
 
-#sidebar {float:left;}
-* html #sidebar hr{ left: auto; right: -6px; }
 #sidebar .contextual { margin-right: 0;  margin-left: 1em;}
-#sidebar ul li {margin: 0px 0px 0px 2px;}
+#sidebar ul li {margin: 0 0 0 2px;}
+#sidebar #sidebar-switch-panel {
+  margin-left: 0;
+  margin-right: -20px;
+  padding-left: 28px;
+  padding-right: 0;
+}
+
+#sidebar #sidebar-switch-panel #sidebar-switch-button {
+  padding-right: 0;
+  padding-left: 28px;
+}
 
 #content {border-right:0 solid #ddd; border-left:1px solid #ddd;}
 * html #content{padding-right:0;}
@@ -38,7 +55,7 @@ div.modal p.buttons {text-align:left;}
 /***** Links *****/
 
 #sidebar a.selected {padding:1px 2px 2px 3px; margin-left:0px; margin-right:-2px;}
-#admin-menu a.selected {padding-left:0!important; padding-right:20px!important; background-position:right 2px 40%;}
+#admin-menu a.selected:not(:has(svg)) {padding-left:0!important; padding-right:20px!important; background-position:right 2px 40%;}
 
 a.collapsible:not(:has(svg)) {padding-left:0px; padding-right:12px; background: url(/arrow_down.png) no-repeat right 0px top 50%;}
 a.collapsible.collapsed:not(:has(svg)) {background-image: url(/arrow_left.png);}
@@ -122,7 +139,7 @@ div.projects h3 {padding-left:0px; padding-right:20px;}
 #watchers li {margin: 0px 0px 0px 2px; padding: 0px 0px 0px 0px;}
 #watchers img.gravatar {margin: 0 0 2px 4px;}
 
-span.search_for_watchers a, span.add_attachment a {padding-left:px; padding-right:16px; background: url(/bullet_add.png) no-repeat right 50%; }
+span.search_for_watchers a:not(:has(svg)), span.add_attachment a:not(:has(svg)) {padding-left:0px; padding-right:16px; background: url(/bullet_add.png) no-repeat right 50%; }
 
 div.square {float:right;}
 .contextual {float:left; padding-left:0px; padding-right:10px;}
@@ -213,7 +230,7 @@ fieldset#notified_events .parent {padding-left:0px; padding-right:20px; }
 .attachments_fields input.description {margin-left:0px; margin-right:4px;}
 
 .attachments_fields input.filename {background:url(/attachment.png) no-repeat right 1px top 50%; padding-left:0px; padding-right:18px;}
-.attachments_fields .ajax-waiting input.filename {background:url(/hourglass.png) no-repeat right top 50%;}
+.attachments_fields .ajax-waiting input.filename {background:url(/hourglass-empty.svg) no-repeat right top 50%;}
 .attachments_fields .ajax-loading input.filename {background:url(/loading.gif) no-repeat right top 50%;}
 .attachments_fields div.ui-progressbar {margin: 2px 8px -5px 0;}
 
@@ -221,7 +238,7 @@ a.remove-upload {background: url(/delete.png) no-repeat right 1px top 50%; paddi
 
 div.thumbnails div {margin-right:0px; margin-left:2px;}
 
-p.other-formats { text-align:left; }
+p.other-formats, p.query-totals { text-align:left; }
 
 a.atom { background: url(/feed.png) no-repeat right 1px top 50%; padding: 2px 16px 3px 0; }
 
@@ -231,7 +248,7 @@ table.members td.name {padding-right: 20px; padding-left:0; }
 table.members td.group, table.members td.groupnonmember, table.members td.groupanonymous {background: url(/group.png) no-repeat right 50%;}
 
 input.autocomplete {
-  background: #fff url(/magnifier.png) no-repeat right 2px top 50%; padding-left:0px !important; padding-right:20px !important;
+  background: #fff url(/search.svg) no-repeat right 2px top 50%; padding-left:0px !important; padding-right:20px !important;
 }
 
 .role-visibility {padding-right:2em; padding-left:0;}
@@ -355,6 +372,10 @@ a.wiki-anchor {margin-left:0px; margin-right:6px;}
   padding-left:0; padding-right:20px;
 }
 
+svg.icon-svg.icon-rtl {
+  transform: scaleX(-1);
+}
+
 div.issue img.gravatar {
   float: right;
   margin: 0 0 0 6px;
diff --git a/app/assets/stylesheets/wiki_syntax.css b/app/assets/stylesheets/wiki_syntax.css
index d326a3293..89b117419 100644
--- a/app/assets/stylesheets/wiki_syntax.css
+++ b/app/assets/stylesheets/wiki_syntax.css
@@ -1,19 +1,33 @@
 @font-face {
-    font-family: "Noto Sans";
-    src: url("/NotoSans-VariableFont_wdth,wght.woff2") format("woff2");
-    font-weight: 100 900;
-    font-stretch: 75% 125%;
-    font-style: normal;
-    font-display: swap;
+  font-family: "Noto Sans";
+  src: url("/NotoSans-Regular.woff2") format("woff2");
+  font-weight: 400;
+  font-style: normal;
+  font-display: swap;
 }
 
 @font-face {
-    font-family: "Noto Sans";
-    src: url("/NotoSans-Italic-VariableFont_wdth,wght.woff2") format("woff2");
-    font-weight: 100 900;
-    font-stretch: 75% 125%;
-    font-style: italic;
-    font-display: swap;
+  font-family: "Noto Sans";
+  src: url("/NotoSans-Bold.woff2") format("woff2");
+  font-weight: 700;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "Noto Sans";
+  src: url("/NotoSans-Italic.woff2") format("woff2");
+  font-weight: 400;
+  font-style: italic;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "Noto Sans";
+  src: url("/NotoSans-BoldItalic.woff2") format("woff2");
+  font-weight: 700;
+  font-style: italic;
+  font-display: swap;
 }
 
 :root {
@@ -58,3 +72,14 @@ a:hover, a:active{ color: #c61a1a; text-decoration: underline;}
 .syntaxhl .s1 { background-color: #fff0f0 }
 
 span.more_info { font-weight: normal; }
+
+.markdown-alert {
+  border-left: 4px solid;
+  padding-left: 10px;
+  margin-left: 10px;
+}
+.markdown-alert-title {
+  font-weight: bold;
+}
+.markdown-alert-note { border-color: #169; }
+.markdown-alert-note .markdown-alert-title { color: #1e40af; }
\ No newline at end of file
diff --git a/app/assets/stylesheets/wiki_syntax_detailed.css b/app/assets/stylesheets/wiki_syntax_detailed.css
index 7d7c30f53..ad3c8c65f 100644
--- a/app/assets/stylesheets/wiki_syntax_detailed.css
+++ b/app/assets/stylesheets/wiki_syntax_detailed.css
@@ -1,19 +1,33 @@
 @font-face {
-    font-family: "Noto Sans";
-    src: url("/NotoSans-VariableFont_wdth,wght.woff2") format("woff2");
-    font-weight: 100 900;
-    font-stretch: 75% 125%;
-    font-style: normal;
-    font-display: swap;
+  font-family: "Noto Sans";
+  src: url("/NotoSans-Regular.woff2") format("woff2");
+  font-weight: 400;
+  font-style: normal;
+  font-display: swap;
 }
 
 @font-face {
-    font-family: "Noto Sans";
-    src: url("/NotoSans-Italic-VariableFont_wdth,wght.woff2") format("woff2");
-    font-weight: 100 900;
-    font-stretch: 75% 125%;
-    font-style: italic;
-    font-display: swap;
+  font-family: "Noto Sans";
+  src: url("/NotoSans-Bold.woff2") format("woff2");
+  font-weight: 700;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "Noto Sans";
+  src: url("/NotoSans-Italic.woff2") format("woff2");
+  font-weight: 400;
+  font-style: italic;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "Noto Sans";
+  src: url("/NotoSans-BoldItalic.woff2") format("woff2");
+  font-weight: 700;
+  font-style: italic;
+  font-display: swap;
 }
 
 :root {
@@ -49,3 +63,23 @@ table.list td { background-color: #f5f5f5; vertical-align: middle; padding: 0.3e
 .syntaxhl .o { color: #333333 }
 .syntaxhl .s2 { background-color: #fff0f0 }
 .syntaxhl .si { background-color: #eeeeee }
+
+
+.markdown-alert {
+  border-left: 4px solid;
+  padding-left: 10px;
+  margin-left: 20px;
+}
+.markdown-alert-title {
+  font-weight: bold;
+}
+.markdown-alert-tip { border-color: #5db651; }
+.markdown-alert-tip .markdown-alert-title { color: #005f00; }
+.markdown-alert-important { border-color: #800080; }
+.markdown-alert-important .markdown-alert-title { color: #4b006e; }
+.markdown-alert-caution { border-color: #c22; }
+.markdown-alert-caution .markdown-alert-title { color: #880000; }
+.markdown-alert-warning { border-color: #e4bc4b; }
+.markdown-alert-warning .markdown-alert-title { color: #a7760c; }
+.markdown-alert-note { border-color: #169; }
+.markdown-alert-note .markdown-alert-title { color: #1e40af; }
\ No newline at end of file