PrivateCoffee/element-web
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 3

Fix some spacing and other tiny things

Browse source 
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
This commit is contained in:
Šimon Brandner 2021-07-24 20:59:15 +02:00
parent 396fd2d012
commit 1f9cd79bcf
No known key found for this signature in database
GPG key ID: 55C211A1226CB17D
2 changed files with 26 additions and 15 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

37
res/css/views/toasts/_IncomingCallToast.scss
View file

@ -23,7 +23,6 @@ limitations under the License.
border-radius: 8px; border-radius: 8px;
flex-direction: row; flex-direction: row;
gap: 8px;
min-width: 250px; min-width: 250px;
box-shadow: 0px 14px 24px rgba(0, 0, 0, 0.08); box-shadow: 0px 14px 24px rgba(0, 0, 0, 0.08);
background-color: $voipcall-plinth-color; // To match mx_Toast background-color: $voipcall-plinth-color; // To match mx_Toast
@ -33,21 +32,27 @@ limitations under the License.
.mx_IncomingCallToast_content { .mx_IncomingCallToast_content {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
margin-left: 8px;
h1, .mx_CallEvent_type { .mx_CallEvent_caller {
margin: 0px;
padding: 0px;
font-size: $font-14px;
line-height: $font-16px;
}
h1 {
font-weight: bold; font-weight: bold;
font-size: $font-15px;
line-height: $font-18px;
margin-top: 2px;
} }
.mx_CallEvent_type { .mx_CallEvent_type {
font-size: $font-12px;
line-height: $font-15px;
color: $tertiary-fg-color;
margin-top: 4px;
margin-bottom: 6px;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
align-items: center;
.mx_CallEvent_type_icon { .mx_CallEvent_type_icon {
height: 16px; height: 16px;
@ -88,7 +93,7 @@ limitations under the License.
.mx_IncomingCallToast_button { .mx_IncomingCallToast_button {
height: 24px; height: 24px;
padding: 0px 12px; padding: 0px 8px;
flex-shrink: 0; flex-shrink: 0;
flex-grow: 1; flex-grow: 1;
margin-right: 0; margin-right: 0;
@ -106,15 +111,21 @@ limitations under the License.
background-color: $button-fg-color; background-color: $button-fg-color;
mask-position: center; mask-position: center;
mask-repeat: no-repeat; mask-repeat: no-repeat;
mask-size: 16px;
width: 16px;
height: 16px;
margin-right: 8px; margin-right: 8px;
} }
} }
&.mx_IncomingCallToast_button_accept span::before {
mask-size: 13px;
width: 13px;
height: 13px;
}
&.mx_IncomingCallToast_button_decline span::before { &.mx_IncomingCallToast_button_decline span::before {
mask-image: url('$(res)/img/element-icons/call/hangup.svg'); mask-image: url('$(res)/img/element-icons/call/hangup.svg');
mask-size: 16px;
width: 16px;
height: 16px;
} }
} }
} }

4
src/toasts/IncomingCallToast.tsx
View file

@ -106,9 +106,9 @@ export default class IncomingCallToast extends React.Component<IProps, IState> {
width={32} width={32}
/> />
<div className={contentClass}> <div className={contentClass}>
<h1> <span className="mx_CallEvent_caller">
{ room ? room.name : _t("Unknown caller") } { room ? room.name : _t("Unknown caller") }
</h1> </span>
<div className="mx_CallEvent_type"> <div className="mx_CallEvent_type">
<div className="mx_CallEvent_type_icon" /> <div className="mx_CallEvent_type_icon" />
{ isVoice ? _t("Voice call") : _t("Video call") } { isVoice ? _t("Voice call") : _t("Video call") }