UI improvements and bug fixes (2025-03-04)
- Add shortening function to username, if username is too long (max. 6 characters).
- Change 'doc' to 'doc_start' in help button.
- Remove help button from dropdown list and add it to navbar.
- Remove headerButtonGroup and add links directly to header.html.ep.
- Remove tooltip from help button.
- Fix sidebar appearance when user navigates to /settings.
- Fix content shift for pages (due to /settings modification).
- Change fixed value for hint positioning to dynamic value.

Change-Id: I7ee84bff170c4985494895cdacd1ed77d60320db
diff --git a/dev/scss/header/header.scss b/dev/scss/header/header.scss
index a785117..32b0812 100644
--- a/dev/scss/header/header.scss
+++ b/dev/scss/header/header.scss
@@ -41,6 +41,7 @@
       -o-transition: all .2s ease-in-out;
       -moz-transition: all .2s ease-in-out;
       -webkit-transition: all .2s ease-in-out;
+      cursor: pointer;
 
       &:hover {
         background-color: $middle-green;
@@ -50,6 +51,7 @@
         display: block;
         padding: 1.5rem 1rem;
         color: $nearly-white;
+        cursor: pointer;
       }
     }
   }
@@ -72,6 +74,9 @@
     }
 
     &-btn {
+      display: flex;
+      align-items: center;
+      column-gap: $base-padding;
       height: $standard-size-and-spacing;
       padding: 1.25rem 1rem;
       color: $nearly-white;
@@ -95,9 +100,12 @@
 
       h3.user-name {
         padding-right: 2px;
-        // font-size: 85%;
         font-size: 120%;
-        display: inline;
+        display: inline-block;
+        max-width: 6ch;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
       }
     }
 
@@ -297,10 +305,10 @@
 
     &.right {
       float:   right;
-      display: inline-block;
-      >.tutorial{
-        margin-left: 10px;
-      }
+      // display: inline-block;
+      // >.tutorial{
+      //   margin-left: 10px;
+      // }
     }
 
     &.top {
diff --git a/dev/scss/media.scss b/dev/scss/media.scss
index ce23ee5..8201f8b 100644
--- a/dev/scss/media.scss
+++ b/dev/scss/media.scss
@@ -48,12 +48,16 @@
 
     .burger-icon {
       position: relative;
-      display: block !important;
+      display: none;
       width: $standard-size-and-spacing;
       height: $standard-size-and-spacing;
       font-size: 1.8rem;
       color: $nearly-white;
 
+      &.show {
+        display: block;
+      }
+
       &::after {
         position: absolute;
         top: 2rem;
@@ -145,9 +149,14 @@
 
         &.profile {
           & + .dropdown-content {
-            margin-top: 4rem;
+            margin-top: 3.9rem;
           }
         }
+
+        h3.user-name {
+          max-width: unset;
+          overflow: unset;
+        }
       }
 
       &-content {