Use html plugin + handle URLs

src/styles/global.css

@@ -0,0 +1,108 @@
+* {
+  box-sizing: border-box;
+  margin: 0;
+  padding: 0;
+}
+
+.container {
+  background-color: #ffffff;
+}
+
+.header {
+  display: flex;
+  padding: 10px;
+  height: 56px;
+  /* background: #2e2e2e; */
+  border-bottom: 2px #ccc solid;
+  color: #343a40
+}
+
+.content {
+  display: flex;
+  height: calc(100vh - 56px);
+  overflow-y: hidden;
+}
+
+.tree {
+  padding: 1rem;
+  overflow-y: auto;
+}
+
+.source textarea {
+  width: 100%;
+  height: calc(100vh - 56px);
+  padding: 1.3rem 0.4rem;
+  border: none;
+  white-space: pre;
+  overflow-wrap: normal;
+  overflow-x: auto;
+  tab-size: 4;
+  -moz-tab-size: 4;
+  -o-tab-size: 4;
+  -webkit-tab-size: 4;
+  outline: none;
+}
+
+.source textarea::selection {
+  background-color: rgba(103, 134, 221, 0.6);
+}
+
+.source-controls {
+  display: flex;
+  flex-direction: row-reverse;
+  position: absolute;
+  right: 17px;
+  top: 56px;
+  padding: 5px;
+}
+
+.source-controls .btn:not(:first-child) {
+  margin-right: 5px;
+}
+
+.source-controls-more {
+  display: flex;
+  visibility: hidden;
+  flex-direction: column;
+  position: absolute;
+  right: 17px;
+  top: 91px;
+  padding: 5px;
+}
+
+.source-controls .btn,
+.source-controls-more .btn {
+  background: #1f2020a6;
+}
+
+.gutter.gutter-horizontal {
+  border-left: 2px solid #ccc;
+  float: left;
+  cursor: ew-resize;
+}
+
+.btn {
+  display: flex;
+  align-items: center;
+  border: none;
+  color: #ffffff;
+  fill: #ffffff;
+  background-color: #1f2020a6;
+  padding: 7px 11px;
+  cursor: pointer;
+  outline: none;
+  transition: background-color 0.2s;
+}
+
+.btn.check {
+  fill: #97fa55;
+  color: #97fa55;
+}
+
+.btn svg:not(:last-child) {
+  margin-right: 5px;
+}
+
+.btn:hover {
+  background-color: #5d5f5fa6;
+}