WIP

static/css/index.css

@@ -1,12 +1,34 @@
 html {
-  box-sizing: border-box;
+	box-sizing: border-box;
 }
 
-*, *:before, *:after {
-  box-sizing: inherit;
+*,
+*:before,
+*:after {
+	box-sizing: inherit;
 }
 
 [onClick] {
-        cursor: pointer;
+	cursor: pointer;
 }
 
+body {
+	font-family: sans-serif;
+}
+
+.records-tree {
+
+	.top {
+		font-weight: bold;
+		margin-left: 16px;
+	}
+
+	&>.top {
+		margin-left: 0px;
+	}
+
+	.record {
+		display: none;
+		color: #444;
+	}
+}

static/js/dns.mjs

@@ -0,0 +1,17 @@
+export class Application {
+	constructor() {
+		this.addTopHandlers()
+	}
+
+	addTopHandlers() {
+		for (const top of document.querySelectorAll('.top .fqdn'))
+			top.addEventListener('click', event=>this.handlerTop(event))
+	}
+
+	handlerTop(event) {
+		const fqdn = event.target
+		const top = fqdn.closest('.top')
+		const records = top.querySelector('.records')
+		console.log(fqdn, top, records)
+	}
+}