mad-star-studio/element-web
2
0
Fork 0
Code Pull requests Activity

Merge branch 'develop' into matthew/scalar

Browse source
This commit is contained in:
Matthew Hodgson 2016-08-04 13:41:04 +01:00
commit eb108c7866
68 changed files with 1449 additions and 364 deletions
Download patch file Download diff file Expand all files Collapse all files

118
src/skins/vector/css/common.css
View file

@ -58,6 +58,11 @@ input[type=text]:focus, textarea:focus {
box-shadow: none;
}
/* Prevent ugly dotted highlight around selected elements in Firefox */
::-moz-focus-inner {
border: 0;
}
/* applied to side-panels and messagepanel when in RoomSettings */
.mx_fadable {
opacity: 1;
@ -80,50 +85,6 @@ input[type=text]:focus, textarea:focus {
border-left: 6px solid transparent;
}
.mx_ContextualMenu_background {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
opacity: 1.0;
z-index: 2000;
}
.mx_ContextualMenu {
border: 1px solid #a4a4a4;
border-radius: 8px;
background-color: #fff;
color: #747474;
position: fixed;
z-index: 2001;
padding: 6px;
}
.mx_ContextualMenu_chevron_right {
padding: 12px;
position: absolute;
right: -21px;
top: 0px;
}
.mx_ContextualMenu_chevron_left {
padding: 12px;
position: absolute;
left: -21px;
top: 0px;
}
.mx_ContextualMenu_field {
padding: 3px 6px 3px 6px;
cursor: pointer;
}
.mx_ContextualMenu_spinner {
display: block;
margin: 0 auto;
}
.mx_Dialog_wrapper {
position: fixed;
z-index: 4000;
@ -143,16 +104,31 @@ input[type=text]:focus, textarea:focus {
justify-content: center;
}
/* Spinner Dialog overide */
.mx_Dialog_wrapper.mx_Dialog_spinner .mx_Dialog {
width: auto;
border-radius: 8px;
padding-left: 0px;
box-shadow: none;
}
/* View Source Dialog overide */
.mx_Dialog_wrapper.mx_Dialog_viewsource .mx_Dialog {
padding-left: 10px;
padding-right: 10px;
}
.mx_Dialog {
background-color: #fff;
color: #747474;
text-align: center;
z-index: 4010;
font-weight: 300;
font-size: 15px;
position: relative;
border-radius: 8px;
max-width: 80%;
padding-left: 58px;
width: 60%;
max-width: 704px;
box-shadow: 0 1px 0 0 rgba(0, 0, 0, 0.2);
}
.mx_Dialog_background {
@ -161,12 +137,13 @@ input[type=text]:focus, textarea:focus {
left: 0;
width: 100%;
height: 100%;
background-color: #000;
opacity: 0.2;
background-color: #e9e9e9;
opacity: 0.8;
}
.mx_Dialog_lightbox .mx_Dialog_background {
opacity: 0.85;
background-color: #000;
}
.mx_Dialog_lightbox .mx_Dialog {
@ -180,34 +157,45 @@ input[type=text]:focus, textarea:focus {
}
.mx_Dialog_content {
margin: 24px;
margin: 24px 58px 68px 0;
font-size: 14px;
color: #4a4a4a;
word-wrap: break-word;
}
.mx_Dialog_buttons {
padding-bottom: 24px;
padding-bottom: 36px;
}
.mx_Dialog button, .mx_Dialog input[type="submit"] {
border: 0px;
height: 36px;
border-radius: 36px;
border-radius: 40px;
border: solid 1px #76cfa6;
font-weight: 400;
font-size: 15px;
margin-left: 0px;
margin-right: 8px;
padding-left: 1.5em;
padding-right: 1.5em;
outline: none;
color: #76cfa6;
background-color: #fff;
}
.mx_Dialog button.mx_Dialog_primary, .mx_Dialog input[type="submit"].mx_Dialog_primary {
color: #fff;
background-color: #76cfa6;
margin-left: 8px;
margin-right: 8px;
padding-left: 1em;
padding-right: 1em;
}
.mx_Dialog_title {
min-height: 16px;
padding: 12px;
border-bottom: 1px solid #a4a4a4;
padding-top: 40px;
font-weight: bold;
font-size: 18px;
font-size: 22px;
line-height: 1.4;
color: #454545;
}
.mx_TextInputDialog_label {
@ -238,3 +226,15 @@ input[type=text]:focus, textarea:focus {
background-color: #76CFA6;
color: white;
}
/** green button with rounded corners */
.textButton {
color: #fff;
background-color: #76cfa6;
border-radius: 17px;
text-align: center;
padding-left: 1em;
padding-right: 1em;
cursor: pointer;
display: inline;
}

106
src/skins/vector/css/matrix-react-sdk/structures/ContextualMenu.css Normal file
View file

@ -0,0 +1,106 @@
/*
Copyright 2015, 2016 OpenMarket Ltd
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_ContextualMenu_wrapper {
position: fixed;
z-index: 2000;
}
.mx_ContextualMenu_background {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
opacity: 1.0;
z-index: 2000;
}
.mx_ContextualMenu {
border: solid 1px rgba(187, 187, 187, 0.5);
border-radius: 4px;
background-color: #f6f6f6;
color: #4a4a4a;
position: absolute;
padding: 6px;
font-size: 14px;
z-index: 2001;
}
.mx_ContextualMenu.mx_ContextualMenu_right {
right: 8px;
}
.mx_ContextualMenu_chevron_right {
position: absolute;
right: -8px;
top: 0px;
width: 0;
height: 0;
border-top: 8px solid transparent;
border-left: 8px solid rgba(187, 187, 187, 0.5);
border-bottom: 8px solid transparent;
}
.mx_ContextualMenu_chevron_right:after{
content:'';
width: 0;
height: 0;
border-top: 7px solid transparent;
border-left: 7px solid #f6f6f6;
border-bottom: 7px solid transparent;
position:absolute;
top: -7px;
right: 1px;
}
.mx_ContextualMenu.mx_ContextualMenu_left {
left: 8px;
}
.mx_ContextualMenu_chevron_left {
position: absolute;
left: -8px;
top: 0px;
width: 0;
height: 0;
border-top: 8px solid transparent;
border-right: 8px solid rgba(187, 187, 187, 0.5);
border-bottom: 8px solid transparent;
}
.mx_ContextualMenu_chevron_left:after{
content:'';
width: 0;
height: 0;
border-top: 7px solid transparent;
border-right: 7px solid #f6f6f6;
border-bottom: 7px solid transparent;
position:absolute;
top: -7px;
left: 1px;
}
.mx_ContextualMenu_field {
padding: 3px 6px 3px 6px;
cursor: pointer;
white-space: nowrap;
}
.mx_ContextualMenu_spinner {
display: block;
margin: 0 auto;
}

4
src/skins/vector/css/matrix-react-sdk/structures/MatrixChat.css
View file

@ -93,8 +93,8 @@ limitations under the License.
background-color: #eaf5f0;
-webkit-flex: 0 0 210px;
flex: 0 0 210px;
-webkit-flex: 0 0 235px;
flex: 0 0 235px;
}
.mx_MatrixChat .mx_LeftPanel.collapsed {

8
src/skins/vector/css/matrix-react-sdk/structures/SearchBox.css
View file

@ -16,8 +16,8 @@ limitations under the License.
.mx_SearchBox {
height: 24px;
margin-left: 16px;
margin-right: 20px;
margin-left: 18px;
margin-right: 18px;
padding-top: 24px;
padding-bottom: 22px;
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
@ -28,11 +28,13 @@ limitations under the License.
.mx_SearchBox_searchButton {
margin-right: 10px;
margin-top: 5px;
pointer-events: none;
}
.mx_SearchBox_closeButton {
cursor: pointer;
margin-top: -5px;
}
.mx_SearchBox_search {
@ -65,4 +67,4 @@ limitations under the License.
.mx_SearchBox object {
pointer-events: none;
}
}

10
src/skins/vector/css/matrix-react-sdk/structures/UserSettings.css
View file

@ -100,6 +100,16 @@ limitations under the License.
margin-bottom: 28px;
}
.mx_UserSettings_toggle input {
width: 16px;
margin-right: 8px;
margin-bottom: 8px;
}
.mx_UserSettings_toggle label {
padding-bottom: 21px;
}
.mx_UserSettings_accountTable
.mx_UserSettings_notifTable
{

16
src/skins/vector/css/matrix-react-sdk/structures/login/Login.css
View file

@ -131,9 +131,19 @@ limitations under the License.
}
.mx_Login_loader {
position: absolute;
left: 50%;
margin-top: 12px;
display: inline;
position: relative;
top: 2px;
left: 8px;
}
.mx_Login_loader .mx_Spinner {
display: inline;
}
.mx_Login_loader .mx_Spinner img {
width: 16px;
height: 16px;
}
.mx_Login_error {

5
src/skins/vector/css/matrix-react-sdk/views/messages/MTextBody.css
View file

@ -17,3 +17,8 @@ limitations under the License.
.mx_MTextBody {
white-space: pre-wrap;
}
.mx_MTextBody pre{
overflow-y: auto;
max-height: 30vh;
}

16
src/skins/vector/css/matrix-react-sdk/views/messages/UnknownBody.css Normal file
View file

@ -0,0 +1,16 @@
/*
Copyright 2015, 2016 OpenMarket Ltd
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_UnknownBody {
white-space: pre-wrap;
}

67
src/skins/vector/css/matrix-react-sdk/views/rooms/Autocomplete.css Normal file
View file

@ -0,0 +1,67 @@
.mx_Autocomplete {
position: absolute;
bottom: 0;
z-index: 1000;
width: 100%;
border: 1px solid #e5e5e5;
background: rgba(255, 255, 255, 0.9);
border-bottom: none;
border-radius: 4px 4px 0 0;
max-height: 50vh;
overflow: auto
}
.mx_Autocomplete_ProviderSection {
padding: 12px;
border-bottom: 1px solid #e5e5e5;
}
.mx_Autocomplete_ProviderSection * {
padding: 2px;
border-radius: 4px;
}
.mx_Autocomplete_Completion {
user-select: none;
cursor: pointer;
transition: 0.3s all ease;
display: flex;
align-items: center;
}
.mx_Autocomplete_Completion.selected * {
transition: 0.3s all ease;
}
.mx_Autocomplete_Completion.selected {
background: #76cfa6;
color: white;
outline: none;
}
.mx_Autocomplete_Completion.selected * {
color: white !important;
}
.mx_Autocomplete_provider_name {
color: #76cfa6;
font-weight: 600;
}
.autocomplete-enter {
opacity: 0.01;
}
.autocomplete-enter.autocomplete-enter-active {
opacity: 1;
transition: opacity 300ms ease-in;
}
.autocomplete-leave {
opacity: 1;
}
.autocomplete-leave.autocomplete-leave-active {
opacity: 0.01;
transition: opacity 300ms ease-in;
}

11
src/skins/vector/css/matrix-react-sdk/views/rooms/EntityTile.css
View file

@ -87,14 +87,17 @@ limitations under the License.
.mx_EntityTile_unavailable .mx_EntityTile_avatar,
.mx_EntityTile_unavailable .mx_EntityTile_name,
.mx_EntityTile_unavailable .mx_EntityTile_name_hover
.mx_EntityTile_unavailable .mx_EntityTile_name_hover,
.mx_EntityTile_offline_beenactive .mx_EntityTile_avatar,
.mx_EntityTile_offline_beenactive .mx_EntityTile_name,
.mx_EntityTile_offline_beenactive .mx_EntityTile_name_hover
{
opacity: 0.66;
}
.mx_EntityTile_offline .mx_EntityTile_avatar,
.mx_EntityTile_offline .mx_EntityTile_name,
.mx_EntityTile_offline .mx_EntityTile_name_hover
.mx_EntityTile_offline_neveractive .mx_EntityTile_avatar,
.mx_EntityTile_offline_neveractive .mx_EntityTile_name,
.mx_EntityTile_offline_neveractive .mx_EntityTile_name_hover
{
opacity: 0.25;
}

9
src/skins/vector/css/matrix-react-sdk/views/rooms/EventTile.css
View file

@ -76,6 +76,11 @@ limitations under the License.
overflow-x: hidden;
}
/* De-zalgoing */
.mx_EventTile_body {
overflow-y: hidden;
}
/* Various markdown overrides */
.mx_EventTile_content .markdown-body {
@ -115,6 +120,10 @@ limitations under the License.
/* end of overrides */
.mx_EventTile_bigEmoji {
font-size: 48px ! important;
}
/* this is used for the tile for the event which is selected via the URL.
* TODO: ultimately we probably want some transition on here.
*/

29
src/skins/vector/css/matrix-react-sdk/views/rooms/MemberDeviceInfo.css
View file

@ -16,18 +16,18 @@ limitations under the License.
.mx_MemberDeviceInfo {
font-size: 12px;
margin-top: 5px;
display: table-row;
height: 17px;
}
.mx_MemberDeviceInfo div {
display: inline;
margin-right: 5px;
display: table-cell;
}
.mx_MemberDeviceInfo_textButton {
color: #fff;
height: 20px;
border-radius: 20px;
background-color: #76cfa6;
border-radius: 17px;
text-align: center;
padding-left: 1em;
padding-right: 1em;
@ -35,10 +35,23 @@ limitations under the License.
cursor: pointer;
}
.mx_MemberDeviceInfo_verify {
.mx_MemberDeviceInfo div.mx_MemberDeviceInfo_verified,
.mx_MemberDeviceInfo div.mx_MemberDeviceInfo_unverified,
.mx_MemberDeviceInfo div.mx_MemberDeviceInfo_blocked {
color: #fff;
width: 17px;
border-radius: 17px;
text-align: center;
}
.mx_MemberDeviceInfo div.mx_MemberDeviceInfo_verified {
background-color: #76cfa6;
}
.mx_MemberDeviceInfo_unverify {
.mx_MemberDeviceInfo div.mx_MemberDeviceInfo_unverified {
background-color: #eca46f;
}
.mx_MemberDeviceInfo div.mx_MemberDeviceInfo_blocked {
background-color: #e55e5e;
}
}

5
src/skins/vector/css/matrix-react-sdk/views/rooms/MemberInfo.css
View file

@ -72,3 +72,8 @@ limitations under the License.
margin-left: 8px;
line-height: 23px;
}
.mx_MemberInfo_devices {
display: table;
border-spacing: 5px;
}

23
src/skins/vector/css/matrix-react-sdk/views/rooms/MessageComposer.css
View file

@ -21,6 +21,11 @@ limitations under the License.
border-top: 1px solid #e5e5e5;
}
.mx_MessageComposer_autocomplete_wrapper {
position: relative;
height: 0;
}
.mx_MessageComposer_row {
display: flex;
flex-direction: row;
@ -104,9 +109,10 @@ limitations under the License.
.mx_MessageComposer_videocall {
/*display: table-cell;*/
/*vertical-align: middle;*/
padding-left: 10px;
padding-right: 10px;
/*padding-left: 10px;*/
padding-right: 5px;
cursor: pointer;
padding-top: 4px;
}
.mx_MessageComposer_upload object,
@ -116,16 +122,3 @@ limitations under the License.
pointer-events: none;
}
.mx_MessageComposer_videocall {
padding-right: 10px;
padding-top: 4px;
}
.mx_MessageComposer_voicecall {
padding-right: 10px;
padding-top: 4px;
}
.mx_MessageComposer_upload object {
margin-top: 5px;
}

19
src/skins/vector/css/matrix-react-sdk/views/rooms/RoomHeader.css
View file

@ -103,7 +103,8 @@ limitations under the License.
.mx_RoomHeader_rightRow {
margin-top: 4px;
background-color: #fff;
display: flex;
align-items: center;
-webkit-box-ordinal-group: 3;
-moz-box-ordinal-group: 3;
-ms-flex-order: 3;
@ -161,13 +162,6 @@ limitations under the License.
opacity: 0.6;
}
.mx_RoomHeader_settingsButton {
display: inline-block;
position: relative;
bottom: 10px;
left: 4px;
}
.mx_RoomHeader_settingsButton object {
pointer-events: none;
}
@ -183,10 +177,6 @@ limitations under the License.
color: #76cfa6;
}
.mx_RoomHeader_leaveButton {
margin-top: -1px;
}
.mx_RoomHeader_placeholder {
color: #a2a2a2 ! important;
}
@ -243,10 +233,7 @@ limitations under the License.
}
.mx_RoomHeader_button {
display: table-cell;
vertical-align: top;
padding-left: 8px;
padding-right: 8px;
margin-left: 8px;
cursor: pointer;
}

166
src/skins/vector/css/matrix-react-sdk/views/rooms/RoomTile.css
View file

@ -15,33 +15,47 @@ limitations under the License.
*/
.mx_RoomTile {
cursor: pointer;
/* This fixes wrapping of long room names, but breaks drag & drop previews */
/* display: table-row; */
font-size: 13px;
position: relative;
cursor: pointer;
font-size: 13px;
display: block;
height: 34px;
}
.mx_RoomTile .mx_RoomTile_mute {
opacity: 0.4;
}
.mx_RoomTile_nameContainer {
display: inline-block;
width: 180px;
height: 24px;
}
.mx_RoomTile_avatar {
display: table-cell;
padding-right: 11px;
padding-top: 6px;
padding-bottom: 6px;
display: inline-block;
padding-top: 5px;
padding-bottom: 5px;
padding-left: 18px;
padding-right: 6px;
width: 24px;
height: 24px;
position: relative;
vertical-align: middle;
}
.mx_RoomTile_name {
display: table-cell;
width: 100%;
display: inline-block;
position: relative;
width: 165px;
vertical-align: middle;
overflow: hidden;
word-break: break-word;
padding-right: 15px;
padding-left: 6px;
padding-right: 6px;
padding-top: 2px;
padding-bottom: 3px;
color: rgba(69, 69, 69, 0.8);
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.mx_RoomTile_ellipsis .mx_RoomTile_name {
@ -54,28 +68,96 @@ limitations under the License.
*/
}
.collapsed .mx_RoomTile_nameContainer {
height: 0;
}
.collapsed .mx_RoomTile_name {
display: none;
}
.collapsed .mx_RoomTile_badge {
margin-top: -15px;
right: 7px;
top: -2px;
min-width: 12px;
height: 16px;
border-radius: 16px;
padding: 0px 4px 0px 4px;
z-index: 200;
}
/* Position mute icon when room muted and collapsed - invisible at the moment */
.collapsed .mx_RoomTile .mx_RoomTile_badge.mx_RoomTile_badgeMute {
background-color: rgba(0,0,0,0);
opacity: 0;
top: -2px;
}
/* Position menu icon when room muted and collapsed */
.collapsed .mx_RoomTile .mx_RoomTile_badge.mx_RoomTile_badgeButton.mx_RoomTile_badgeMute,
.collapsed .mx_RoomTile .mx_RoomTile_badge.mx_RoomTile_badgeButton.mx_RoomTile_badgeMute {
display: inline-block;
background-color: rgb(214, 214, 214);
letter-spacing: 0.1em;
opacity: 1;
top: -2px;
}
/* Hide the bottom of speech bubble */
.collapsed .mx_RoomTile_highlight .mx_RoomTile_badge:not(.mx_RoomTile_badgeMute):after {
display: none;
}
/* This is the bottom of the speech bubble - not drawn when room muted */
.mx_RoomTile_highlight .mx_RoomTile_badge:not(.mx_RoomTile_badgeMute):after {
content: "";
position: absolute;
display: block;
width: 0;
height: 0;
margin-left: 6px;
border-top: 8px solid #ff0064;
border-right: 10px solid transparent;
}
.mx_RoomTile_badge {
min-width: 12px;
height: 16px;
display: inline-block;
min-width: 19px;
height: 17px;
position: absolute;
right: 16px;
top: 50%;
margin-top: -8px;
border-radius: 16px;
right: 8px; /*gutter */
top: 9px;
border-radius: 14px;
color: #fff;
font-weight: bold;
font-weight: 600;
font-size: 11px;
text-align: center;
padding: 0px 4px 0px 4px;
padding-top: 1px;
padding-left: 4px;
padding-right: 4px;
}
.mx_RoomTile .mx_RoomTile_badge.mx_RoomTile_badgeButton,
.mx_RoomTile.mx_RoomTile_menu .mx_RoomTile_badge {
letter-spacing: 0.1em;
opacity: 1;
}
/* Position menu icon when room muted */
.mx_RoomTile .mx_RoomTile_badge.mx_RoomTile_badgeButton.mx_RoomTile_badgeMute,
.mx_RoomTile .mx_RoomTile_badge.mx_RoomTile_badgeButton.mx_RoomTile_badgeMute {
background-color: rgb(214, 214, 214);
letter-spacing: 0.1em;
opacity: 1;
top: 9px;
right: 8px; /* gutter */
}
/* Position mute icon when room muted */
.mx_RoomTile .mx_RoomTile_badge.mx_RoomTile_badgeMute {
background-color: rgba(0,0,0,0);
opacity: 1;
top: 11px;
right: 6px;
}
.mx_RoomTile_unreadNotify .mx_RoomTile_badge {
@ -86,41 +168,21 @@ limitations under the License.
background-color: #ff0064;
}
.mx_RoomTile_unread,
.mx_RoomTile_highlight {
font-weight: bold;
.mx_RoomTile_read .mx_RoomTile_badge {
background-color: rgb(214, 214, 214);
opacity: 0;
}
/* the inner highlight span has 4px of padding on it, so we shrink the _avatar by 4px and grow the _name by 4px to fit it in */
.mx_RoomTile_selected .mx_RoomTile_name {
padding-right: 19px;
}
.mx_RoomTile_selected .mx_RoomTile_avatar {
padding-right: 7px;
.mx_RoomTile_unread, .mx_RoomTile_highlight {
font-weight: 800;
}
/* leave room for the badge, if present.
N.B. this has to come after the above _selected width tweaks */
.mx_RoomTile_unreadNotify .mx_RoomTile_name,
.mx_RoomTile_highlight .mx_RoomTile_name {
padding-right: 40px;
}
.mx_RoomTile_selected .mx_RoomTile_name span {
display: inline-block;
position: relative;
width: 100%;
padding: 4px;
margin-top: -4px;
margin-bottom: -4px;
border-radius: 2px;
.mx_RoomTile_selected {
background-color: rgba(118,207,166,0.2);
}
/* stop the span from overlapping with the badge */
.mx_RoomTile_unreadNotify.mx_RoomTile_selected .mx_RoomTile_name span,
.mx_RoomTile_highlight.mx_RoomTile_selected .mx_RoomTile_name span {
padding-right: 22px;
.mx_RoomTile .mx_RoomTile_name.mx_RoomTile_badgeShown {
width: 144px;
}
.mx_RoomTile_arrow {

47
src/skins/vector/css/matrix-react-sdk/views/settings/DevicesPanel.css Normal file
View file

@ -0,0 +1,47 @@
/*
Copyright 2016 OpenMarket Ltd
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_DevicesPanel {
display: table;
table-layout: fixed;
width: 880px;
border-spacing: 2px;
}
.mx_DevicesPanel_header {
display: table-header-group;
font-weight: bold;
}
.mx_DevicesPanel_header > div {
display: table-cell;
}
.mx_DevicesPanel_header .mx_DevicesPanel_deviceLastSeen {
width: 30%;
}
.mx_DevicesPanel_header .mx_DevicesPanel_deviceButtons {
width: 20%;
}
.mx_DevicesPanel_device {
display: table-row;
}
.mx_DevicesPanel_device > div {
display: table-cell;
}

13
src/skins/vector/css/vector-web/structures/LeftPanel.css
View file

@ -51,6 +51,10 @@ limitations under the License.
overflow-y: auto;
}
.mx_LeftPanel.collapsed .mx_BottomLeftMenu {
flex: 0 0 120px;
}
.mx_LeftPanel .mx_BottomLeftMenu {
-webkit-box-ordinal-group: 3;
-moz-box-ordinal-group: 3;
@ -59,10 +63,11 @@ limitations under the License.
order: 3;
border-top: 1px solid rgba(0, 0, 0, 0.1);
margin-left: 18px;
margin-right: 18px;
margin-left: 16px; /* gutter */
margin-right: 16px; /* gutter */
-webkit-flex: 0 0 60px;
flex: 0 0 60px;
z-index: 1;
}
.mx_LeftPanel .mx_BottomLeftMenu_options {
@ -95,3 +100,7 @@ limitations under the License.
.mx_LeftPanel .mx_BottomLeftMenu_settings {
float: right;
}
.mx_LeftPanel.collapsed .mx_BottomLeftMenu_settings {
float: none;
}

25
src/skins/vector/css/vector-web/structures/RightPanel.css
View file

@ -43,7 +43,7 @@ limitations under the License.
/** Fixme - factor this out with the main header **/
.mx_RightPanel_headerButtonGroup {
margin-top: 25px;
margin-top: 6px;
float: left;
background-color: #fff;
margin-left: -4px;
@ -55,34 +55,27 @@ limitations under the License.
vertical-align: middle;
padding-left: 15px;
padding-right: 15px;
text-align: center;
position: relative;
}
.mx_RightPanel_headerButton object {
pointer-events: none;
padding-bottom: 3px;
}
.mx_RightPanel_headerButton_highlight {
position: absolute;
bottom: -2px;
left: 10px;
width: 25px;
height: 4px;
background-color: #76cfa6;
height: 5px;
border-radius: 5px;
background-color: rgba(118, 207, 166, 0.2);
}
.mx_RightPanel_headerButton_badge {
position: absolute;
top: 4px;
left: 28px;
font-size: 12px;
background-color: #76cfa6;
color: #fff;
font-size: 11px;
color: #76cfa6;
font-weight: bold;
border-radius: 20px;
padding-left: 4px;
padding-right: 4px;
padding-top: 0px;
padding-bottom: 2px;
}
.mx_RightPanel .mx_MemberList,

4
src/skins/vector/css/vector-web/structures/RoomSubList.css
View file

@ -25,8 +25,8 @@ limitations under the License.
color: #3d3b39;
font-weight: 600;
font-size: 13px;
padding-left: 12px;
padding-right: 12px;
padding-left: 16px; /* gutter */
padding-right: 16px; /* gutter */
margin-top: 8px;
margin-bottom: 4px;
cursor: pointer;

25
src/skins/vector/css/vector-web/views/context_menus/MessageContextMenu.css Normal file
View file

@ -0,0 +1,25 @@
/*
Copyright 2015, 2016 OpenMarket Ltd
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_MessageContextMenu_field {
padding: 3px 6px 3px 6px;
cursor: pointer;
white-space: nowrap;
}
.mx_MessageContextMenu_field.mx_MessageContextMenu_fieldSet {
font-weight: bold;
}

56
src/skins/vector/css/vector-web/views/context_menus/NotificationStateContextMenu.css Normal file
View file

@ -0,0 +1,56 @@
/*
Copyright 2015, 2016 OpenMarket Ltd
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_NotificationStateContextMenu_picker {
position: absolute;
top: 16px;
left: 5px;
}
.mx_NotificationStateContextMenu_field {
padding-top: 4px;
padding-right: 6px;
padding-bottom: 10px;
padding-left: 20px;
cursor: pointer;
white-space: nowrap;
display: flex;
align-items: center;
}
.mx_NotificationStateContextMenu_field.mx_NotificationStateContextMenu_fieldSet {
font-weight: bold;
padding-left: 8px;
}
.mx_NotificationStateContextMenu_field.mx_NotificationStateContextMenu_fieldDisabled {
color: rgba(0, 0, 0, 0.2);
}
.mx_NotificationStateContextMenu_icon {
padding-right: 4px;
padding-left: 4px;
}
.mx_NotificationStateContextMenu_activeIcon {
display: none;
position: relative;
left: -5px;
}
.mx_NotificationStateContextMenu_fieldSet .mx_NotificationStateContextMenu_activeIcon {
display: inline-block;
}

1
src/skins/vector/css/vector-web/views/elements/ImageView.css
View file

@ -69,6 +69,7 @@ limitations under the License.
.mx_ImageView_labelWrapper {
position: absolute;
top: 0px;
right: 0px;
height: 100%;
overflow: auto;
pointer-events: all;

8
src/skins/vector/css/vector-web/views/globals/MatrixToolbar.css
View file

@ -33,6 +33,11 @@ limitations under the License.
margin-top: -2px;
}
.mx_MatrixToolbar_content {
-webkit-flex: 1;
flex: 1;
}
.mx_MatrixToolbar_link
{
color: #fff ! important;
@ -41,10 +46,7 @@ limitations under the License.
}
.mx_MatrixToolbar_close {
-webkit-flex: 1;
flex: 1;
cursor: pointer;
text-align: right;
}
.mx_MatrixToolbar_close img {

5
src/skins/vector/css/vector-web/views/rooms/RoomDropTarget.css
View file

@ -16,8 +16,8 @@ limitations under the License.
.mx_RoomDropTarget {
font-size: 13px;
margin-left: 10px;
margin-right: 15px;
margin-left: 18px;
margin-right: 18px;
padding-top: 5px;
padding-bottom: 5px;
border: 1px dashed #76cfa6;
@ -28,6 +28,7 @@ limitations under the License.
.collapsed .mx_RoomDropTarget {
margin-right: 10px;
margin-left: 10px;
}
.mx_RoomDropTarget_placeholder {

16
src/skins/vector/css/vector-web/views/rooms/RoomTooltip.css
View file

@ -14,19 +14,19 @@ See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_RoomTooltip_chevron {
position: absolute;
left: -9px;
top: 7px;
}
.mx_RoomTooltip {
display: none;
position: fixed;
border: 1px solid #a4a4a4;
border-radius: 8px;
background-color: #fff;
z-index: 1000;
left: 64px;
z-index: 2000;
left: 52px;
padding: 6px;
}
.mx_RoomTooltip_chevron {
position: absolute;
left: -9px;
top: 8px;
}

6
src/skins/vector/css/vector-web/views/settings/Notifications.css
View file

@ -21,20 +21,20 @@ limitations under the License.
.mx_UserNotifSettings_inputCell {
display: table-cell;
padding-bottom: 21px;
padding-bottom: 8px;
padding-right: 8px;
width: 16px;
}
.mx_UserNotifSettings_labelCell
{
padding-bottom: 21px;
padding-bottom: 8px;
width: 400px;
display: table-cell;
}
.mx_UserNotifSettings_pushRulesTableWrapper {
padding-bottom: 21px;
padding-bottom: 8px;
}
.mx_UserNotifSettings_pushRulesTable {