Update preview double load

embark-ui/src/components/Console.css

@@ -0,0 +1,13 @@
+.console-container {
+  padding-top: 5px;
+  padding-bottom: 15px;
+}
+
+.console-container .nav-link {
+  text-transform: capitalize;
+}
+
+.text__new-line, .card.warnings-card .list-group-item, .card.errors-card .list-group-item {
+  white-space: pre-wrap;
+  font-family: monospace;
+}

embark-ui/src/components/Console.js

@@ -1,8 +1,10 @@
 import PropTypes from "prop-types";
 import React, {Component} from 'react';
+import Convert from 'ansi-to-html';
 import {Grid, Card, Form, Tab, TabbedHeader, TabbedContainer} from 'tabler-react';
 import Logs from "./Logs";
-import Convert from 'ansi-to-html';
+
+import "./Console.css";
 
 const convert = new Convert();
 

embark-ui/src/components/Loading.css

@@ -0,0 +1,16 @@
+.loader, .loader:before, .loader:after {
+  width: 1.2rem;
+  height: 1.2rem;
+}
+
+.loader:before, .loader:after {
+  margin: -0.6rem 0 0 -0.6rem;
+  left: 0;
+}
+
+.loader, .loader-text {
+  display: inline-block;
+  vertical-align: top;
+  padding-left: 0.6rem;
+  width: auto;
+}

embark-ui/src/components/Loading.js

@@ -1,6 +1,8 @@
 import React from 'react';
 import {Grid, Loader} from 'tabler-react';
 
+import "./Loading.css";
+
 const Loading = () => (
   <Grid.Row className="align-items-center h-100 mt-5">
     <Grid.Col>

embark-ui/src/components/Logs.css

@@ -0,0 +1,27 @@
+.logs {
+  margin: 10px 0;
+  background-color: #333333;
+  font-family: Consolas, 'Liberation Mono', Menlo, Courier, monospace;
+  font-size: 14px;
+  color: white;
+  padding: 10px;
+  border-radius: 8px;
+  max-height: 350px;
+  overflow: auto;
+}
+
+.logs .error {
+  color: #dc3546;
+}
+
+.logs .warn {
+  color: #fec107;
+}
+
+.logs .debug {
+  color: #b7c1cc;
+}
+
+.logs .trace {
+  color: #8f98a2;
+}

embark-ui/src/components/Logs.js

@@ -1,6 +1,8 @@
 import React from 'react';
 import autoscroll from 'autoscroll-react';
 
+import "./Logs.css";
+
 class Logs extends React.Component {
   render() {
     return (

embark-ui/src/components/Preview.js

@@ -1,4 +1,3 @@
-import PropTypes from 'prop-types';
 import React from 'react';
 import {Form, Button} from 'tabler-react';
 
@@ -7,7 +6,7 @@ class Preview extends React.Component {
     super(props);
 
     this.state = {
-      previewUrl: this.props.previewUrl
+      previewUrl: `${window.location.protocol}//${window.location.host}/`
     };
   }
 
@@ -49,13 +48,5 @@ class Preview extends React.Component {
   }
 }
 
-Preview.propTypes = {
-  previewUrl: PropTypes.string
-};
-
-Preview.defaultProps = {
-  previewUrl: window.location.protocol + '//' + window.location.host
-};
-
 export default Preview;
 

embark-ui/src/index.css

@@ -2,48 +2,6 @@
   overflow-x: unset;
 }
 
-.logs {
-  margin: 10px 0;
-  background-color: #333333;
-  font-family: Consolas, 'Liberation Mono', Menlo, Courier, monospace;
-  font-size: 14px;
-  color: white;
-  padding: 10px;
-  border-radius: 8px;
-  max-height: 350px;
-  overflow: auto;
-}
-
-.logs .error {
-  color: #dc3546;
-}
-
-.logs .warn {
-  color: #fec107;
-}
-
-.logs .debug {
-  color: #b7c1cc;
-}
-
-.logs .trace {
-  color: #8f98a2;
-}
-
-.console-container {
-  padding-top: 5px;
-  padding-bottom: 15px;
-}
-
-.console-container .nav-link {
-  text-transform: capitalize;
-}
-
-.text__new-line, .card.warnings-card .list-group-item, .card.errors-card .list-group-item {
-  white-space: pre-wrap;
-  font-family: monospace;
-}
-
 .card.card-fullscreen {
   z-index: 6;
 }
@@ -54,39 +12,4 @@
 
 .card.warnings-card .card-options a, .card.errors-card .card-options a {
   cursor: pointer;
-}
-
-.compilation-summary {
-  float: right;
-  margin-bottom: 3px;
-  visibility: hidden;
-}
-
-.compilation-summary.visible {
-  visibility: visible;
-}
-
-.compilation-summary .badge-link:not(:last-child) {
-  margin-right: 5px;
-}
-
-.ace_editor {
-  margin-bottom: 24px;
-}
-
-.loader, .loader:before, .loader:after {
-  width: 1.2rem;
-  height: 1.2rem;
-}
-
-.loader:before, .loader:after {
-  margin: -0.6rem 0 0 -0.6rem;
-  left: 0;
-}
-
-.loader, .loader-text {
-  display: inline-block;
-  vertical-align: top;
-  padding-left: 0.6rem;
-  width: auto;
 }