4444444444444443333333333333

public/s/css/f0ckm.css

@@ -3119,12 +3119,13 @@ body.layout-legacy .scroll-to-bottom svg {
 
 .comment::before {
   content: "";
+  display: var(--comment-banner-display, block);
   position: absolute;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
-  max-height: 300px;
+  max-height: var(--comment-banner-max-height, 300px);
   background-image: var(--author-banner, none);
   background-position: var(--author-banner-position, center top);
   background-size: var(--author-banner-size, cover);
@@ -8441,11 +8442,6 @@ input#s_avatar {
   opacity: 0.8;
 }
 
-
-.nav-user-btn:hover {
-  background: rgba(255, 255, 255, 0.1);
-}
-
 /* Avatar-style button variant */
 .nav-avatar-btn {
   background: none;
@@ -8460,18 +8456,13 @@ input#s_avatar {
   transition: border-color 0.2s, background 0.2s;
 }
 
-.nav-avatar-btn:hover {
-  background: rgba(255, 255, 255, 0.08);
-  border-color: rgba(255, 255, 255, 0.15);
-  transform: none;
-  box-shadow: none;
-}
-
 .nav-avatar-btn.is-active {
   background: rgba(255, 255, 255, 0.1);
   border-color: rgba(255, 255, 255, 0.15);
   border-bottom-left-radius: 0;
   border-bottom-right-radius: 0;
+  border-top-right-radius: 0;
+  border-top-left-radius: 0;   
 }
 
 .nav-avatar-btn.is-active .nav-avatar-caret {
@@ -8488,6 +8479,12 @@ input#s_avatar {
   height: 22px;
   object-fit: cover;
   flex-shrink: 0;
+  cursor: pointer;
+  transition: opacity 0.15s ease;
+}
+
+.nav-avatar-img:hover {
+  opacity: 0.8;
 }
 
 .nav-avatar-name {
@@ -8540,7 +8537,7 @@ input#s_avatar {
 
 .nav-user-menu a {
   display: block;
-  padding: 10px 15px;
+  padding: 5px 10px;
   color: var(--white);
   text-decoration: none;
   transition: background 0.2s;
@@ -8563,6 +8560,13 @@ input#s_avatar {
   }
 }
 
+#nav-user-toggle {
+  min-width: 100px;
+  text-align: left;
+  display: grid;
+  grid-template-columns: auto 1fr auto;
+}
+
 /* nav-links base: horizontal flex row on desktop */
 .nav-links {
   display: flex;

public/s/js/comments.js

@@ -2200,7 +2200,8 @@ class CommentSystem {
             }
         }
 
-        const bannerStyle = (comment.banner_file && comment.banner_file !== 'null')
+        const bannerEnabled = window.f0ckCommentBannerEnabled !== false && window.f0ckSession?.comment_banner_enabled !== false;
+        const bannerStyle = (bannerEnabled && comment.banner_file && comment.banner_file !== 'null')
             ? `style="--author-banner: url('/a/${comment.banner_file}'); --author-banner-position: ${comment.banner_position === 'center' ? 'center top' : (comment.banner_position || 'center top')}; --author-banner-size: ${comment.banner_size || 'cover'}; --author-banner-repeat: ${comment.banner_repeat || 'repeat'};"`
             : '';
 

public/s/js/f0ckm.js

@@ -846,6 +846,13 @@ window.cancelAnimFrame = (function () {
   if (userToggle && userMenu) {
     userToggle.addEventListener('click', (e) => {
       e.stopPropagation();
+      if (e.target.closest('.nav-avatar-img')) {
+        const username = window.f0ckSession?.user;
+        if (username) {
+          window.location.href = `/user/${username.toLowerCase()}`;
+          return;
+        }
+      }
       const opening = !userMenu.classList.contains('show');
       userMenu.classList.toggle('show');
       userToggle.classList.toggle('is-active', opening);
@@ -9265,6 +9272,13 @@ document.addEventListener("DOMContentLoaded", function () {
     var menu = document.getElementById(menuId);
     if (btn && menu) {
       btn.addEventListener('click', function (e) {
+        if (e.target.closest('.nav-avatar-img')) {
+          const username = window.f0ckSession?.user;
+          if (username) {
+            window.location.href = `/user/${username.toLowerCase()}`;
+            return;
+          }
+        }
         if (window.innerWidth <= 700) {
           e.preventDefault();
           menu.classList.toggle('show-mobile');

src/index.mjs

@@ -1609,6 +1609,8 @@ process.on('uncaughtException', err => {
       user_alternative_infobox: useAltInfobox,
       user_alternative_steuerung: useAltSteuerung,
       user_banner_enabled: cfg.websrv.user_banner_enabled !== false,
+      comment_banner_enabled: (cfg.websrv.user_banner_enabled !== false) && (cfg.websrv.comment_banner_enabled !== false),
+      comment_banner_max_height: typeof cfg.websrv.comment_banner_max_height === 'number' ? cfg.websrv.comment_banner_max_height : 300,
       comment_display_mode: (activeReq && activeReq.session && typeof activeReq.session.comment_display_mode === 'number')
         ? activeReq.session.comment_display_mode
         : (data && typeof data.comment_display_mode === 'number'

views/snippets/footer.html

@@ -398,6 +398,7 @@
     receive_system_notifications: @if(session)@if(session.receive_system_notifications !== false) true @else false @endif@else true @endif,
     receive_user_notifications: @if(session)@if(session.receive_user_notifications !== false) true @else false @endif@else true @endif,
     do_not_disturb: @if(session && session.do_not_disturb) true @else false @endif,
+    comment_banner_enabled: @if(comment_banner_enabled) true @else false @endif,
     comment_display_mode: {{ comment_display_mode }},
     comment_max_length: {{ comment_max_length !== null && comment_max_length !== undefined ? comment_max_length : 'null' }},
     development: @if(development) true @else false @endif,

views/snippets/header.html

@@ -23,6 +23,8 @@
     }
     @endif
     :root {
+      --comment-banner-display: @if(comment_banner_enabled) block @else none @endif;
+      --comment-banner-max-height: @if(typeof comment_banner_max_height !== 'undefined'){{ comment_banner_max_height }}px@else 300px @endif;
       --favicon-url: url('@if(custom_favicon && custom_favicon.length > 0){{ custom_favicon }}@else/s/img/favicon.gif@endif');
       @if(session && session.font)
       --font: 'CustomUserFont', monospace !important;
@@ -64,7 +66,7 @@
     @endif
     <link rel="stylesheet" href="/s/css/upload.css?v={{ ts }}">
   @endif
-  <script>window.f0ckThemes = {{ themes_json }}; window.f0ckDefaultTheme = "{{ default_theme }}"; window.f0ckDomain = "{{ domain }}"; window.f0ckGitHash = "{{ git_hash }}"; window.f0ckAllowedImages = {{ allowed_comment_images_json }}; window.f0ckEmbedYoutubeInComments = {{ embed_youtube_in_comments ? 'true' : 'false' }}; window.f0ckEnableYoutubeUpload = {{ enable_youtube_upload ? 'true' : 'false' }}; window.f0ckBrandImages = {{ custom_brand_images_json }}; window.f0ckMediaBase = "{{ paths_images }}"; window.f0ckShitpostMode = {{ shitpost_mode ? 'true' : 'false' }}; window.f0ckShitpostRequireRating = {{ shitpost_require_rating ? 'true' : 'false' }}; window.f0ckShitpostMinTags = {{ shitpost_min_tags || 0 }}; window.f0ckEnableItemTitle = {{ enable_item_title ? 'true' : 'false' }};</script>
+  <script>window.f0ckThemes = {{ themes_json }}; window.f0ckDefaultTheme = "{{ default_theme }}"; window.f0ckDomain = "{{ domain }}"; window.f0ckGitHash = "{{ git_hash }}"; window.f0ckAllowedImages = {{ allowed_comment_images_json }}; window.f0ckEmbedYoutubeInComments = {{ embed_youtube_in_comments ? 'true' : 'false' }}; window.f0ckEnableYoutubeUpload = {{ enable_youtube_upload ? 'true' : 'false' }}; window.f0ckBrandImages = {{ custom_brand_images_json }}; window.f0ckMediaBase = "{{ paths_images }}"; window.f0ckShitpostMode = {{ shitpost_mode ? 'true' : 'false' }}; window.f0ckShitpostRequireRating = {{ shitpost_require_rating ? 'true' : 'false' }}; window.f0ckShitpostMinTags = {{ shitpost_min_tags || 0 }}; window.f0ckEnableItemTitle = {{ enable_item_title ? 'true' : 'false' }}; window.f0ckCommentBannerEnabled = @if(comment_banner_enabled) true @else false @endif;</script>
   @if(!private_society || session)
   <script src="/s/js/marked.min.js" defer></script>
   <script src="/s/js/comments.js?v={{ ts }}" defer></script>

views/snippets/navbar.html

@@ -43,11 +43,11 @@
       <div class="nav-user-dropdown">
         <button class="nav-user-btn nav-avatar-btn" id="nav-user-toggle">
           @if(session.avatar_file)
-            <img class="nav-avatar-img" src="/a/{{ session.avatar_file }}" onerror="this.src='/a/default.png'">
+            <img class="nav-avatar-img" src="/a/{{ session.avatar_file }}" onerror="this.src='/a/default.png'" onclick="event.stopPropagation(); window.location.href='/user/{!! session.user.toLowerCase() !!}';" title="{{ session.user }}">
           @elseif(session.avatar && session.avatar > 0)
-            <img class="nav-avatar-img" src="/t/{{ session.avatar }}.webp" onerror="this.src='/a/default.png'">
+            <img class="nav-avatar-img" src="/t/{{ session.avatar }}.webp" onerror="this.src='/a/default.png'" onclick="event.stopPropagation(); window.location.href='/user/{!! session.user.toLowerCase() !!}';" title="{{ session.user }}">
           @else
-            <img class="nav-avatar-img" src="/a/default.png">
+            <img class="nav-avatar-img" src="/a/default.png" onclick="event.stopPropagation(); window.location.href='/user/{!! session.user.toLowerCase() !!}';" title="{{ session.user }}">
           @endif
           <span class="nav-avatar-name" id="nav-display-name" @if(session.username_color)style="color: {{ session.username_color }}"@endif>{!! session.display_name || session.user !!}</span>
           <span class="nav-avatar-caret">▾</span>