css for e2e look & feel

pull/2163/head
Matthew Hodgson 2016-09-12 01:38:03 +01:00
parent dd4617a7c6
commit 5775552bab
2 changed files with 46 additions and 8 deletions

View File

@ -43,14 +43,6 @@ limitations under the License.
padding-top: 0px ! important; padding-top: 0px ! important;
} }
.mx_EventTile_verified {
background-color: #eaf5f0;
}
.mx_EventTile_unverified {
background-color: #ffa0a0;
}
.mx_EventTile .mx_SenderProfile { .mx_EventTile .mx_SenderProfile {
color: #454545; color: #454545;
opacity: 0.5; opacity: 0.5;
@ -126,6 +118,10 @@ limitations under the License.
color: #fff; color: #fff;
} }
.mx_EventTile_encrypting {
color: #abddbc ! important;
}
.mx_EventTile_sending { .mx_EventTile_sending {
color: #ddd; color: #ddd;
} }
@ -231,6 +227,43 @@ limitations under the License.
overflow-y: hidden; overflow-y: hidden;
} }
/* End to end encryption stuff */
.mx_EventTile_e2eIcon {
display: block;
position: absolute;
top: 9px;
left: 46px;
z-index: 2;
}
.mx_EventTile:hover.mx_EventTile_verified .mx_EventTile_line,
.mx_EventTile:hover.mx_EventTile_unverified .mx_EventTile_line {
padding-left: 60px;
}
.mx_EventTile:hover.mx_EventTile_verified .mx_EventTile_line {
border-left: #76cfa5 5px solid;
}
.mx_EventTile:hover.mx_EventTile_unverified .mx_EventTile_line {
border-left: #e8bf37 5px solid;
}
.mx_EventTile:hover.mx_EventTile_verified .mx_MessageTimestamp,
.mx_EventTile:hover.mx_EventTile_unverified .mx_MessageTimestamp {
left: 3px;
}
.mx_EventTile_verified .mx_EventTile_e2eIcon {
display: none;
}
.mx_EventTile:hover.mx_EventTile_verified .mx_EventTile_e2eIcon,
.mx_EventTile:hover.mx_EventTile_unverified .mx_EventTile_e2eIcon {
display: block;
left: 41px;
}
/* Various markdown overrides */ /* Various markdown overrides */
.mx_EventTile_content .markdown-body { .mx_EventTile_content .markdown-body {

View File

@ -46,6 +46,11 @@ limitations under the License.
width: 100%; width: 100%;
} }
.mx_MessageComposer_e2eIcon {
position: absolute;
left: 46px;
}
.mx_MessageComposer_noperm_error { .mx_MessageComposer_noperm_error {
width: 100%; width: 100%;
height: 60px; height: 60px;