favorites lol

public/s/css/f0ck.css

@@ -374,6 +374,10 @@ html[theme="iced"] {
   --scroller-bg: #424242;
 }
 
+html[theme="iced"] .navbar-brand:hover {
+  background: #1d2941;
+}
+
 ::-webkit-scrollbar {
   width: 5px;
 }
@@ -983,6 +987,7 @@ a#elfe {
   display: grid;
   grid-template-columns: 1fr 1fr 1fr;
   background-color: var(--metadata-bg);
+  padding-bottom: 5px;
 }
 
 #themeselector {
@@ -1137,6 +1142,11 @@ span#tags:empty {
     opacity: 0.6;
     transition: .2s ease-in-out;
   }
+
+  span#favs {
+    grid-column: 1/3!important;
+  }
+
 }
 
 .post_source {
@@ -1247,7 +1257,7 @@ span#tags > span {
   margin-bottom: 2.5px;
 }
 
-span#tags > span > input {
+input {
   padding: 0;
   margin: 0;
   border: none;
@@ -1491,6 +1501,14 @@ svg.iconset {
 /* favorites */
 span#favs {
   text-align: left;
-  margin-left: 10px;
+  margin-left: 0;
   grid-column: 1/4;
+  padding: 5px;
+  margin: 5px;
+  line-height: 0;
+  background: var(--badge-bg);
+  border: 1px solid var(--black);
+}
+#favs > a img {
+  border: 2px solid var(--accent);
 }

public/s/js/admin.js

@@ -81,7 +81,6 @@ const flash = ({ type, msg }) => {
       _tags.reverse().forEach(tag => {
         const a = document.createElement("a");
         a.href = `/tag/${tag.tag}`;
-        a.target = "_blank";
         a.style = "color: inherit !important";
         a.innerHTML = tag.tag;
 
@@ -207,7 +206,23 @@ const flash = ({ type, msg }) => {
 
         // span#favs
         const favcontainer = document.querySelector('span#favs');
-        favcontainer.innerHTML = "favorites:" + JSON.stringify(Object.values(res.favs));
+        favcontainer.innerHTML = "";
+
+        res.favs.forEach(f => {
+          const a = document.createElement('a');
+          a.href = `/user/${f.user}/favs`;
+          a.setAttribute('tooltip', f.user);
+          a.setAttribute('flow', 'down');
+
+          const img = document.createElement('img');
+          img.src = `/t/${f.avatar}.png`;
+          img.style.height = "32px";
+          img.style.width = "32px";
+
+          a.insertAdjacentElement('beforeend', img);
+          favcontainer.insertAdjacentElement('beforeend', a);
+          favcontainer.innerHTML += " ";
+        });
       }
       else {
         // lul

views/item.html

@@ -77,11 +77,9 @@
       </span>
       <span class="badge" id="favs">
       @if(item.favorites.length && session)
-      favorites:
       @each(item.favorites as fav)
-      <a href="/user/{{ fav.user.toLowerCase() }}/f0cks" title="{{ fav.user }}"><img src="@if(fav.avatar)/t/{{ fav.avatar }}@else/s/img/default@endif.png" style="height: 32px; width: 32px" /></a>
+      <a href="/user/{{ fav.user.toLowerCase() }}/favs" tooltip="{{ fav.user }}" flow="down"><img src="@if(fav.avatar)/t/{{ fav.avatar }}@else/s/img/default@endif.png" style="height: 32px; width: 32px" /></a>
       @endeach
-      <small>bimde designe mich</small>
       @endif
       </span>
     </div>

views/settings.html

@@ -1,5 +1,6 @@
 @include(snippets/header)
 <h1>Settings</h1>
+@if(session.avatar)<img src="/t/{{ session.avatar }}.png" />@endif
 <h2>Account</h2>
 <table class="table">
   <tbody>
@@ -15,6 +16,10 @@
       <td>username</td>
       <td>{!! session.user !!}</td>
     </tr>
+    <tr>
+      <td>avatar</td>
+      <td><input type="number" class="input" value="{{ session.avatar }}" /><input type="submit" value="save" /></td>
+    </tr>
   </tbody>
 </table>
 <h2>Sessions</h2>

views/snippets/navbar.html

@@ -10,7 +10,7 @@
         <ul class="dropdown-menu">
           <li><a href="/admin">adminpanel</a></li>
           <li><a href="/user/{{ session.user.toLowerCase() }}/f0cks">my f0cks</a></li>
-          <li><a href="#">my favs</a></li>
+          <li><a href="/user/{{ session.user.toLowerCase() }}/favs">my favs</a></li>
           <li><a href="/settings">settings</a></li>
           <li><a href="/about">About</a></li>
           <li><a href="/ranking">Ranking</a></li>