Usage:

<link rel="stylesheet" href="https://file.brz9.dev/web/js/highlight/hlb9c.css"/>

<script src="https://file.brz9.dev/web/js/highlight/highlight.min.js"></script>
<script>hljs.initHighlightingOnLoad();</script>

const tabnav = {
  data: {
    dynamicId: "yolo"
  },
  props: {
    id: String,
    tabs: Array
  },
  computed: {
    mId: function () {
      return "m" + this.id;
    }
  },
  methods: {
    selectTab(tab, mId) {
      tId = this.id + tab.label;
      target = document.querySelector("#"+tId);
      marker = document.querySelector("#"+mId);
      marker.style.left = target.offsetLeft + "px";
      marker.style.width = target.offsetWidth + "px";
      tabs = this.tabs;
      console.log("selected tab is: " + tab.label);
      for (t in tabs) {
        console.log(tabs[t].label);


      }
    },
  },
  mounted: function() {
    console.log("mount check");
    this.selectTab(this.tabs[0], this.mId);
  }
}

const Tab = {
  template: `

  `
}

let vm = new Vue({
  el: '#app',
  data () {
    return {
      info: "test",
      lorem: [lorem1, lorem2],
      fdb: fontdb,
      tl1tabs: [
        {"label": "font", "selected": true},
        {"label":"color", "selected": false},
      ],
      tl2tabs: [
        {"label": "TITLE", "selected": true},
        {"label": "Text", "selected": false},
        {"label": "Quote", "selected": false},
        {"label": "Mono", "selected": false},
      ],
      tr1tabs: [
        {"label": "preview", "selected": true},
        {"label": "css", "selected": false},
      ],
    }
  },
  methods: {
    //moveMarker (tId, mId) {
    //  target = document.querySelector(tId);
    //  marker = document.querySelector(mId);
    //  marker.style.left = target.offsetLeft + "px";
    //  marker.style.width = target.offsetWidth + "px";
    //},
    px2int (str) {
      let s = str;
      return parseInt(s.replace("px",""));
    },
    getFullH (id) {
      box = document.getElementById(id);
      style = getComputedStyle(box);
      console.log(style);
      contH = this.px2int(style.height);
      contBt = this.px2int(style.borderTopWidth);
      contBb = this.px2int(style.borderBottomWidth);
      marT = this.px2int(style.marginTop);
      marB = this.px2int(style.marginBottom);
      padT = this.px2int(style.paddingTop);
      padB = this.px2int(style.paddingBottom);

      totalH = contH + padT + padB + marT + marB;
      console.log(totalH);
      return totalH;
    },
    setRSH (event) {
      rNavBoxH = this.getFullH("headRight");
      appBox =  document.getElementById("app");
      appBoxS = getComputedStyle(appBox);
      appBoxHstr = appBoxS.height.replace("px","");
      appBoxH = parseInt(appBoxHstr);
      console.log(appBoxH - rNavBoxH);
      rScrollH = appBoxH - rNavBoxH + "px";
      document.getElementById("rightScroll").style.height = rScrollH;
    }
  },
  mounted: function() {
    this.setRSH();
    window.addEventListener('resize', this.setRSH)
  },
  components: { tabnav }
});

package main
import "github.com/gin-gonic/gin"

func main() {
	r := gin.Default()
	r.GET("/ping", func(c *gin.Context) {
		c.JSON(200, gin.H{
			"message": "pong",
		})
	})
	r.Run() // listen and serve on 0.0.0.0:8080 (for windows "localhost:8080")
}

var yolo string = "yolo"

package main

import "fmt"

func main() {
    ch := make(chan float64)
    ch <- 1.0e10    // magic number
    x, ok := <- ch
    defer fmt.Println(`exitting now\`)
    go println(len("hello world!"))
    return
}