Arsharth/hydrogen-web
1
0
Fork 0
forked from mystiq/hydrogen-web
Code Issues Pull requests Projects Releases Packages Wiki Activity

basic element theme colors

Browse source
This commit is contained in:
Bruno Windels 2020-08-12 18:23:24 +02:00
parent 348174f973
commit d33e7b2a8b
1 changed files with 20 additions and 44 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

64
src/ui/web/css/themes/element/theme.css
View file

@ -20,18 +20,18 @@ limitations under the License.
.hydrogen { .hydrogen {
font-family: 'Inter', sans-serif, 'emoji'; font-family: 'Inter', sans-serif, 'emoji';
background-color: white; background-color: white;
color: black; color: #2e2f32;
} }
.avatar { .avatar {
border-radius: 100%; border-radius: 100%;
background: black; background: #3D88FA;
color: white; color: white;
} }
.LeftPanel { .LeftPanel {
background: #333; background: rgba(245, 245, 245, 0.90);
color: white;
} }
.LeftPanel ul { .LeftPanel ul {
@ -47,16 +47,8 @@ limitations under the License.
} }
.LeftPanel li.active { .LeftPanel li.active {
background: lightgray; background: rgba(141, 151, 165, 0.1);
color: black; border-radius: 5px;
}
.LeftPanel li {
border-bottom: 1px #555 solid;
}
.LeftPanel li:last-child {
border-bottom: none;
} }
.LeftPanel li > * { .LeftPanel li > * {
@ -73,7 +65,16 @@ a {
.SessionStatusView { .SessionStatusView {
padding: 5px; padding: 5px;
background-color: #555; position: absolute;
top: 20px;
right: 20px;
background-color: #3D88FA;
color: white;
border-radius: 10px;
}
.room-shown .SessionStatusView {
top: 72px;
} }
.RoomPlaceholderView { .RoomPlaceholderView {
@ -86,10 +87,9 @@ a {
background-color: grey; background-color: grey;
} }
.RoomHeader { .RoomHeader {
background: rgba(245, 245, 245, 0.90);
padding: 10px; padding: 10px;
background-color: #333;
} }
.RoomHeader button { .RoomHeader button {
@ -115,11 +115,6 @@ a {
font-size: 0.8em; font-size: 0.8em;
} }
.RoomHeader {
padding: 10px;
background-color: #333;
}
.RoomView_error { .RoomView_error {
color: red; color: red;
} }
@ -130,10 +125,8 @@ a {
} }
.message-container { .message-container {
max-width: 80%;
padding: 5px 10px; padding: 5px 10px;
margin: 5px 10px; margin: 5px 10px;
background: blue;
} }
.message-container .sender { .message-container .sender {
@ -145,7 +138,6 @@ a {
.TextMessageView .message-container time { .TextMessageView .message-container time {
padding: 2px 0 0px 20px; padding: 2px 0 0px 20px;
font-size: 0.9em; font-size: 0.9em;
color: lightblue;
} }
.message-container time { .message-container time {
@ -153,24 +145,8 @@ a {
color: lightblue; color: lightblue;
} }
.own time {
color: lightgreen;
}
.own .message-container {
background-color: darkgreen;
}
.TextMessageView.own .message-container {
margin-left: auto;
}
.TextMessageView.pending .message-container { .TextMessageView.pending .message-container {
background-color: #333; color: #ccc;
}
.TextMessageView .message-container time {
float: right;
} }
.message-container p { .message-container p {
@ -185,8 +161,8 @@ a {
.AnnouncementView > div { .AnnouncementView > div {
margin: 0 auto; margin: 0 auto;
padding: 10px 20px; padding: 10px 20px;
background-color: #333; background-color: rgba(245, 245, 245, 0.90);
font-size: 0.9em; font-size: 0.9em;
color: #CCC;
text-align: center; text-align: center;
border-radius: 10px;
} }