Merge branch 'feature/ISTWCMS-7250-kpaxman-info_bar_update' into '1.0.x'

Feature/istwcms 7250 kpaxman info bar update

See merge request !45

css/uw_dashboard.css

@@ -15,3 +15,45 @@
   float: right;
   margin-bottom: 0.2rem;
 }
+
+.dashboard__site-info details {
+  display: inline-block;
+  position: relative;
+  margin: 0;
+  padding: 0;
+}
+
+.dashboard__site-info summary {
+  cursor: help;
+  list-style: none;
+  border-bottom: 1px black dashed;
+  text-transform: none;
+  padding: 0;
+  font-weight: normal;
+}
+
+.dashboard__site-info summary::-webkit-details-marker {
+  display: none;
+}
+
+.dashboard__site-info .info {
+  position: absolute;
+  right: -1rem;
+  border: 1px solid var(--uw-black);
+  background: #f5f5f2;
+  margin-top: 3px;
+  padding: 10px;
+  width: 20ch;
+  z-index: 1;
+}
+
+.dashboard__site-info .info p {
+  margin: 0;
+}
+
+.dashboard__site-info .more {
+  text-align: right;
+  padding-top: 10px;
+  font-size: 90%;
+  text-wrap: balance;
+}

js/uw_dashboard.js

+document.addEventListener('click', function (event) {
+  const detailsElements = document.querySelectorAll('details[name="uw-roles"]');
+  detailsElements.forEach(details => {
+    if (!details.contains(event.target)) {
+      details.removeAttribute('open');
+    }
+  });
+});

uw_dashboard.libraries.yml

@@ -5,3 +5,5 @@ uw-styles:
   css:
     theme:
       css/uw_dashboard.css: {}
+  js:
+    js/uw_dashboard.js: {}

uw_dashboard.module

@@ -137,10 +137,17 @@ function uw_dashboard_preprocess_page(&$variables) {
     if (!$user_list) {
       $user_list[] = 'not set';
     }
-    $string .= ' • Website lead';
+    $string .= ' &bull; <details name="uw-roles"><summary>';
+    $string .= 'Website lead';
     if (count($user_list) > 1) {
       $string .= 's';
     }
+    $string .= '</summary>';
+    $string .= '<div class="info">
+      <p>The website lead is the main contact for this site. Contact them regarding planning any major revisions or issues.</p>
+      <p class="more"><a href="https://uwaterloo.atlassian.net/wiki/spaces/WCMSKB/pages/44544262271/Website+lead">more details on the website lead role</a></p>
+    </div>';
+    $string .= '</details>';
     $string .= ': ' . implode(', ', $user_list);
 
     // Get the site owner(s).
@@ -158,10 +165,17 @@ function uw_dashboard_preprocess_page(&$variables) {
     if (!$user_list) {
       $user_list[] = 'not set';
     }
-    $string .= ' &bull; Site owner';
+    $string .= ' &bull; <details name="uw-roles"><summary>';
+    $string .= 'Site owner';
     if (count($user_list) > 1) {
       $string .= 's';
     }
+    $string .= '</summary>';
+    $string .= ' <div class="info">
+      <p>The site owner manages roles, permissions, as well as other high-level functions.</p>
+      <p class="more"><a href="https://uwaterloo.atlassian.net/wiki/spaces/WCMSKB/pages/44543934612/Site+owner+role">more details on the site owner role</a></p>
+    </div>';
+    $string .= '</details>';
     $string .= ': ' . implode(', ', $user_list);
 
     // Get the site owner(s).