xmpp.chapril.org-conversejs/mockup/overlayed-login.html

76 lines
3.7 KiB
HTML

<!doctype html>
<html class="no-js" lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Login Overlayed</title>
<link type="text/css" rel="stylesheet" media="screen" href="../../node_modules/font-awesome/css/font-awesome.css" />
<link type="text/css" rel="stylesheet" media="screen" href="../../dist/converse.css" />
</head>
<body class="reset">
<div class="converse-bg container">
<h1 class="brand-heading">Converse</h1>
</div>
<div id="conversejs" class="converse-overlayed">
<div class="converse-chatboxes row no-gutters">
<div id="controlbox" class="chatbox logged-out">
<div class="flyout box-flyout">
<div class="chat-head controlbox-head">
<a class="chatbox-btn close-chatbox-button fa fa-close"></a>
<span class="brand-heading-container">
<div class="brand-heading">
<a href="https://conversejs.org" target="_blank" rel="noopener">
<i class="icon-conversejs"></i><span class="brand-name">converse</span>
</a>
</div>
</span>
</div>
<div class="controlbox-panes">
<div id="converse-login-panel" class="controlbox-pane fade-in row no-gutters">
<form id="converse-login" class="converse-form">
<div class="form-group">
<label for="jid">XMPP Username:</label>
<input type="text" name="jid" class="form-control" placeholder="user@server" autocomplete="off">
</div>
<div class="form-group">
<label for="password">Password:</label>
<input type="password" name="password" class="form-control" placeholder="password" autocomplete="off">
</div>
<div class="form-group form-check">
<input id="converse-login-trusted" class="form-check-input" type="checkbox" name="trusted" checked="">
<label class="form-check-label" for="converse-login-trusted">This is a trusted device</label>
</div>
<fieldset class="buttons">
<input class="btn btn-primary" type="submit" value="Log in">
<p>Click <a href="#" data-toggle="modal" data-target="#registerModal">here</a> to register.</p>
</fieldset>
</form>
</div>
</div>
</div>
</div>
</div>
<div class="modals"></div>
</div>
<script type="text/javascript" src="../../node_modules/lodash/lodash.js"></script>
<script type="text/javascript" src="../../node_modules/backbone/backbone.js"></script>
<script type="text/javascript" src="../../node_modules/backbone.nativeview/backbone.nativeview.js"></script>
<script type="text/javascript" src="sidebar.js"></script>
<script type="text/javascript" src="controlbox.js"></script>
<script type="text/javascript" src="modals.js"></script>
<script type="text/javascript" src="../../node_modules/bootstrap.native/dist/bootstrap-native-v4.js"></script>
<script>
document.addEventListener("DOMContentLoaded", function(event) {
new Modals();
new Sidebar();
});
</script>
</body>
</html>