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

WIP of new CSS

Browse source
This commit is contained in:
Matthew Hodgson 2015-10-23 02:32:49 +01:00
parent 82affac438
commit 7f65ba506b
39 changed files with 156 additions and 98 deletions
Download patch file Download diff file Expand all files Collapse all files

9
src/skins/vector/css/molecules/EventTile.css
View file

@ -22,10 +22,10 @@ limitations under the License.
}
.mx_EventTile_avatar {
padding-left: 12px;
padding-left: 18px;
padding-right: 12px;
margin-left: -64px;
margin-top: -7px;
margin-top: -4px;
float: left;
}
@ -48,9 +48,8 @@ limitations under the License.
}
.mx_EventTile .mx_MessageTimestamp {
color: #454545;
opacity: 0.5;
font-size: 14px;
color: #acacac;
font-size: 12px;
float: right;
}

4
src/skins/vector/css/molecules/MImageTile.css
View file

@ -23,12 +23,12 @@ limitations under the License.
}
.mx_MImageTile_download {
color: #80cef4;
color: #76cfa6;
cursor: pointer;
}
.mx_MImageTile_download a {
color: #80cef4;
color: #76cfa6;
text-decoration: none;
}

8
src/skins/vector/css/molecules/MemberTile.css
View file

@ -27,8 +27,8 @@ limitations under the License.
padding-top: 3px;
padding-bottom: 3px;
vertical-align: middle;
width: 40px;
height: 40px;
width: 36px;
height: 36px;
position: relative;
}
@ -60,8 +60,8 @@ limitations under the License.
.mx_MemberTile_power {
position: absolute;
width: 48px;
height: 48px;
width: 44px;
height: 44px;
left: 10px;
top: -1px;
}

25
src/skins/vector/css/molecules/MessageComposer.css
View file

@ -15,30 +15,29 @@ limitations under the License.
*/
.mx_MessageComposer_wrapper {
max-width: 720px;
height: 50px;
max-width: 960px;
height: 70px;
vertical-align: middle;
margin: auto;
background-color: #fff;
border-radius: 25px;
border: 1px solid #a9dbf4;
border-top: 2px solid #e1dddd;
}
.mx_MessageComposer_row {
display: table-row;
width: 100%;
height: 50px;
height: 70px;
}
.mx_MessageComposer .mx_MessageComposer_avatar {
display: table-cell;
padding-left: 5px;
padding-right: 10px;
height: 50px;
padding-left: 10px;
padding-right: 20px;
height: 70px;
}
.mx_MessageComposer .mx_MessageComposer_avatar img {
margin-top: 5px;
margin-top: 18px;
border-radius: 20px;
background-color: #dbdbdb;
}
@ -47,7 +46,7 @@ limitations under the License.
display: table-cell;
width: 100%;
vertical-align: middle;
height: 50px;
height: 70px;
}
.mx_MessageComposer_input textarea {
@ -64,12 +63,16 @@ limitations under the License.
box-shadow: none;
/* needed for FF */
font-family: 'Lato', Helvetica, Arial, Sans-Serif;
font-family: 'Myriad Pro', Helvetica, Arial, Sans-Serif;
}
/* hack for FF as vertical alignment of custom placeholder text is broken */
.mx_MessageComposer_input textarea::-moz-placeholder {
line-height: 100%;
color: #76cfa6;
}
.mx_MessageComposer_input textarea::-webkit-input-placeholder {
color: #76cfa6;
}
.mx_MessageComposer_upload {

14
src/skins/vector/css/molecules/RoomHeader.css
View file

@ -18,10 +18,10 @@ limitations under the License.
}
.mx_RoomHeader_wrapper {
max-width: 720px;
max-width: 960px;
margin: auto;
height: 88px;
border-bottom: 1px solid #a8dbf3;
border-bottom: 1px solid #eeeeee;
display: -webkit-box;
display: -moz-box;
@ -47,7 +47,7 @@ limitations under the License.
.mx_RoomHeader_textButton {
height: 48px;
margin-top: 18px;
background-color: #80cef4;
background-color: #76cfa6;
border-radius: 48px;
margin-right: 8px;
color: #fff;
@ -92,7 +92,7 @@ limitations under the License.
.mx_RoomHeader_simpleHeader {
line-height: 88px;
color: #80cef4;
color: #76cfa6;
font-weight: 400;
font-size: 20px;
overflow: hidden;
@ -102,8 +102,8 @@ limitations under the License.
.mx_RoomHeader_name {
vertical-align: middle;
height: 28px;
color: #80cef4;
font-weight: 400;
color: #454545;
font-weight: 800;
font-size: 20px;
padding-left: 16px;
padding-right: 16px;
@ -133,7 +133,7 @@ limitations under the License.
vertical-align: bottom;
float: left;
max-height: 38px;
color: #70b5d7;
color: #454545;
font-weight: 300;
padding-left: 16px;
padding-right: 16px;

2
src/skins/vector/css/molecules/RoomSettings.css
View file

@ -61,7 +61,7 @@ limitations under the License.
font-weight: 400;
font-size: 16px;
color: #fff;
background-color: #80cef4;
background-color: #76cfa6;
width: auto;
margin: auto;
padding: 6px;

39
src/skins/vector/css/molecules/RoomTile.css
View file

@ -17,18 +17,19 @@ limitations under the License.
.mx_RoomTile {
cursor: pointer;
display: table-row;
color: #818794;
font-size: 14px;
}
.mx_RoomTile_avatar {
display: table-cell;
padding-right: 10px;
background: #eaf5f0;
padding-right: 8px;
padding-top: 3px;
padding-bottom: 3px;
padding-left: 10px;
padding-left: 18px;
vertical-align: middle;
width: 36px;
height: 36px;
width: 24px;
height: 24px;
position: relative;
}
@ -43,6 +44,8 @@ limitations under the License.
overflow: hidden;
text-overflow: ellipsis;
padding-right: 16px;
color: #454545;
opacity: 0.8;
}
.collapsed .mx_RoomTile_name {
@ -63,7 +66,7 @@ limitations under the License.
}
.mx_RoomTile_badge {
background-color: #80cef4;
background-color: #76cfa6;
color: #fff;
border-radius: 26px;
font-weight: 400;
@ -75,6 +78,7 @@ limitations under the License.
}
*/
/*
.mx_RoomTile_badge {
background-color: #ff0064;
border: 3px solid #fff;
@ -85,20 +89,37 @@ limitations under the License.
right: 9px;
bottom: 3px;
}
*/
.mx_RoomTile_highlight .mx_RoomTile_sidebadge,
.mx_RoomTile_unread .mx_RoomTile_sidebadge {
background-color: #76cfa6;
width: 4px;
position: absolute;
left: 0px;
}
.mx_RoomTile_unread,
.mx_RoomTile_highlight,
.mx_RoomTile_invited
{
font-weight: bold;
color: #000;
}
.mx_RoomTile_selected {
background-color: #f3f8fa;
color: #80cef4;
font-weight: bold;
}
.mx_RoomTile.mx_RoomTile_selected {
background: url('img/selected.png');
background-repeat: no-repeat;
background-position: right center;
}
.mx_RoomTile_arrow {
position: absolute;
right: 0px;
}
.mx_RoomTile:hover {
}