benchmarks/matrix-react-bench/matrix_demo.html (117 lines of code) (raw):
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>matrix-react demo</title>
<style type="text/css">
ol {
list-style-type: none;
}
.mx_RoomHeader div {
display: inline-block;
}
.mx_NewRoomIntro {
border: 1px;
border-style: dashed;
}
.mx_BaseAvatar {
position: relative;
display: inline-block;
}
.mx_BaseAvatar_initial {
position: absolute;
text-align: center;
}
.mx_BaseAvatar_image {
border-radius: 125px;
}
.mx_MiniAvatarUploader_input {
display: none;
}
.mx_DateSeparator hr {
display: none;
}
.mx_EventTile {
clear: both;
position: relative;
padding-top: 18px;
}
.mx_EventTile_continuation {
padding-top: 0 !important;
}
.mx_EventTile_info .mx_EventTile_avatar {
top: 2px;
left: 64px;
}
.mx_EventTile_info .mx_EventTile_line {
padding-left: 82px;
}
.mx_EventTile_line {
padding-left: 64px;
padding-top: 2px;
padding-bottom: 2px;
}
.mx_EventTile_avatar {
position: absolute;
top: 14px;
}
.mx_EventTile_msgOption {
float: right;
}
.mx_SenderProfile {
display: inline-block;
margin-left: 64px;
}
.mx_MessageTimestamp {
display: block;
position: absolute;
left: 0px;
font-size: 80%;
padding-top: 4px;
}
.mx_MessageComposer button {
width: 16px;
height: 16px;
}
.mx_MessageComposer_wrapper {
padding-left: 84px;
border: 1px;
border-style: dashed;
}
.mx_MessageComposer_wrapper .mx_BaseAvatar {
position: absolute;
left: 48px;
}
.mx_BasicMessageComposer_input {
background-color: beige;
}
.mx_Username_color1 {
color: purple;
}
.mx_Username_color2 {
color: magenta;
}
.mx_Username_color3 {
color: lightgreen;
}
.mx_Username_color4 {
color: red;
}
.mx_Username_color5 {
color: orange;
}
.mx_Username_color6 {
color: teal;
}
.mx_Username_color7 {
color: darkblue;
}
.mx_Username_color8 {
color: green;
}
</style>
</head>
<body>
<script src="dist/main.js"></script>
</body>
</html>