don't show file extension in target items

html_resources/ext.svg

@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" stroke="black" stroke-linecap="round" fill="transparent" width="100" height="100" stroke-width="10" viewBox="0 0 100 100">
+<path d="M45 10h40v45M85,10l-40,40"/>
+<path d="M50 25h-40v60h60v-40"/>
+</svg>

html_resources/main.css

@@ -28,8 +28,9 @@ pre:empty{ display: none }
   max-width: 50ch;
   cursor: pointer
 }
+.target > a::after{ content: ""; width: 1ch; background-image: url("ext.svg") }
 .target:hover{ background-color: rgb(80,80,90) }
-#targets{ display: flex; flex-wrap: wrap }
+#targets{ display: grid; grid-template-columns: 1fr 1fr 1fr }
 
 pre{
   white-space: pre-wrap;

html_resources/selector.js

@@ -52,7 +52,7 @@ let previousCategory = new (function(){
 })()
 
 function getText(node){
-  return node.childNodes[0].textContent
+  return `${node.childNodes[0].textContent}.css`
 }
 
 async function onCategoryClicked(categoryNode){
@@ -98,12 +98,12 @@ function createCategories(){
   const createNode = function(name,type){
     let node = document.createElement("div");
     node.classList.add(type);
-    node.textContent = name;
+    node.textContent = name.substring(0,name.lastIndexOf("."));
     if(type === "target"){
       let link = node.appendChild(document.createElement("a"));
       node.classList.add("hidden");
       link.href = `https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/${name}`;
-      link.textContent = "Github";
+      link.title = "See on Github";
     }
     
     return node;