Add some test styles

* Remove the right "tools" sidebar
* Invert colours in the main message viewer. Doesn't appear to be
  working correctly at the moment. Looks like I need to add some
  specificity to the selector.

Change the name of the output file to make it a user script.

Add the UserScript header metadata.

1 files changed, 37 insertions, 0 deletions

diff --git a/index.ts b/index.ts
index 1edc591..d6d99f6 100644
--- a/index.ts
+++ b/index.ts
@@ -1,5 +1,42 @@
+// ==UserScript==
+// @name Muttagen
+// @description Gmail user script providing Mutt features
+// @namespace com.teddywing
+// @match https://mail.google.com/*
+// ==/UserScript==
+
 type GmailCSSClass = string;
 
 const TOOLS_PANEL: GmailCSSClass = 'bAw';
 const SIDEBAR: GmailCSSClass = 'aeN';
 const MESSAGE_PAGER: GmailCSSClass = 'nH';
+
+
+type GmailCSSDefinitions = { [selector in GmailCSSClass]: string };
+
+var css: GmailCSSDefinitions = {};
+css[TOOLS_PANEL] = 'display: none;';
+css[MESSAGE_PAGER] = 'filter: invert(100%);';
+
+function construct_css(css: GmailCSSDefinitions): string {
+	var joined = '';
+
+	for (var selector in css) {
+		joined += `.${selector} { ${css[selector]} }`;
+	}
+
+	return joined;
+}
+
+function append_css(css: string): void {
+	var s = document.createElement('style');
+	var t = document.createTextNode(css);
+
+	s.appendChild(t);
+
+	document.head.appendChild(s);
+}
+
+append_css(
+	construct_css(css)
+);