Adding polticis and news to banned content

adding class to span element for css identification purposes

config_example.json

@@ -5,6 +5,7 @@
       "domain": "f0ck.dev",
       "regex": "f0ck\\.dev"
     },
+    "socks": "",
     "maxfilesize": 83886080,
     "adminmultiplier": 3.5,
     "ignored": [

debug/thumbnailer.mjs

@@ -32,7 +32,7 @@ for(let item of items) {
     if(mime.startsWith('video/') || mime == 'image/gif')
       await exec(`ffmpegthumbnailer -i./public/b/${filename} -s1024 -o./tmp/${itemid}.png`);
     else if(mime.startsWith('image/') && mime != 'image/gif')
-      await exec(`magick ./public/b/${filename} ./tmp/${itemid}.png`);
+      await exec(`convert ./public/b/${filename} ./tmp/${itemid}.png`);
     else if(mime.startsWith('audio/')) {
       if(link.match(/soundcloud/)) {
         let cover = (await exec(`yt-dlp --get-thumbnail "${link}"`)).stdout.trim();
@@ -42,8 +42,8 @@ for(let item of items) {
             await exec(`wget "${cover}" -O ./tmp/${itemid}.jpg`);
             const size = (await fs.promises.stat(`./tmp/${itemid}.jpg`)).size;
             if(size >= 0) {
-              await exec(`magick ./tmp/${itemid}.jpg ./tmp/${itemid}.png`);
+              await exec(`convert ./tmp/${itemid}.jpg ./tmp/${itemid}.png`);
-              await exec(`magick ./tmp/${itemid}.jpg ./public/ca/${itemid}.webp`);
+              await exec(`convert ./tmp/${itemid}.jpg ./public/ca/${itemid}.webp`);
             }
           } catch(err) {
             //console.log(err);
@@ -51,21 +51,21 @@ for(let item of items) {
         }
         else {
           await exec(`ffmpeg -i ./public/b/${filename} -update 1 -map 0:v -map 0:1 -c copy ./tmp/${itemid}.png`);
-          await exec(`magick ./tmp/${itemid}.png ./public/ca/${itemid}.webp`);
+          await exec(`convert ./tmp/${itemid}.png ./public/ca/${itemid}.webp`);
         }
       }
       else {
         await exec(`ffmpeg -i ./public/b/${filename} -update 1 -map 0:v -map 0:1 -c copy ./tmp/${itemid}.png`);
-        await exec(`magick ./tmp/${itemid}.png ./public/ca/${itemid}.webp`);
+        await exec(`convert ./tmp/${itemid}.png ./public/ca/${itemid}.webp`);
       }
     }
 
-    await exec(`magick "./tmp/${itemid}.png" -resize "128x128^" -gravity center -crop 128x128+0+0 +repage ./public/t/${itemid}.webp`);
+    await exec(`convert "./tmp/${itemid}.png" -resize "128x128^" -gravity center -crop 128x128+0+0 +repage ./public/t/${itemid}.webp`);
     await fs.promises.unlink(`./tmp/${itemid}.png`).catch(err => {});
     await fs.promises.unlink(`./tmp/${itemid}.jpg`).catch(err => {});
   } catch(err) {
     //console.log(err);
-    await exec(`magick ./mugge.png ./public/t/${itemid}.webp`);
+    await exec(`convert ./mugge.png ./public/t/${itemid}.webp`);
   }
   console.log(`current: ${itemid} (${count} / ${total})`);
   count++;
@@ -76,7 +76,7 @@ for(let item of items) {
     const itemid = item.id;
     const filename = item.dest;
     await exec(`ffmpegthumbnailer -i./public/b/${filename} -s1024 -o./debug/tmp/${itemid}`);
-    await exec(`magick "./debug/tmp/${itemid}" -resize "128x128^" -gravity center -crop 128x128+0+0 +repage ./public/t/${itemid}.png`);
+    await exec(`convert "./debug/tmp/${itemid}" -resize "128x128^" -gravity center -crop 128x128+0+0 +repage ./public/t/${itemid}.png`);
     await fs.unlink(`./debug/tmp/${itemid}`);
     console.log(`current: ${itemid} (${count} / ${total})`);
   } catch(err) {}

f0ck.sql

@@ -422,7 +422,6 @@ CREATE TABLE public.user_sessions (
     browser character varying(255) NOT NULL,
     created_at integer NOT NULL,
     last_used integer NOT NULL,
-    last_action character varying(255) NOT NULL,
     kmsi smallint DEFAULT '0'::smallint NOT NULL
 );
 

public/s/css/f0ck.css

@@ -72,7 +72,7 @@ html[theme='p1nk'] {
   --black: #000;
   --white: #fff;
   --gray: #262626;
-  --nav-bg: #201f1f;
+  --nav-bg: #2b2b2b;
   --nav-brand-border: inset 1px #242424;
   --nav-brand-bg: #171717;
   --navigation-links-bg: #201f1f;
@@ -463,6 +463,10 @@ html[theme="paper"] .login-form button[type="submit"] {
   color: black;
 }
 
+html[theme="paper"] .btn.disabled {
+  text-shadow: 1px 1px 3px;
+}
+
 html[theme="atmos"] {
   --accent: #1fb2b0;
   --bg: #161618;
@@ -581,10 +585,6 @@ html[theme="term"] span#favs {
   border: 1px solid var(--black);
 }
 
-html[theme="term"] .metadata {
-  text-shadow: 0px 0px 1px var(--accent), 1px 0px 2px var(--accent), 0px 0px 5px var(--black);
-}
-
 html[theme="term"] .metadata>.badge-dark,
 #themeselector {
   box-shadow: var(--pagination-anchor-box-shadow);
@@ -1618,10 +1618,9 @@ span.placeholder {
 }
 
 @media (max-width: 1325px) {
-/* ranking page - idea */
+  .ranking {
-  /* .ranking {
     grid-template-columns: 1fr 1fr !important;
-  } */
+  }
 
   .by-user,
   .by-stats,
@@ -2402,7 +2401,7 @@ table.table tbody tr:nth-of-type(odd) {
 .ranking {
   display: grid;
   grid-template-columns: auto;
-  /* justify-content: center; */
+  justify-content: center;
 }
 
 .ranking div {
@@ -2415,15 +2414,15 @@ table.table tbody tr:nth-of-type(odd) {
 }
 
 .by-user {
-  grid-row: 1;
+  grid-column: 1;
 }
 
 .by-stats {
-  grid-row: 3;
+  grid-column: 3;
 }
 
 .by-hoster {
-  grid-row: 2;
+  grid-column: 2;
 }
 
 /* tags */
@@ -3017,7 +3016,134 @@ input#s_avatar {
 #s_avatar:hover {
   background: #ffffff0f;
 }
-.theforceofthree {
+
+/* nav ↓ (mobile) */ 
+@media (max-width: 768px) {
+    body {
         display: grid;
-  grid-template-columns: 0.4fr 1fr 0.4fr;
+        grid-template-rows: 1fr auto;
+        height: 100%;
+    }
+
+    .navbar.navbar-expand-lg {
+        grid-row-start: 2;
+        position: sticky;
+        bottom: 0;
+    }
+
+    .nav-link .user span {
+        visibility: hidden;
+    }
+
+    .navbar-nav {
+        display: grid !important;
+        grid-template-rows: 1fr;
+        grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
+        grid-gap: 0.25em;
+    }
+
+    .dropdown-menu {
+        position: absolute;
+        bottom: 30px;
+        top: unset;
+    }
+
+    .navbar-brand {
+        line-height: 1.5;
+    }
+
+    .navUserName {
+      display: none;
+    }
+
+    .container {
+      padding-top: 15px;
+      padding-bottom: 3em;
+      padding-left: 15px;
+      padding-right: 15px;
+    }
+
+    html {
+      height: 100%;
+    }
+
+    .err {
+      margin: unset;
+      width: unset;
+    }
+
+    .dropdown-menu {
+      list-style: none;
+      padding: 0;
+      min-width: 25vw;
+      border-left: 1px solid;
+      border-right: 1px solid;
+      border-bottom: 1px solid;
+      border-top: 1px solid;
+      border-color: var(--black);
+      margin-bottom: 0;
+      text-align: left;
+      box-shadow: 2px 3px 5px var(--black);
+    }
+
+    .dropdown-menu li {
+      padding-left: 6px;
+    }
+
+    .nav-link {
+      border-radius: 0;
+    }
+
+    .metadata {
+      grid-template-columns: auto;
+  }
+
+    button[data-skip="-10"] {
+      display: none;
+    }
+
+    button[data-skip="10"] {
+      display: none;
+    }
+
+    .v0ck_player_button {
+      font-family: monospace;
+      font-size: 12px;
+    }
+
+    tr {
+      display: grid;
+      grid-template-columns: auto 1fr;
+    }
+
+    tbody td {
+      box-shadow: none;
+    }
+  
+    table tr td:nth-child(4) {
+      color: yellow;
+      font-size: xx-large;
+      font-family: 'VCR';
+      justify-content: center;
+      align-items: center;
+      align-self: center;
+    }
+  
+    td:nth-child(1) {
+      grid-column: 1;
+    }
+  
+    td:nth-child(2) {
+      grid-column: 2;
+      grid-row: 2;
+    }
+  
+    td:nth-child(3) {
+      grid-column: 2;
+      grid-row: 1;
+    }
+  
+    td:nth-child(4) {
+      grid-column: 3;
+    }
 }

public/s/js/f0ck.js

@@ -219,16 +219,6 @@ window.requestAnimFrame = (function(){
           elem = document.querySelector(".pagination > .prev:not(.disabled)");
       }
     }
-    else {
-      if(Math.abs(swipeRT.yDiff) > swipeOpt.treshold && timeDiff < swipeOpt.timeout) {
-        if(navbar = document.querySelector("nav.navbar") && document.querySelector("div.posts")) {
-          if(swipeRT.yDiff > 0 && (window.innerHeight + window.scrollY) >= document.body.offsetHeight) // up
-            elem = document.querySelector(".pagination > .next:not(.disabled)");
-          else if(swipeRT.yDiff <= 0 && window.scrollY <= 0 && document.querySelector("div.posts")) // down
-            elem = document.querySelector(".pagination > .prev:not(.disabled)");
-        }
-      }
-    }
 
     swipeRT.xDown = null;
     swipeRT.yDown = null;

src/inc/queue.mjs

@@ -62,7 +62,7 @@ export default new class queue {
     if(mime.startsWith('video/') || mime == 'image/gif')
       await this.exec(`ffmpegthumbnailer -i./public/b/${filename} -s1024 -o./tmp/${itemid}.png`);
     else if(mime.startsWith('image/') && mime != 'image/gif')
-      await this.exec(`magick "./public/b/${filename}[0]" ./tmp/${itemid}.png`);
+      await this.exec(`convert "./public/b/${filename}[0]" ./tmp/${itemid}.png`);
     else if(mime.startsWith('audio/')) {
       if(link.match(/soundcloud/)) {
         let cover = (await this.exec(`yt-dlp -f 'bv*[height<=720]+ba/b[height<=720] / wv*+ba/w' --get-thumbnail "${link}"`)).stdout.trim();
@@ -72,23 +72,23 @@ export default new class queue {
             await this.exec(`wget "${cover}" -O ./tmp/${itemid}.jpg`);
             const size = (await fs.promises.stat(`./tmp/${itemid}.jpg`)).size;
             if(size >= 0) {
-              await this.exec(`magick ./tmp/${itemid}.jpg ./tmp/${itemid}.png`);
+              await this.exec(`convert ./tmp/${itemid}.jpg ./tmp/${itemid}.png`);
-              await this.exec(`magick ./tmp/${itemid}.jpg ./public/ca/${itemid}.webp`);
+              await this.exec(`convert ./tmp/${itemid}.jpg ./public/ca/${itemid}.webp`);
             }
           } catch(err) {}
         }
         else {
           await this.exec(`ffmpeg -i ./public/b/${filename} -update 1 -map 0:v -map 0:1 -c copy ./tmp/${itemid}.png`);
-          await this.exec(`magick ./tmp/${itemid}.png ./public/ca/${itemid}.webp`);
+          await this.exec(`convert ./tmp/${itemid}.png ./public/ca/${itemid}.webp`);
         }
       }
       else {
         await this.exec(`ffmpeg -i ./public/b/${filename} -update 1 -map 0:v -map 0:1 -c copy ./tmp/${itemid}.png`);
-        await this.exec(`magick ./tmp/${itemid}.png ./public/ca/${itemid}.webp`);
+        await this.exec(`convert ./tmp/${itemid}.png ./public/ca/${itemid}.webp`);
       }
     }
 
-    await this.exec(`magick "./tmp/${itemid}.png" -resize "128x128^" -gravity center -crop 128x128+0+0 +repage ./public/t/${itemid}.webp`);
+    await this.exec(`convert "./tmp/${itemid}.png" -resize "128x128^" -gravity center -crop 128x128+0+0 +repage ./public/t/${itemid}.webp`);
     await fs.promises.unlink(`./tmp/${itemid}.png`).catch(_=>{});
     await fs.promises.unlink(`./tmp/${itemid}.jpg`).catch(_=>{});
     return true;

src/inc/routes/admin.mjs

@@ -31,11 +31,11 @@ export default (router, tpl) => {
       return res.reply({ body: "user doesn't exist or wrong password" });
     const stamp = ~~(Date.now() / 1e3);
 
-    await db`
+    /*await db`
       delete from user_sessions
-      where last_action <= ${(Date.now() - 6048e5)}
+      where last_used <= ${(Date.now() - 6048e5)}
       and kmsi = 0
-    `;
+    `;*/
   
     const session = lib.md5(lib.createID());
     const blah = {
@@ -44,13 +44,12 @@ export default (router, tpl) => {
       browser: req.headers["user-agent"],
       created_at: stamp,
       last_used: stamp,
-      last_action: "/login",
       kmsi: typeof req.post.kmsi !== 'undefined' ? 1 : 0
     };
 
     await db`
       insert into "user_sessions" ${
-        db(blah, 'user_id', 'session', 'browser', 'created_at', 'last_used', 'last_action', 'kmsi')
+        db(blah, 'user_id', 'session', 'browser', 'created_at', 'last_used', 'kmsi')
       }
     `;
 

src/inc/routes/index.mjs

@@ -10,7 +10,7 @@ const auth = async (req, res, next) => {
 };
 
 export default (router, tpl) => {
-  router.get(/\/user\/(?<user>.*)/, async (req, res) => {
+  router.get(/\/user\/(?<user>.*)/, lib.loggedin, async (req, res) => {
     const user = decodeURIComponent(req.params.user);
 
     const query = await db`
@@ -82,6 +82,9 @@ export default (router, tpl) => {
 
   router.get(/^\/?(?:\/tag\/(?<tag>.+?))?(?:\/user\/(?<user>.+?)\/(?<mode>f0cks|favs))?(?:\/(?<mime>image|audio|video))?(?:\/p\/(?<page>\d+))?(?:\/(?<itemid>\d+))?$/, async (req, res) => {
     const mode = req.params.itemid ? 'item' : 'index';
+    if(mode === 'item' && !req.session)
+      return res.redirect('/login');
+    
     const data = await (req.params.itemid ? f0cklib.getf0ck : f0cklib.getf0cks)({
       user: req.params.user,
       tag: req.params.tag,

src/inc/routes/random.mjs

@@ -1,8 +1,9 @@
 import cfg from "../../inc/config.mjs";
+import lib from "../lib.mjs";
 import f0cklib from "../routeinc/f0cklib.mjs";
 
 export default (router, tpl) => {
-  router.get(/^\/random$/, async (req, res) => {
+  router.get(/^\/random$/, lib.loggedin, async (req, res) => {
     let referer = req.headers.referer ?? '';
     let opts = {};
 

src/inc/trigger/parser.mjs

@@ -73,7 +73,7 @@ export default async bot => {
           // is instagram
           try {
             // @flummi -> is there a variable for the actual work directory so it doesn't have to be hardcoded?
-            const meta = JSON.parse((await queue.exec(`yt-dlp -f 'bv*[height<=720]+ba/b[height<=720] / wv*+ba/w' --skip-download --dump-json "${link}"`)).stdout);
+            const meta = JSON.parse((await queue.exec(`yt-dlp --proxy ${cfg.main.socks} -f 'bv*[height<=720]+ba/b[height<=720] / wv*+ba/w' --skip-download --dump-json "${link}"`)).stdout);
             ext = meta.ext;
           } catch(err) {
             const tmphead = (await fetch(link, { method: "HEAD" })).headers["content-type"];
@@ -88,7 +88,7 @@ export default async bot => {
         else {
           // is not instagram
           try {
-            const meta = JSON.parse((await queue.exec(`yt-dlp -f 'bv*[height<=720]+ba/b[height<=720] / wv*+ba/w' --skip-download --dump-json "${link}"`)).stdout);
+            const meta = JSON.parse((await queue.exec(`yt-dlp --proxy ${cfg.main.socks} -f 'bv*[height<=720]+ba/b[height<=720] / wv*+ba/w' --skip-download --dump-json "${link}"`)).stdout);
             ext = meta.ext;
           } catch(err) {
             const tmphead = (await fetch(link, { method: "HEAD" })).headers["content-type"];
@@ -112,7 +112,7 @@ export default async bot => {
         if(link.match(regex.instagram)) {
           try {
             // add --cookies <path-to-cookies-file> on local instance if you want to avoid getting rate limited
-            source = (await queue.exec(`yt-dlp -f 'bv*[height<=720]+ba/b[height<=720] / wv*+ba/w' "${link}" --max-filesize ${maxfilesize / 1024}k --postprocessor-args "ffmpeg:-bitexact" -o "./tmp/${uuid}.%(ext)s" --print after_move:filepath --merge-output-format "mp4"`)).stdout.trim();
+            source = (await queue.exec(`yt-dlp --proxy ${cfg.main.socks} -f 'bv*[height<=720]+ba/b[height<=720] / wv*+ba/w' "${link}" --max-filesize ${maxfilesize / 1024}k --postprocessor-args "ffmpeg:-bitexact" -o "./tmp/${uuid}.%(ext)s" --print after_move:filepath --merge-output-format "mp4"`)).stdout.trim();
           } catch(err) {
             if(e.type == 'tg')
               return await e.editMessageText(msg.result.chat.id, msg.result.message_id, "instagram dl error");
@@ -122,7 +122,8 @@ export default async bot => {
         else if(link.match(regex.imgur)) {
           // imghure via torsocks
           try {
-            await queue.exec(`torsocks wget ${link} -O ./tmp/${uuid}.${ext}`);
+            //await queue.exec(`torsocks wget ${link} -O ./tmp/${uuid}.${ext}`);
+            await queue.exec(`curl -x ${cfg.main.socks} ${link} --output ./tmp/${uuid}.${ext}`);
             source = `./tmp/${uuid}.${ext}`;
           } catch(err) {
             console.error('err:', err);
@@ -133,7 +134,7 @@ export default async bot => {
         }
         else {
           try {
-            source = (await queue.exec(`yt-dlp -f 'bv*[height<=720]+ba/b[height<=720] / wv*+ba/w' "${link}" --max-filesize ${maxfilesize / 1024}k --postprocessor-args "ffmpeg:-bitexact" -o "./tmp/${uuid}.%(ext)s" --print after_move:filepath --merge-output-format "mp4"`)).stdout.trim();
+            source = (await queue.exec(`yt-dlp --proxy ${cfg.main.socks} -f 'bv*[height<=720]+ba/b[height<=720] / wv*+ba/w' "${link}" --max-filesize ${maxfilesize / 1024}k --postprocessor-args "ffmpeg:-bitexact" -o "./tmp/${uuid}.%(ext)s" --print after_move:filepath --merge-output-format "mp4"`)).stdout.trim();
           } catch(err) {
             console.error('err:', err);
             if(e.type == 'tg')
@@ -247,7 +248,7 @@ export default async bot => {
         try {
           await queue.genThumbnail(filename, mime, itemid, link);
         } catch(err) {
-          await queue.exec(`magick ./mugge.png ./public/t/${itemid}.webp`);
+          await queue.exec(`convert ./mugge.png ./public/t/${itemid}.webp`);
         }
 
         let speed = lib.calcSpeed(size, end);

src/index.mjs

@@ -94,9 +94,8 @@ process.on('unhandledRejection', err => {
         update "user_sessions" set ${
           db({
             last_used: ~~(Date.now() / 1e3),
-            last_action: req.url.pathname,
             browser: req.headers['user-agent']
-          }, 'last_used', 'last_action', 'browser')
+          }, 'last_used', 'browser')
         }
         where id = ${+user[0].sess_id}
       `;

views/about.html

@@ -26,7 +26,7 @@
     <ul>
       <li>You must be 18 years or older to visit or post</li>
       <li>You shall not post animal cruelty, we like our animals alive and well, living a happy life until they are ready for our Schnitzel!</li>
-      <li>You shall not post under <b>ANY</b> circumstances: Snuff, Beastiality, Rape, Terrorist stuff (Beheadings, First person shootings, warcrimes), Childporn, Childmodeling</li>
+      <li>You shall not post under <b>ANY</b> circumstances: Snuff, Beastiality, Rape, Terrorist stuff (Beheadings, First person shootings, warcrimes), Politics, News, Childporn, Childmodeling</li>
     </ul>
     <h5>f0cked up?</h5>
     <p>To have something removed in case you accidentally f0cked something that actually shouldn't be f0cked you can always contact the admins either via IRC or Email</p>
@@ -38,11 +38,6 @@
     <p>f0ck is developed and tested for Firefox and Chromium in their latest versions</p>
     <p>If you encounter bugs please report them so we can fix them.</p>
     <p>Microsoft Edgy is not actively supported, but if it werks, great! Same for anything apple related.</p>
-    <h5>Tinfoil f0ckers listen!</h5>
-    <p>f0ck onions and moons, but fockulite!</p>
-    <p>http://fockmoonsb24iczs7odozzy5uktlzbcgp337nabrgffzxv5ihabgpvyd.onion</p>
-    <p>http://fockulite74atso2xsxxw6q2gzqrgck572tiwvkyf5vdxictjn2vmlyd.onion</p>
-    <p>f0ck is completely functional without javascript enabled, you can be the beardiest neckbeard of all, we got you m'gentleman, if you want to use a custom theme you gotta allow our style cookie.</p>
     <h5>f0ck Privacy?</h5>
     <p>Cookies: Yes, we set 1 cookie for your prefered stylesheet, this is a optional cookie and not required for the site to function, simply cosmetics, you can block this cookie and the site will still work as intended and will default to the default f0ck theme called "f0ck"</p>
     <p>Logs: We do not log users accessing our website.</p>

views/admin/sessions.html

@@ -10,7 +10,6 @@
     <td>browser</td>
     <td>created_at</td>
     <td>last_used</td>
-    <td>last_action</td>
   </tr>
   </thead>
   <tbody>
@@ -23,7 +22,6 @@
     <td>{{ session.browser }}</td>
     <td>{{ new Date(session.created_at * 1e3).toLocaleString("de-DE") }}</td>
     <td>{{ new Date(session.last_used * 1e3).toLocaleString("de-DE") }}</td>
-    <td>{{ session.last_action }}</td>
   </tr>
   @endeach
   </tbody>

views/login.html

@@ -9,7 +9,7 @@
   <body type="login">
     <form class="login-form" method="post" action="/login">
       <p><a href="/"><img src="/s/img/f0ck_small.png" /></a></p>
-      <input type="text" name="username" placeholder="username" autocomplete="off" required />
+      <input type="text" name="username" placeholder="username" autocomplete="off" autofocus required />
       <input type="password" name="password" placeholder="password" autocomplete="off" required />
       <p><input type="checkbox" id="kmsi" name="kmsi" /> <label for="kmsi">stay signed in</label></p>
       <button type="submit">Login</button>

views/ranking.html

@@ -1,21 +1,12 @@
 @include(snippets/header)
 <div id="main">
   <div class="topf0ckers">
-    <h3>f0ck Rankings?</h3>
+    <h3>Top f0ckers of all time <br>- Ranking -</h3>
-  </div>
-  <div class="theforceofthree">
-    <div class="triin">
   </div>
   <div class="ranking">
     <div class="by-user">
       <h3>Biggest taggers</h3>
       <table class="table">
-          <tr>
-            <th>Rank</th>
-            <th>Avatar</th>
-            <th>Username</th>
-            <th>Tagged</th>
-          </tr>
         <tbody>
         @for(let i = 0; i < list.length; i++)
           <tr>
@@ -56,8 +47,5 @@
       </table>
     </div>
   </div>
-    <div class="triout">
-    </div>
-</div>
 </div>
 @include(snippets/footer)

views/snippets/navbar.html

@@ -5,7 +5,7 @@
       <ul class="navbar-nav">
         <li class="nav-item dropdown">
           <a class="nav-link user" href="#" content="{{ session.user }}" data-toggle="dropdown">
-            <img src="@if(session.avatar)/t/{{ session.avatar }}.webp@else/s/img/ava/default.png@endif" class="avatar"><span>@if(session.admin)&#11088;&nbsp;@endif{{ session.user }}</span>
+            <img src="@if(session.avatar)/t/{{ session.avatar }}.webp@else/s/img/ava/default.png@endif" class="avatar"><span class="navUserName">@if(session.admin)&#11088;&nbsp;@endif{{ session.user }}</span>
           </a>
           <ul class="dropdown-menu">
             <li><a href="/user/{{ session.user.toLowerCase() }}">my profile</a></li>