Update preview double load
This commit is contained in:
parent
cb4a1e1073
commit
18320573d0
|
@ -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;
|
||||||
|
}
|
|
@ -1,8 +1,10 @@
|
||||||
import PropTypes from "prop-types";
|
import PropTypes from "prop-types";
|
||||||
import React, {Component} from 'react';
|
import React, {Component} from 'react';
|
||||||
|
import Convert from 'ansi-to-html';
|
||||||
import {Grid, Card, Form, Tab, TabbedHeader, TabbedContainer} from 'tabler-react';
|
import {Grid, Card, Form, Tab, TabbedHeader, TabbedContainer} from 'tabler-react';
|
||||||
import Logs from "./Logs";
|
import Logs from "./Logs";
|
||||||
import Convert from 'ansi-to-html';
|
|
||||||
|
import "./Console.css";
|
||||||
|
|
||||||
const convert = new Convert();
|
const convert = new Convert();
|
||||||
|
|
||||||
|
|
|
@ -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;
|
||||||
|
}
|
|
@ -1,6 +1,8 @@
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import {Grid, Loader} from 'tabler-react';
|
import {Grid, Loader} from 'tabler-react';
|
||||||
|
|
||||||
|
import "./Loading.css";
|
||||||
|
|
||||||
const Loading = () => (
|
const Loading = () => (
|
||||||
<Grid.Row className="align-items-center h-100 mt-5">
|
<Grid.Row className="align-items-center h-100 mt-5">
|
||||||
<Grid.Col>
|
<Grid.Col>
|
||||||
|
|
|
@ -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;
|
||||||
|
}
|
|
@ -1,6 +1,8 @@
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import autoscroll from 'autoscroll-react';
|
import autoscroll from 'autoscroll-react';
|
||||||
|
|
||||||
|
import "./Logs.css";
|
||||||
|
|
||||||
class Logs extends React.Component {
|
class Logs extends React.Component {
|
||||||
render() {
|
render() {
|
||||||
return (
|
return (
|
||||||
|
|
|
@ -1,4 +1,3 @@
|
||||||
import PropTypes from 'prop-types';
|
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import {Form, Button} from 'tabler-react';
|
import {Form, Button} from 'tabler-react';
|
||||||
|
|
||||||
|
@ -7,7 +6,7 @@ class Preview extends React.Component {
|
||||||
super(props);
|
super(props);
|
||||||
|
|
||||||
this.state = {
|
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;
|
export default Preview;
|
||||||
|
|
||||||
|
|
|
@ -2,48 +2,6 @@
|
||||||
overflow-x: unset;
|
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 {
|
.card.card-fullscreen {
|
||||||
z-index: 6;
|
z-index: 6;
|
||||||
}
|
}
|
||||||
|
@ -55,38 +13,3 @@
|
||||||
.card.warnings-card .card-options a, .card.errors-card .card-options a {
|
.card.warnings-card .card-options a, .card.errors-card .card-options a {
|
||||||
cursor: pointer;
|
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;
|
|
||||||
}
|
|
Loading…
Reference in New Issue