Change name to section-links and added pointer effect

ukhsa-collaboration · Sep 3, 2024 · e2acc29 · e2acc29
1 parent a600298
commit e2acc29
Show file tree

Hide file tree

Showing 3 changed files with 10 additions and 7 deletions.
diff --git a/docs/_layouts/guidance-page.html b/docs/_layouts/guidance-page.html
@@ -25,7 +25,7 @@
 
     <!--Scripts-->
     <script src="assets/scripts/expandable-sections.js"></script>
-    <script src="assets/scripts/permalinks.js" defer></script>
+    <script src="assets/scripts/section-links.js" defer></script>
 
   </head>
   <body>

diff --git a/docs/assets/scripts/permalinks.js → docs/assets/scripts/section-links.js b/docs/assets/scripts/permalinks.js → docs/assets/scripts/section-links.js
@@ -1,7 +1,7 @@
 // Function to copy link to clipboard
 function copylink(text) {
     navigator.clipboard.writeText(text).then(() => {
-        alert(`Link copied to clipboard: ${text}`);
+        alert(`Link copied to clipboard:\n${text}`);
     }).catch(err => {
         console.error('Failed to copy link', err);
     });
@@ -16,8 +16,8 @@ document.querySelectorAll('h1, h2, h3, h4, h5').forEach(heading => {
 
     // Create the icon element
     const iconWrapper = document.createElement('span');
-    iconWrapper.className = 'permalink';
-    iconWrapper.title = 'Permalink';
+    iconWrapper.className = 'section-link';
+    iconWrapper.title = 'Section link';
     iconWrapper.innerHTML = ' ';
 
     // Append the icon to the heading

diff --git a/docs/assets/styles.css b/docs/assets/styles.css
@@ -143,8 +143,8 @@ ul, ol{
 }
 
 
-/*Permalinks*/
-.permalink{
+/*Section links*/
+.section-link{
   background-image: url('img/permalink.png');
   width: 18px;
   height: 18px;
@@ -154,6 +154,10 @@ ul, ol{
   background-size: cover;
 }
 
+.section-link:hover{
+  cursor: pointer;
+}
+
 h1 span, h2 span, h3 span, h4 span, h5 span {
   transition: opacity 0.3s ease-in-out;
 }
@@ -163,7 +167,6 @@ h1:hover span, h2:hover span, h3:hover span, h4:hover span, h5:hover span{
 }
 
 
-
 /*Fancy elements*/
 blockquote{
   margin: 1em 0 2em 0;