Improve design of landing page

This commit is contained in:
Tor Hveem 2013-10-06 13:59:34 +02:00
parent 8520c7251a
commit 4db0a985c5
1 changed files with 31 additions and 24 deletions

View File

@ -13,35 +13,42 @@
</head>
<body ng-app="weechat">
<div ng-controller="WeechatCtrl">
<div ng-hide="connected">
<form class="form-horizontal">
<legend>Connection</legend>
<div ng-hide="connected" class="container">
<h2>
<img src="img/favicon.png">
glowing bear
<small>
WeeChat web frontend
</small>
</h2>
<div>To start using, please enable relay in your WeeChat client:
<pre>
/set relay.network.password yourpassword
/relay add weechat 9001</pre>
Note: The communication goes directly between your browser and your weechat in clear text.
Connection settings are saved between sessions, including password, in your own browser.
</div>
<h3>Connection settings</h3>
<form role="form">
<div class="alert alert-danger" ng-show="errorMessage">
<strong>Oh no!</strong> We cannot connect!
<strong>Oh no!</strong> We cannot connect!
</div>
<div class="control-group">
<label class="control-label" for="hostport">Hostport</label>
<div class="controls">
<input type="text" id="hostport" ng-model="hostport" placeholder="Hostport">
<div class="form-group">
<label class="control-label" for="hostport">Hostname and port</label>
<input type="text" class="form-control" id="hostport" ng-model="hostport" placeholder="Hostport">
<p class="help-block">Enter the hostname and the port to the WeeChat relay, separated by a :</p>
</div>
</div>
<div class="control-group">
<label class="control-label" for="proto">Proto</label>
<div class="controls">
<input type="text" id="proto" ng-model="proto" placeholder="proto">
<div class="form-group">
<label class="control-label" for="password">WeeChat relay password</label>
<input type="password"class="form-control" id="password" ng-model="password" placeholder="Password">
<p class="help-block">Password will be stored in your browser session</p>
</div>
</div>
<div class="control-group">
<label class="control-label" for="password">Password</label>
<div class="controls">
<input type="password" id="password" ng-model="password" placeholder="Password">
<div class="form-group">
<label class="control-label" for="proto">Proto</label>
<input type="text" class="form-control" id="proto" ng-model="proto" placeholder="proto">
<p class="help-block">Default is fine.</p>
</div>
</div>
<div class="control-group">
<div class="controls">
<button class="btn btn-primary" ng-click="connect()">Connect!</button>
</div>
</div>
<button class="btn btn-lg btn-primary" ng-click="connect()">Connect!</button>
</form>
</div>
<div ng-show="connected">