mirror of
https://github.com/vector-im/element-web.git
synced 2024-09-09 22:55:12 +00:00
Make it log in
This commit is contained in:
parent
eeb2dfd1fc
commit
f487b9ba04
5 changed files with 46 additions and 0 deletions
3
css/common.css
Normal file
3
css/common.css
Normal file
|
@ -0,0 +1,3 @@
|
|||
div.error {
|
||||
color: red;
|
||||
}
|
12
css/molecules/ProgressBar.css
Normal file
12
css/molecules/ProgressBar.css
Normal file
|
@ -0,0 +1,12 @@
|
|||
.mx_ProgressBar {
|
||||
height: 5px;
|
||||
border-radius: 5px;
|
||||
border: 1px solid black;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.mx_ProgressBar_fill {
|
||||
height: 100%;
|
||||
background-color: #666;
|
||||
transition: width 0.1s ease;
|
||||
}
|
11
css/templates/Login.css
Normal file
11
css/templates/Login.css
Normal file
|
@ -0,0 +1,11 @@
|
|||
.mx_Login {
|
||||
width: 600px;
|
||||
height: 350px;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
padding: 10px;
|
||||
text-align: center;
|
||||
background-color: #eee;
|
||||
border: 1px solid black;
|
||||
}
|
||||
|
|
@ -7,5 +7,6 @@
|
|||
<body>
|
||||
<section id="matrixchat"></section>
|
||||
<script src="bundle.js"></script>
|
||||
<link rel="stylesheet" href="bundle.css">
|
||||
</body>
|
||||
</html>
|
||||
|
|
19
src/molecules/ProgressBar.js
Normal file
19
src/molecules/ProgressBar.js
Normal file
|
@ -0,0 +1,19 @@
|
|||
var React = require('react');
|
||||
|
||||
module.exports = React.createClass({
|
||||
propTypes: {
|
||||
value: React.PropTypes.number,
|
||||
max: React.PropTypes.number
|
||||
},
|
||||
|
||||
render: function() {
|
||||
// Would use an HTML5 progress tag but if that doesn't animate if you
|
||||
// use the HTML attributes rather than styles
|
||||
var progressStyle = {
|
||||
width: ((this.props.value / this.props.max) * 100)+"%"
|
||||
};
|
||||
return (
|
||||
<div className="mx_ProgressBar"><div className="mx_ProgressBar_fill" style={progressStyle}></div></div>
|
||||
);
|
||||
}
|
||||
});
|
Loading…
Reference in a new issue