Sprinkle some light CSS on category view

diff --git a/tagger2/TagView.js b/tagger2/TagView.js
index f732888a5b984a3df6f0bf2470c67f2233888662..84eb7678d6ced881c79ec49aaad7678ebdeb50cf 100644 (file)
--- a/tagger2/TagView.js
+++ b/tagger2/TagView.js
@@ -1,7 +1,7 @@
 export default {
     props: ["tag"],
     template: `
-        <div>
+        <div class="tag-view">
             <div class="tag-title">
                 <span class="tag-name">{{ tag.tagName }}</span>
                 <span class="tag-family">{{ tag.family.name }}</span>

diff --git a/tagger2/style.css b/tagger2/style.css
index a82bc361551ce6a883c62b11ee2d0b4d63c990c2..18f287b0b7779d3cb4897160e56998f51a33010e 100644 (file)
--- a/tagger2/style.css
+++ b/tagger2/style.css
@@ -6,4 +6,9 @@ body {
 .tag-error { background-color: #f88f7e; padding: 2px; }
 .tag-warn { color: #c0a007; }
 .tag-fail { color: #c02007; }
-.tag-info { color: #007ac0; }
\ No newline at end of file
+.tag-info { color: #007ac0; }
+
+.tag-view { padding: 5px; border: 1px solid #eee; margin-bottom: 10px; }
+.tag-name { display: inline-block; width: 200px; font-family: monospace; font-weight: bold; }
+.tag-family { width: 200px; display: inline-block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.tag-score { padding-left: 20px; color: #888; }
\ No newline at end of file