mirror of
https://github.com/OpenFactorioServerManager/factorio-server-manager.git
synced 2025-01-10 04:19:38 +02:00
fixed serverControl design
This commit is contained in:
parent
fcb272f128
commit
eecc5ac84d
@ -88,35 +88,40 @@ class ServerCtl extends React.Component {
|
||||
}
|
||||
|
||||
render() {
|
||||
return(
|
||||
<div className="box">
|
||||
return (
|
||||
<div id="serverCtl" className="box">
|
||||
<div className="box-header">
|
||||
<h3 className="box-title">Server Control</h3>
|
||||
</div>
|
||||
|
||||
<div className="box-body">
|
||||
|
||||
<form action="" onSubmit={this.startServer}>
|
||||
<div className="form-group">
|
||||
<div className="row">
|
||||
<div className="col-md-4">
|
||||
<button className="btn btn-block btn-success" type="submit"><i className="fa fa-play fa-fw"></i>Start Factorio Server</button>
|
||||
<button className="btn btn-block btn-success" type="submit">
|
||||
<i className="fa fa-play fa-fw"></i>Start Factorio Server
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div className="col-md-4">
|
||||
<button className="btn btn-block btn-warning" type="button" onClick={this.stopServer}><i className="fa fa-stop fa-fw"></i>Stop & Save Factorio Server</button>
|
||||
<button className="btn btn-block btn-warning" type="button" onClick={this.stopServer}>
|
||||
<i className="fa fa-stop fa-fw"></i>Stop & Save Factorio Server
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div className="col-md-4">
|
||||
<button className="btn btn-block btn-danger" type="button" onClick={this.killServer}><i className="fa fa-close fa-fw"></i>Stop Factorio Server without Saving</button>
|
||||
<button className="btn btn-block btn-danger" type="button" onClick={this.killServer}>
|
||||
<i className="fa fa-close fa-fw"></i>Stop Factorio Server without Saving
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<hr />
|
||||
<hr/>
|
||||
<label>Select Save File</label>
|
||||
<select ref="savefile" className="form-control">
|
||||
{this.props.saves.map( (save, i) => {
|
||||
return(
|
||||
{this.props.saves.map((save, i) => {
|
||||
return (
|
||||
<option key={save.name} value={save.name}>{save.name}</option>
|
||||
)
|
||||
|
||||
@ -124,23 +129,29 @@ class ServerCtl extends React.Component {
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div className="box box-success collapsed-box">
|
||||
<button type="button" className="btn btn-box-tool" data-widget="collapse">
|
||||
<div className="box-header with-border">
|
||||
<i className="fa fa-plus fa-fw"></i>
|
||||
<h4 className="box-title">Advanced</h4>
|
||||
</div>
|
||||
</button>
|
||||
<div className="box-body" style={{display: "none"}}>
|
||||
<div className="box box-success advanced">
|
||||
<button type="button"
|
||||
className="btn btn-box-tool"
|
||||
data-toggle="collapse"
|
||||
data-target="#serverCtlAdvanced"
|
||||
aria-expanded="false"
|
||||
aria-controls="serverCtlAdvanced"
|
||||
>
|
||||
<div className="box-header with-border">
|
||||
<i className="fa fa-plus fa-fw"></i>
|
||||
<div className="box-title">Advanced</div>
|
||||
</div>
|
||||
</button>
|
||||
<div id="serverCtlAdvanced" className="box-body collapse">
|
||||
<label htmlFor="port">Factorio Server IP</label>
|
||||
<div id="port" className="input-group">
|
||||
<input ref="gameBindIP"
|
||||
name="gameBindIP"
|
||||
id="gameBindIP"
|
||||
type="text"
|
||||
className="form-control"
|
||||
defaultValue={this.state.gameBindIP}
|
||||
placeholder={this.state.gameBindIP} />
|
||||
name="gameBindIP"
|
||||
id="gameBindIP"
|
||||
type="text"
|
||||
className="form-control"
|
||||
defaultValue={this.state.gameBindIP}
|
||||
placeholder={this.state.gameBindIP}/>
|
||||
</div>
|
||||
<label htmlFor="port">Factorio Server Port</label>
|
||||
<div id="port" className="input-group">
|
||||
@ -153,8 +164,12 @@ class ServerCtl extends React.Component {
|
||||
placeholder={this.state.port}
|
||||
/>
|
||||
<div className="input-group-btn">
|
||||
<button type="button" className="btn btn-primary" onClick={this.incrementPort}><i className="fa fa-arrow-up"></i></button>
|
||||
<button type="button" className="btn btn-primary" onClick={this.decrementPort}><i className="fa fa-arrow-down"></i></button>
|
||||
<button type="button" className="btn btn-primary" onClick={this.incrementPort}>
|
||||
<i className="fa fa-arrow-up"></i>
|
||||
</button>
|
||||
<button type="button" className="btn btn-primary" onClick={this.decrementPort}>
|
||||
<i className="fa fa-arrow-down"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -15,10 +15,10 @@ class ServerStatus extends React.Component {
|
||||
var result = {};
|
||||
|
||||
if (serverStatus === "running") {
|
||||
result = <span className="label label-success">Running</span>;
|
||||
result = <span className="badge badge-success">Running</span>;
|
||||
return result;
|
||||
} else if (serverStatus == "stopped") {
|
||||
result = <span className="label label-danger">Not Running</span>;
|
||||
result = <span className="badge badge-danger">Not Running</span>;
|
||||
return result;
|
||||
}
|
||||
|
||||
|
@ -12,4 +12,5 @@
|
||||
@import "scss/sidebar";
|
||||
@import "scss/content";
|
||||
@import "scss/navigation";
|
||||
@import "scss/breadcrumbs";
|
||||
@import "scss/breadcrumbs";
|
||||
@import "scss/serverCtl";
|
9
ui/scss/serverCtl.scss
Normal file
9
ui/scss/serverCtl.scss
Normal file
@ -0,0 +1,9 @@
|
||||
#serverCtl {
|
||||
.advanced {
|
||||
border: none;
|
||||
|
||||
> .btn {
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
}
|
Loading…
Reference in New Issue
Block a user