diff --git a/docs/asset/style.css b/docs/asset/style.css
index f51b363..93bd222 100644
--- a/docs/asset/style.css
+++ b/docs/asset/style.css
@@ -421,15 +421,16 @@ article:hover .article-linktitle {
   margin-right: var(--size-grid-gutter);
 }
 .article-type {
-  width: calc(var(--size-font-bodytypes)*2);
   color: var(--color-item);
   padding-bottom: var(--size-grid-gutter);
-  font-size: var(--size-font-bodytypes);
   padding-top: var(--size-grid-gutter);
+  font-size: var(--size-font-bodytypes);
   vertical-align: top;
   text-align: center;
   float: right;
   text-decoration: none;
+  width: 30px;
+  padding-left: 10px;
 }
 .article-image .article-typeicon {
   display: none;
@@ -574,7 +575,7 @@ article:hover .textIcon {
   left: 0;
   top: 0;
   /* content */
-  display: flex;
+  display: none;
   align-items: center;
   justify-content: center;
   user-select: none;
diff --git a/docs/content/settings.js b/docs/content/settings.js
index 3eda02c..3e5674e 100644
--- a/docs/content/settings.js
+++ b/docs/content/settings.js
@@ -12,6 +12,7 @@ const SETTINGS =
 	SHOWDATE: true,
 	SHOWAUTH: true,
 	SHOWTYPE: true,
+	SHOWDONE: true,
 	SHOWLINK: true,
 	SHOWLOWER: true,
 	SHOWTAGS: true,
diff --git a/docs/logic/view/grid.js b/docs/logic/view/grid.js
index db12d22..e3e0665 100644
--- a/docs/logic/view/grid.js
+++ b/docs/logic/view/grid.js
@@ -145,16 +145,28 @@ function Grid()
       }
 
       // TYPE
-      if (SETTINGS.SHOWTYPE && main.util.isDefined(value.TYPE))
+      if (SETTINGS.SHOWTYPE || SETTINGS.SHOWDONE)
       {
-
         article += `<div class="article-typecontainer">`;
-        for (let tc = 0; tc < value.TYPE.length; tc++)
+
+        if (SETTINGS.SHOWTYPE && main.util.isDefined(value.TYPE))
         {
-          article += `<a class="article-type" href='#type-${value.TYPE[tc]}'>`;
-          article += main.util.buildIcon(value.TYPE[tc], value.TYPE[tc], 'article-typeicon');
+          for (let tc = 0; tc < value.TYPE.length; tc++)
+          {
+            article += `<a class="article-type" href='#type-${value.TYPE[tc]}'>`;
+            article += main.util.buildIcon(value.TYPE[tc], value.TYPE[tc], 'article-typeicon');
+            article += `</a>`;
+          }
+        }
+
+        if (SETTINGS.SHOWDONE)
+        {
+          let done = main.util.isDefined(value.DONE) ? value.DONE : 'false';
+          article += `<a class="article-type" href='#done-${done}'>`;
+          article += main.util.buildIcon(done, done, 'article-typeicon');
           article += `</a>`;
         }
+
         article += `</div>`;
       }
 
@@ -356,12 +368,4 @@ function Grid()
       lightbox.load(`content/media/${file}`);
     }
   }
-
-  main.util.buildIcon = function(type, label, altClass)
-  {
-    if (label == undefined) { label = type; }
-    let labelElem = label != null ? `title="${label}" ` : ``;
-    let iconClass = altClass == undefined ? 'article-icon' : altClass;
-    return `<i ${labelElem}class="${main.util.getIcon(type)} textIcon ${iconClass}"></i>`;
-  }
 }
\ No newline at end of file
diff --git a/docs/logic/view/nav.js b/docs/logic/view/nav.js
index 0900e66..a1733a9 100644
--- a/docs/logic/view/nav.js
+++ b/docs/logic/view/nav.js
@@ -34,11 +34,11 @@ function Nav()
       navContent += `<div class="nav-itemgroup">`;
       navContent += `<a href='#done-true' class="nav-item">`;
       navContent += `<div class="nav-itemcount">${value.done}</div>`;
-      navContent += `<i title="done" class="nav-itemicon fas fa-check"></i>`;
+      navContent += `<i title="done" class="nav-itemicon ${main.util.getIcon('true')}"></i>`;
       navContent += `</a>`;
       navContent += `<a href='#done-false' class="nav-item">`;
       navContent += `<div class="nav-itemcount">${value.total - value.done}</div>`;
-      navContent += `<i title="to do" class="nav-itemicon fas fa-times"></i>`;
+      navContent += `<i title="to do" class="nav-itemicon ${main.util.getIcon('false')}"></i>`;
       navContent += `</a>`;
       navContent += `</div>`;
     }
diff --git a/docs/logic/view/util.js b/docs/logic/view/util.js
index 209a381..785b0d6 100644
--- a/docs/logic/view/util.js
+++ b/docs/logic/view/util.js
@@ -1,5 +1,13 @@
 function Util()
 {
+  this.buildIcon = function(type, label, altClass)
+  {
+    if (label == undefined) { label = type; }
+    let labelElem = label != null ? `title="${label}" ` : ``;
+    let iconClass = altClass == undefined ? 'article-icon' : altClass;
+    return `<i ${labelElem}class="${main.util.getIcon(type)} textIcon ${iconClass}"></i>`;
+  }
+
   this.getIcon = function(type)
   {
     let icon = '';
@@ -28,6 +36,8 @@ function Util()
         case 'file': icon = 'fas fa-folder-open'; break;
         case 'dash': icon = 'fas fa-caret-right'; break;
         case 'link': icon = 'fas fa-link'; break;
+        case 'true': icon = 'fas fa-check'; break;
+        case 'false': icon = 'fas fa-times'; break;
       }
     return icon;
   }