imterah/element-portable
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Merge remote-tracking branch 'vector-im/develop' into travis/presence

Browse source
This commit is contained in:
Travis Ralston 2017-10-25 11:27:22 -06:00
commit 45ca890f68
57 changed files with 10231 additions and 841 deletions
Download patch file Download diff file Expand all files Collapse all files

9
src/skins/vector/css/_common.scss
View file

@ -38,8 +38,8 @@ body {
-webkit-font-smoothing: subpixel-antialiased;
}
div.error {
color: red;
div.error, div.warning {
color: $warning-color;
}
h2 {
@ -87,6 +87,11 @@ textarea {
transition: opacity 0.2s ease-in-out;
}
.mx_fadable.mx_fadable_faded {
opacity: 0.3;
pointer-events: none;
}
/* XXX: critical hack to GeminiScrollbar to allow them to work in FF 42 and Chrome 48.
Stop the scrollbar view from pushing out the container's overall sizing, which causes
flexbox to adapt to the new size and cause the view to keep growing.

113
src/skins/vector/css/matrix-react-sdk/structures/_GroupView.scss
View file

@ -19,6 +19,9 @@ limitations under the License.
width: 100%;
margin-left: auto;
margin-right: auto;
display: flex;
flex-direction: column;
overflow: hidden;
}
.mx_GroupView_error {
@ -27,15 +30,15 @@ limitations under the License.
.mx_GroupView_header {
max-width: 960px;
margin: auto;
height: 70px;
min-height: 70px;
align-items: center;
display: flex;
margin-bottom: 20px;
padding-bottom: 10px;
}
.mx_GroupView_header_view {
border-bottom: 1px solid #e5e5e5;
border-bottom: 1px solid $primary-hairline-color;
padding-bottom: 0px;
}
.mx_GroupView_header_avatar, .mx_GroupView_header_info {
@ -53,6 +56,23 @@ limitations under the License.
pointer-events: none;
}
.mx_GroupView_editable {
border-bottom: 1px solid $strong-input-border-color ! important;
min-width: 150px;
cursor: text;
}
.mx_GroupView_editable:focus {
border-bottom: 1px solid $accent-color ! important;
outline: none;
box-shadow: none;
}
.mx_GroupView_header_name:hover div:not(.mx_GroupView_editable) {
color: $accent-color;
cursor: pointer;
}
.mx_GroupView_avatarPicker {
position: relative;
}
@ -102,10 +122,6 @@ limitations under the License.
border-bottom: 1px solid transparent;
}
.mx_GroupView_header_name input, .mx_GroupView_header_shortDesc input {
width: 400px;
}
.mx_GroupView_header_shortDesc {
vertical-align: bottom;
float: left;
@ -133,10 +149,68 @@ limitations under the License.
top: 5px;
}
.mx_GroupView_body {
flex-grow: 1;
}
.mx_GroupView_rooms {
flex-grow: 1;
display: flex;
flex-direction: column;
min-height: 200px;
user-select: none;
}
.mx_GroupView h3 {
text-transform: uppercase;
color: $h3-color;
font-weight: 600;
font-size: 13px;
margin-bottom: 10px;
}
.mx_GroupView_rooms_header .mx_AccessibleButton {
padding-left: 14px;
margin-bottom: 14px;
height: 24px;
}
.mx_GroupView_group {
border-top: 1px solid $primary-hairline-color;
}
.mx_GroupView_group_disabled {
opacity: 0.3;
pointer-events: none;
}
.mx_GroupView_rooms_header_addRow_button {
display: inline-block;
}
.mx_GroupView_rooms_header_addRow_button object {
pointer-events: none;
}
.mx_GroupView_rooms_header_addRow_label {
display: inline-block;
vertical-align: top;
line-height: 24px;
padding-left: 28px;
color: $accent-color;
}
.mx_GroupView_rooms .mx_RoomDetailList {
flex-grow: 1;
border-top: 1px solid $primary-hairline-color;
padding-top: 10px;
}
.mx_GroupView .mx_RoomView_messageListWrapper {
justify-content: flex-start;
}
.mx_GroupView_membershipSection {
margin-left: auto;
margin-right: auto;
margin-bottom: 11px;
color: $greyed-fg-color;
}
@ -158,6 +232,15 @@ limitations under the License.
margin-left: 8px;
}
.mx_GroupView_memberSettings_toggle label {
cursor: pointer;
user-select: none;
}
.mx_GroupView_memberSettings input {
margin-right: 6px;
}
.mx_GroupView_featuredThings {
margin-top: 20px;
}
@ -215,7 +298,11 @@ limitations under the License.
display: none;
}
.mx_GroupView_editLongDesc {
width: 100%;
.mx_GroupView_body .gm-scroll-view > *{
margin: 0px 50px 11px 68px;
}
.mx_GroupView_groupDesc textarea {
width: 50%;
height: 150px;
}

108
src/skins/vector/css/matrix-react-sdk/structures/_MyGroups.scss
View file

@ -24,14 +24,38 @@ limitations under the License.
margin-left: 0px;
}
.mx_MyGroups_joinCreateBox {
display: table;
margin-bottom: 30px;
.mx_MyGroups_header {
/* Keep mid-point of create button aligned with icon in page header */
margin-left: 2px;
display: flex;
flex-wrap: wrap;
}
.mx_MyGroups_createBox, .mx_MyGroups_joinBox {
display: table-cell;
width: 40%;
.mx_MyGroups_headerCard {
flex: 1 0 50%;
margin-bottom: 30px;
min-width: 400px;
display: flex;
align-items: center;
}
.mx_MyGroups_headerCard .mx_MyGroups_headerCard_button {
margin-right: 13px;
height: 50px;
}
.mx_MyGroups_headerCard_button object {
/* Otherwise the SVG object absorbs clicks and the button doesn't work */
pointer-events: none;
}
.mx_MyGroups_headerCard_header {
font-weight: bold;
margin-bottom: 10px;
}
.mx_MyGroups_headerCard_content {
padding-right: 15px;
}
/* Until the button is wired up */
@ -39,21 +63,61 @@ limitations under the License.
visibility: hidden;
}
.mx_MyGroups_joinCreateHeader {
font-weight: bold;
margin-bottom: 10px;
}
.mx_MyGroups_joinCreateButton {
float: left;
margin: 10px;
}
.mx_MyGroups_joinCreateButton object {
/* Otherwise the SVG object absorbs clicks and the button doesn't work */
pointer-events: none;
}
.mx_MyGroups_content {
clear: left;
margin-left: 2px;
}
.mx_MyGroups_placeholder {
background-color: $group-my-groups-placeholder-bg;
color: $group-my-groups-placeholder-fg;
line-height: 400px;
border-radius: 10px;
text-align: center;
}
.mx_MyGroups_joinedGroups {
display: flex;
flex-direction: row;
flex-flow: wrap;
justify-content: space-around;
}
.mx_MyGroups_joinedGroups .mx_GroupTile {
min-width: 300px;
flex: 1 0 25%;
height: 75px;
margin-bottom: 15px;
margin-right: 10px;
display: flex;
align-items: flex-start;
cursor: pointer;
}
.mx_GroupTile_profile {
margin-left: 10px;
display: flex;
flex-direction: column;
justify-content: center;
}
.mx_GroupTile_profile h3.mx_GroupTile_name {
margin: 0px;
font-size: 15px;
}
.mx_GroupTile_profile .mx_GroupTile_groupId {
font-size: 13px;
}
.mx_GroupTile_profile .mx_GroupTile_desc {
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
font-size: 13px;
max-height: 36px;
overflow: hidden;
}
.mx_GroupTile_profile .mx_GroupTile_groupId {
opacity: 0.7;
}

41
src/skins/vector/css/matrix-react-sdk/structures/_RoomView.scss
View file

@ -80,17 +80,32 @@ limitations under the License.
max-width: 1920px ! important;
}
.mx_RoomView_topUnreadMessagesBar {
.mx_RoomView_body {
order: 3;
flex: 1 1 0;
flex-direction: column;
display: flex;
}
.mx_RoomView_body .mx_RoomView_topUnreadMessagesBar {
order: 1;
}
.mx_RoomView_body .mx_RoomView_messagePanel {
order: 2;
}
.mx_RoomView_body .mx_RoomView_statusArea {
order: 3;
}
.mx_RoomView_messagePanel {
.mx_RoomView_body .mx_MessageComposer {
order: 4;
}
flex: 1 1 0;
.mx_RoomView_messagePanel {
width: 100%;
overflow-y: auto;
}
@ -131,18 +146,6 @@ limitations under the License.
clear: both;
}
.mx_RoomView_invitePrompt {
order: 2;
min-width: 0px;
max-width: 960px;
width: 100%;
margin: auto;
margin-top: 12px;
margin-bottom: 12px;
}
li.mx_RoomView_myReadMarker_container {
height: 0px;
margin: 0px;
@ -160,8 +163,6 @@ hr.mx_RoomView_myReadMarker {
}
.mx_RoomView_statusArea {
order: 5;
width: 100%;
flex: 0 0 auto;
@ -236,8 +237,6 @@ hr.mx_RoomView_myReadMarker {
}
.mx_RoomView .mx_MessageComposer {
order: 6;
width: 100%;
flex: 0 0 auto;
margin-right: 2px;

8
src/skins/vector/css/matrix-react-sdk/views/dialogs/_ChatInviteDialog.scss
View file

@ -14,6 +14,14 @@ See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_ChatInviteDialog {
/* XXX: padding-left is on mx_Dialog but padding-right has subsequently
* been added on other dialogs. Surely all our dialogs should have consistent
* right hand padding?
*/
padding-right: 58px;
}
/* Using a textarea for this element, to circumvent autofill */
.mx_ChatInviteDialog_input,
.mx_ChatInviteDialog_input:focus

4
src/skins/vector/css/matrix-react-sdk/views/rooms/_EntityTile.scss
View file

@ -56,6 +56,8 @@ limitations under the License.
overflow: hidden;
font-size: 14px;
text-overflow: ellipsis;
white-space: nowrap;
max-width: 135px;
}
.mx_EntityTile_details {
@ -66,8 +68,6 @@ limitations under the License.
.mx_EntityTile_name_hover {
font-size: 13px;
overflow: hidden;
text-overflow: ellipsis;
}
.mx_EntityTile_chevron {

3
src/skins/vector/css/matrix-react-sdk/views/rooms/_EventTile.scss
View file

@ -67,8 +67,9 @@ limitations under the License.
}
.mx_EventTile .mx_SenderProfile .mx_Flair img {
vertical-align: -3px;
vertical-align: -2px;
margin-right: 2px;
border-radius: 8px;
}
.mx_EventTile .mx_MessageTimestamp {

1
src/skins/vector/css/matrix-react-sdk/views/rooms/_MemberList.scss
View file

@ -92,6 +92,7 @@ limitations under the License.
}
*/
.mx_GroupMemberList_invited h2,
.mx_MemberList_invited h2 {
text-transform: uppercase;
color: $h3-color;

14
src/skins/vector/css/matrix-react-sdk/views/rooms/_RoomHeader.scss
View file

@ -60,6 +60,10 @@ limitations under the License.
padding-right: 12px;
}
.mx_RoomHeader_textButton_danger {
background-color: $warning-color;
}
.mx_RoomHeader_cancelButton {
order: 2;
cursor: pointer;
@ -145,8 +149,8 @@ limitations under the License.
.mx_RoomHeader_avatarPicker_remove {
position: absolute;
top: 10px;
left: 45px;
top: -11px;
right: -9px;
}
.mx_RoomHeader_name:hover div:not(.mx_RoomHeader_editable) {
@ -194,8 +198,12 @@ limitations under the License.
object-fit: cover;
}
.mx_RoomHeader_avatarPicker {
margin-top: 23px;
position: relative;
}
.mx_RoomHeader_avatarPicker_edit {
position: absolute;
margin-left: 16px;
margin-top: 4px;
}

3
src/skins/vector/css/themes/_base.scss
View file

@ -22,7 +22,10 @@ $warning-color: #ff0064;
$mention-user-pill-bg-color: #ff0064;
$other-user-pill-bg-color: rgba(0, 0, 0, 0.1);
// groups
$group-alert-color: #774f7e;
$group-my-groups-placeholder-bg: #f7f7f7;
$group-my-groups-placeholder-fg: #888;
$preview-bar-bg-color: #f7f7f7;

3
src/skins/vector/css/themes/_dark.scss
View file

@ -20,6 +20,9 @@ $focus-brightness: 200%;
// red warning colour
$warning-color: #ff0064;
// groups
$group-my-groups-placeholder-bg: #454545;
$other-user-pill-bg-color: rgba(255, 255, 255, 0.1);
$preview-bar-bg-color: #333;

12
src/skins/vector/css/vector-web/structures/_RightPanel.scss
View file

@ -94,30 +94,26 @@ limitations under the License.
}
.mx_RightPanel_footer .mx_RightPanel_invite {
line-height: 35px;
font-size: 14px;
color: $primary-fg-color;
padding-top: 13px;
padding-left: 5px;
cursor: pointer;
display: flex;
align-items: center;
}
.collapsed .mx_RightPanel_footer .mx_RightPanel_invite {
display: none;
}
.mx_RightPanel_invite .mx_RightPanel_icon {
display: inline-block;
}
.mx_RightPanel_invite .mx_RightPanel_icon object {
pointer-events: none;
}
.mx_RightPanel_invite .mx_RightPanel_message {
display: inline-block;
vertical-align: top;
padding-left: 10px
padding-left: 10px;
line-height: 18px;
}
.mx_MatrixChat_useCompactLayout {