mirror of
https://github.com/SchildiChat/element-web.git
synced 2024-10-01 01:26:12 -04:00
switch to Open Sans, juggling font-size appropriately (as Open Sans is physically larger for the same point size as Myriad Pro, irritatingly), and fix some really weird baseline CSS bugs in read receipts that were introduced. Hopefully this doesn't re-introduce the intermittent baseline offset bug for the initials on Chrome & FF
This commit is contained in:
parent
4409f07c2e
commit
2345624d31
@ -87,13 +87,13 @@ limitations under the License.
|
||||
}
|
||||
|
||||
.mx_ImageView_name {
|
||||
font-size: 20px;
|
||||
font-size: 18px;
|
||||
margin-bottom: 6px;
|
||||
pointer-events: all;
|
||||
}
|
||||
|
||||
.mx_ImageView_metadata {
|
||||
font-size: 16px;
|
||||
font-size: 15px;
|
||||
opacity: 0.5;
|
||||
pointer-events: all;
|
||||
}
|
||||
@ -105,13 +105,13 @@ limitations under the License.
|
||||
margin-bottom: 6px;
|
||||
border-radius: 5px;
|
||||
background-color: #454545;
|
||||
font-size: 16px;
|
||||
font-size: 14px;
|
||||
padding: 9px;
|
||||
border: 1px solid #fff;
|
||||
}
|
||||
|
||||
.mx_ImageView_size {
|
||||
font-size: 12px;
|
||||
font-size: 11px;
|
||||
}
|
||||
|
||||
.mx_ImageView_link {
|
||||
@ -121,7 +121,7 @@ limitations under the License.
|
||||
|
||||
.mx_ImageView_button {
|
||||
pointer-events: all;
|
||||
font-size: 16px;
|
||||
font-size: 15px;
|
||||
opacity: 0.5;
|
||||
margin-top: 18px;
|
||||
cursor: pointer;
|
||||
|
@ -15,11 +15,12 @@ limitations under the License.
|
||||
*/
|
||||
|
||||
.mx_MemberAvatar {
|
||||
position: relative;
|
||||
/* remove position: relative as it breaks on FF - we have to ensure the parent element to the memberavatar has a position: relative instead. */;
|
||||
}
|
||||
|
||||
.mx_MemberAvatar_initial {
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
speak: none;
|
||||
@ -28,4 +29,5 @@ limitations under the License.
|
||||
|
||||
.mx_MemberAvatar_image {
|
||||
border-radius: 20px;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
@ -22,13 +22,13 @@ html {
|
||||
}
|
||||
|
||||
body {
|
||||
/* Myriad Pro lacks combining diacritics, so these will fall through
|
||||
/* Open Sans lacks combining diacritics, so these will fall through
|
||||
to the next font. Helevetica's diacritics however do not combine
|
||||
nicely with Myriad Pro (on OSX, at least) and result in a huge
|
||||
nicely with Open Sans (on OSX, at least) and result in a huge
|
||||
horizontal mess. Arial empirically gets it right, hence prioritising
|
||||
Arial here. */
|
||||
font-family: 'Myriad Pro', Arial, Helvetica, Sans-Serif;
|
||||
font-size: 16px;
|
||||
font-family: 'Open Sans', Arial, Helvetica, Sans-Serif;
|
||||
font-size: 15px;
|
||||
color: #454545;
|
||||
border: 0px;
|
||||
margin: 0px;
|
||||
@ -41,7 +41,7 @@ div.error {
|
||||
h2 {
|
||||
color: #454545;
|
||||
font-weight: 400;
|
||||
font-size: 20px;
|
||||
font-size: 18px;
|
||||
margin-top: 16px;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
@ -129,7 +129,7 @@ a:visited {
|
||||
text-align: center;
|
||||
z-index: 4010;
|
||||
font-weight: 300;
|
||||
font-size: 16px;
|
||||
font-size: 15px;
|
||||
position: relative;
|
||||
border-radius: 8px;
|
||||
max-width: 80%;
|
||||
@ -172,7 +172,7 @@ a:visited {
|
||||
height: 36px;
|
||||
border-radius: 36px;
|
||||
font-weight: 400;
|
||||
font-size: 16px;
|
||||
font-size: 15px;
|
||||
color: #fff;
|
||||
background-color: #76cfa6;
|
||||
margin-left: 8px;
|
||||
@ -187,6 +187,6 @@ a:visited {
|
||||
padding: 12px;
|
||||
border-bottom: 1px solid #a4a4a4;
|
||||
font-weight: bold;
|
||||
font-size: 20px;
|
||||
font-size: 18px;
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
@ -25,9 +25,10 @@ limitations under the License.
|
||||
padding-left: 18px;
|
||||
padding-right: 12px;
|
||||
margin-left: -73px;
|
||||
margin-top: -4px;
|
||||
margin-top: -2px;
|
||||
float: left;
|
||||
position: relative;
|
||||
top: 0px;
|
||||
}
|
||||
|
||||
.mx_EventTile_avatar img {
|
||||
@ -42,7 +43,7 @@ limitations under the License.
|
||||
.mx_EventTile .mx_SenderProfile {
|
||||
color: #454545;
|
||||
opacity: 0.5;
|
||||
font-size: 14px;
|
||||
font-size: 13px;
|
||||
margin-bottom: 4px;
|
||||
display: block;
|
||||
overflow-y: hidden;
|
||||
@ -50,7 +51,7 @@ limitations under the License.
|
||||
|
||||
.mx_EventTile .mx_MessageTimestamp {
|
||||
color: #acacac;
|
||||
font-size: 12px;
|
||||
font-size: 11px;
|
||||
}
|
||||
|
||||
.mx_EventTile_line {
|
||||
@ -74,6 +75,7 @@ limitations under the License.
|
||||
font-family: inherit ! important;
|
||||
white-space: normal ! important;
|
||||
line-height: inherit ! important;
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
.mx_MessageTile_content .markdown-body h1,
|
||||
@ -175,6 +177,6 @@ limitations under the License.
|
||||
|
||||
.mx_EventTile_readAvatarRemainder {
|
||||
color: #acacac;
|
||||
font-size: 12px;
|
||||
font-size: 11px;
|
||||
position: absolute;
|
||||
}
|
||||
|
@ -38,7 +38,7 @@ limitations under the License.
|
||||
|
||||
.mx_MemberInfo_profileField {
|
||||
font-color: #999999;
|
||||
font-size: 14px;
|
||||
font-size: 13px;
|
||||
position: relative;
|
||||
background-color: #fff;
|
||||
}
|
||||
@ -51,7 +51,7 @@ limitations under the License.
|
||||
cursor: pointer;
|
||||
width: 100px;
|
||||
text-align: center;
|
||||
font-size: 12px;
|
||||
font-size: 11px;
|
||||
background-color: #888;
|
||||
color: #fff;
|
||||
font-weight: bold;
|
||||
|
@ -25,8 +25,8 @@ limitations under the License.
|
||||
display: table-cell;
|
||||
padding-left: 3px;
|
||||
padding-right: 12px;
|
||||
padding-top: 2px;
|
||||
padding-bottom: 0px;
|
||||
padding-top: 4px;
|
||||
padding-bottom: 4px;
|
||||
vertical-align: middle;
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
@ -55,13 +55,13 @@ limitations under the License.
|
||||
}
|
||||
|
||||
.mx_MemberTile_userId {
|
||||
font-size: 14px;
|
||||
font-size: 13px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.mx_MemberTile_presence {
|
||||
font-size: 12px;
|
||||
font-size: 11px;
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
|
@ -59,7 +59,7 @@ limitations under the License.
|
||||
box-shadow: none;
|
||||
|
||||
/* needed for FF */
|
||||
font-family: 'Myriad Pro', Arial, Helvetica, Sans-Serif;
|
||||
font-family: 'Open Sans', Arial, Helvetica, Sans-Serif;
|
||||
}
|
||||
|
||||
/* hack for FF as vertical alignment of custom placeholder text is broken */
|
||||
|
@ -15,7 +15,7 @@ limitations under the License.
|
||||
*/
|
||||
|
||||
.mx_RoomDropTarget {
|
||||
font-size: 14px;
|
||||
font-size: 13px;
|
||||
margin-left: 10px;
|
||||
margin-right: 15px;
|
||||
padding-top: 5px;
|
||||
|
@ -91,7 +91,7 @@ limitations under the License.
|
||||
.mx_RoomHeader_simpleHeader {
|
||||
line-height: 83px;
|
||||
color: #454545;
|
||||
font-size: 24px;
|
||||
font-size: 22px;
|
||||
font-weight: bold;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
@ -103,7 +103,7 @@ limitations under the License.
|
||||
height: 28px;
|
||||
color: #454545;
|
||||
font-weight: bold;
|
||||
font-size: 24px;
|
||||
font-size: 22px;
|
||||
padding-left: 19px;
|
||||
padding-right: 16px;
|
||||
text-overflow: ellipsis;
|
||||
@ -141,7 +141,7 @@ limitations under the License.
|
||||
width: 260px;
|
||||
border: 1px solid #c7c7c7;
|
||||
font-weight: 300;
|
||||
font-size: 14px;
|
||||
font-size: 13px;
|
||||
padding: 9px;
|
||||
}
|
||||
|
||||
|
@ -39,7 +39,7 @@ limitations under the License.
|
||||
border-radius: 3px;
|
||||
border: 1px solid #c7c7c7;
|
||||
font-weight: 300;
|
||||
font-size: 14px;
|
||||
font-size: 13px;
|
||||
padding: 9px;
|
||||
margin-top: 6px;
|
||||
}
|
||||
@ -59,7 +59,7 @@ limitations under the License.
|
||||
height: 36px;
|
||||
border-radius: 36px;
|
||||
font-weight: 400;
|
||||
font-size: 16px;
|
||||
font-size: 15px;
|
||||
color: #fff;
|
||||
background-color: #76cfa6;
|
||||
width: auto;
|
||||
|
@ -18,7 +18,7 @@ limitations under the License.
|
||||
cursor: pointer;
|
||||
/* This fixes wrapping of long room names, but breaks drag & drop previews */
|
||||
/* display: table-row; */
|
||||
font-size: 14px;
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
.mx_RoomTile_avatar {
|
||||
|
@ -25,7 +25,7 @@ limitations under the License.
|
||||
display: inline block;
|
||||
border-radius: 3px;
|
||||
border: 1px solid #f0f0f0;
|
||||
font-size: 16px;
|
||||
font-size: 15px;
|
||||
padding: 9px;
|
||||
padding-left: 11px;
|
||||
margin-right: 17px;
|
||||
@ -38,7 +38,7 @@ limitations under the License.
|
||||
border: 0px;
|
||||
border-radius: 36px;
|
||||
font-weight: 400;
|
||||
font-size: 16px;
|
||||
font-size: 15px;
|
||||
color: #fff;
|
||||
background-color: #76cfa6;
|
||||
width: auto;
|
||||
|
@ -25,7 +25,7 @@ limitations under the License.
|
||||
|
||||
.mx_ServerConfig_help:link {
|
||||
opacity: 0.8;
|
||||
font-size: 14px;
|
||||
font-size: 13px;
|
||||
font-weight: 300;
|
||||
color: #4a4a4a;
|
||||
}
|
@ -26,7 +26,7 @@ limitations under the License.
|
||||
border-radius: 3px;
|
||||
border: 1px solid #c7c7c7;
|
||||
font-weight: 300;
|
||||
font-size: 14px;
|
||||
font-size: 13px;
|
||||
padding: 9px;
|
||||
margin-top: 6px;
|
||||
}
|
||||
|
@ -45,13 +45,13 @@ limitations under the License.
|
||||
}
|
||||
|
||||
.mx_MemberList_invite {
|
||||
font-family: 'Myriad Pro', Arial, Helvetica, Sans-Serif;
|
||||
font-family: 'Open Sans', Arial, Helvetica, Sans-Serif;
|
||||
border-radius: 3px;
|
||||
border: 1px solid #f0f0f0;
|
||||
padding: 9px;
|
||||
color: #454545;
|
||||
margin-left: 3px;
|
||||
font-size: 16px;
|
||||
font-size: 15px;
|
||||
margin-bottom: 8px;
|
||||
width: 180px;
|
||||
}
|
||||
@ -69,7 +69,7 @@ limitations under the License.
|
||||
text-transform: uppercase;
|
||||
color: #3d3b39;
|
||||
font-weight: 600;
|
||||
font-size: 14px;
|
||||
font-size: 13px;
|
||||
padding-left: 3px;
|
||||
padding-right: 12px;
|
||||
margin-top: 8px;
|
||||
|
@ -66,7 +66,7 @@ limitations under the License.
|
||||
|
||||
.mx_RightPanel_headerButton_badge {
|
||||
position: absolute;
|
||||
top: 5px;
|
||||
top: 4px;
|
||||
left: 28px;
|
||||
font-size: 12px;
|
||||
background-color: #76cfa6;
|
||||
|
@ -50,7 +50,7 @@ limitations under the License.
|
||||
border-radius: 3px;
|
||||
border: 1px solid #c7c7c7;
|
||||
font-weight: 300;
|
||||
font-size: 14px;
|
||||
font-size: 13px;
|
||||
padding: 9px;
|
||||
margin-top: 12px;
|
||||
margin-bottom: 12px;
|
||||
@ -70,7 +70,7 @@ limitations under the License.
|
||||
|
||||
.mx_RoomDirectory_table th {
|
||||
font-weight: 400;
|
||||
font-size: 12px;
|
||||
font-size: 11px;
|
||||
}
|
||||
|
||||
.mx_RoomDirectory_table tbody {
|
||||
@ -79,7 +79,6 @@ limitations under the License.
|
||||
|
||||
.mx_RoomDirectory_table td {
|
||||
font-weight: 300;
|
||||
font-size: 16px;
|
||||
overflow-x: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
@ -90,7 +89,7 @@ limitations under the License.
|
||||
|
||||
.mx_RoomDirectory_table .mx_RoomDirectory_topic {
|
||||
font-weight: 400;
|
||||
font-size: 12px;
|
||||
font-size: 11px;
|
||||
}
|
||||
|
||||
.mx_RoomDirectory_table td,
|
||||
|
@ -29,7 +29,7 @@ limitations under the License.
|
||||
text-transform: uppercase;
|
||||
color: #3d3b39;
|
||||
font-weight: 600;
|
||||
font-size: 14px;
|
||||
font-size: 13px;
|
||||
padding-left: 12px;
|
||||
padding-right: 12px;
|
||||
margin-top: 8px;
|
||||
|
@ -204,7 +204,7 @@ limitations under the License.
|
||||
|
||||
.mx_RoomView_connectionLostBar_desc {
|
||||
color: #454545;
|
||||
font-size: 14px;
|
||||
font-size: 13px;
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
|
@ -55,7 +55,7 @@ limitations under the License.
|
||||
border-radius: 3px;
|
||||
border: 1px solid #c7c7c7;
|
||||
font-weight: 300;
|
||||
font-size: 14px;
|
||||
font-size: 13px;
|
||||
padding: 9px;
|
||||
margin-bottom: 14px;
|
||||
}
|
||||
@ -68,12 +68,12 @@ limitations under the License.
|
||||
height: 40px;
|
||||
border: 0px;
|
||||
background-color: #76cfa6;
|
||||
font-size: 16px;
|
||||
font-size: 15px;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.mx_Login_label {
|
||||
font-size: 14px;
|
||||
font-size: 13px;
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
@ -85,7 +85,7 @@ limitations under the License.
|
||||
display: block;
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
font-size: 14px;
|
||||
font-size: 13px;
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
@ -97,7 +97,7 @@ limitations under the License.
|
||||
display: block;
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
font-size: 14px;
|
||||
font-size: 13px;
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user