Add a little bit of styling
This commit is contained in:
parent
013ae64b88
commit
9c8dc01f18
4 changed files with 68 additions and 15 deletions
|
@ -1,3 +1,5 @@
|
||||||
|
# ![](./img/feathermost.svg) Feathermost
|
||||||
|
|
||||||
To run in development mode, execute `rundev.sh`.
|
To run in development mode, execute `rundev.sh`.
|
||||||
This will start a web server, and mitmproxy to avoid CORS problems.
|
This will start a web server, and mitmproxy to avoid CORS problems.
|
||||||
Dependencies for that: Bash, Python and [`mitmproxy`](https://mitmproxy.org/).
|
Dependencies for that: Bash, Python and [`mitmproxy`](https://mitmproxy.org/).
|
||||||
|
|
5
assets/feathermost.svg
Normal file
5
assets/feathermost.svg
Normal file
|
@ -0,0 +1,5 @@
|
||||||
|
<?xml version="1.0" encoding="UTF-8"?>
|
||||||
|
<svg width="20" height="20" version="1.1" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<path d="m15.876 1.9088 0.10531 2.1226c1.7207 1.901 2.3999 4.5932 1.5433 7.1234-1.2787 3.7771-5.4948 5.7626-9.4172 4.4347-3.9223-1.3277-6.0655-5.4661-4.7869-9.2431 0.85942-2.5387 3.0459-4.268 5.5783-4.7259l1.3682-1.6166c-4.2687-0.11553-8.2959 2.5341-9.7368 6.7905-1.7704 5.2298 1.034 10.905 6.2638 12.675 5.2298 1.7704 10.905-1.034 12.675-6.2639 1.4385-4.2496-0.14353-8.793-3.5931-11.297" fill="#211f1e"/>
|
||||||
|
<path d="m14.088 0.18611c-2.949 2.0501-4.6451 4.0857-5.4995 5.8449l0.55031 0.95054-0.6633-0.70972c-0.22057 0.4915-0.37422 0.95962-0.47175 1.3987l0.9144 0.97831-0.98725-0.59197c-0.28612 1.8724 0.49604 3.1322 1.5241 3.2524-0.35881-1.8001 2.191-7.5492 3.272-8.6437-1.1888 1.6761-3.3544 6.5967-2.9779 8.66 0.94305 0.0189 1.6754-0.21441 2.2174-1.1364l-1.498 0.20886 1.7873-0.79608c0.18886-0.44764 0.36498-1.0028 0.53624-1.6901l-1.347 0.43884 1.4523-0.8811c0.37979-1.6614 0.74537-4.0021 1.1906-7.2836zm-4.339 11.14c-0.093389-3e-3 -0.17276 7.8e-4 -0.29408-0.0164 0.065492 0.32214 0.00469 0.70281 0.058398 1.1769 0.030084 0.26557 0.034064 0.50318 0.15617 0.75233 0.17368-0.10889 0.46654-0.11338 0.4455-0.35553-0.01666-0.1918-0.11713-0.2967-0.18128-0.52938-0.11616-0.42133-0.13274-0.72968-0.1847-1.028z" fill="#211f1e"/>
|
||||||
|
</svg>
|
After Width: | Height: | Size: 1.3 KiB |
37
assets/main.css
Normal file
37
assets/main.css
Normal file
|
@ -0,0 +1,37 @@
|
||||||
|
body {
|
||||||
|
font-family: sans-serif;
|
||||||
|
background-color: #eee;
|
||||||
|
color: #222;
|
||||||
|
max-width: 768px;
|
||||||
|
margin: 0 auto;
|
||||||
|
line-height: 1.5;
|
||||||
|
}
|
||||||
|
|
||||||
|
input {
|
||||||
|
font: inherit;
|
||||||
|
color: inherit;
|
||||||
|
}
|
||||||
|
|
||||||
|
h1 {
|
||||||
|
text-align: center;
|
||||||
|
line-height: 1.2;
|
||||||
|
}
|
||||||
|
h1 img {
|
||||||
|
width: 1em;
|
||||||
|
height: 1em;
|
||||||
|
vertical-align: middle;
|
||||||
|
}
|
||||||
|
|
||||||
|
#login {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
#login table {
|
||||||
|
margin: 0 auto 1em;
|
||||||
|
}
|
||||||
|
#login table th {
|
||||||
|
font-weight: normal;
|
||||||
|
text-align: right;
|
||||||
|
}
|
||||||
|
#login_server_row td, #login_server_row th {
|
||||||
|
padding-bottom: 1em;
|
||||||
|
}
|
39
index.html
39
index.html
|
@ -4,29 +4,38 @@
|
||||||
<meta charset="utf-8" />
|
<meta charset="utf-8" />
|
||||||
<meta name="viewport" content="width=device-width" />
|
<meta name="viewport" content="width=device-width" />
|
||||||
<title>Feathermost</title>
|
<title>Feathermost</title>
|
||||||
|
<link rel="stylesheet" href="/assets/main.css"/>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<form>
|
<div id="noscript">
|
||||||
|
<p>This application cannot work without JavaScript, unfortunately. In order to proceed, please enable it for this website.</p>
|
||||||
|
<p>Feathermost is an alternative webclient for the Mattermost chat platform. It is not possible to provide a JavaScript-less experience without having to trust us with your user data.</p>
|
||||||
|
</div>
|
||||||
|
<script type="text/javascript">document.body.innerHTML = "";</script>
|
||||||
|
|
||||||
|
<h1><img src="/assets/feathermost.svg" alt=""/> Feathermost</h1>
|
||||||
|
<form id="login">
|
||||||
|
<h2 id="add-a-server">Add a server</h2>
|
||||||
<table>
|
<table>
|
||||||
<tr><th>Server</th><td><input type="text" id="server" value="http://localhost:8080"/></td></tr>
|
<tr id="login_server_row">
|
||||||
<tr><th>Username</th><td><input type="text" id="username"/></td></tr>
|
<th>Server</th>
|
||||||
<tr><th>Password</th><td><input type="password" id="password"/></td></tr>
|
<td><input type="text" id="login_server" value="http://localhost:8080" required/></td>
|
||||||
|
</tr><tr>
|
||||||
|
<th>Username</th>
|
||||||
|
<td><input type="text" id="login_username" required/></td>
|
||||||
|
</tr><tr>
|
||||||
|
<th>Password</th>
|
||||||
|
<td><input type="password" id="login_password" required/></td>
|
||||||
|
</tr>
|
||||||
</table>
|
</table>
|
||||||
|
|
||||||
<input type="button" onclick="logIn(); return false" id="login" value="Log in"/>
|
<input type="button" id="login_button" value="Log in"/>
|
||||||
<span id="login_message"></span><br/>
|
<div id="login_message"></div>
|
||||||
|
|
||||||
<input type="button" onclick="validateToken(); return false" id="validate" value="Validate token"/>
|
|
||||||
<span id="validate_message">(ignores username and password)</span><br/>
|
|
||||||
|
|
||||||
<input type="button" onclick="logOut(); return false" id="logout" value="Log out"/>
|
|
||||||
<span id="logout_message"></span><br/>
|
|
||||||
|
|
||||||
</form>
|
</form>
|
||||||
|
|
||||||
<pre id="user_json"></pre>
|
<pre id="user_json"></pre>
|
||||||
|
|
||||||
<script type="text/javascript" src="ajax.js"></script>
|
<script type="text/javascript" src="/ajax.js"></script>
|
||||||
<script type="text/javascript" src="main.js"></script>
|
<script type="text/javascript" src="/main.js"></script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
Loading…
Reference in a new issue