pengyuthon/odoo_source
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[REF] mail: rtcInvitationCard, review and simplify scss

Browse Source 
Part of the overall v16 SCSS optimization/restyle, task-2704984

task-2853300

closes odoo/odoo#91537

Signed-off-by: Alexandre Kühn (aku) <aku@odoo.com>
This commit is contained in:
xlu-odoo
2022-05-24 17:08:47 +02:00
parent a5cd14ec3a
commit e427dad102
2 changed files with 12 additions and 83 deletions
Download Patch File Download Diff File Expand all files Collapse all files
addons/mail/static/src/components/rtc_invitation_card/rtc_invitation_card.scss
-71
View File
@@ -2,94 +2,23 @@
// Layout
// ------------------------------------------------------------------
.o_RtcInvitationCard {
display: flex;
flex-direction: column;
margin: map-get($spacers, 2);
padding: map-get($spacers, 5);
}
.o_RtcInvitationCard_buttonList {
width: 100%;
display: flex;
margin-top: map-get($spacers, 4);
justify-content: space-around;
align-items: center;
}
.o_RtcInvitationCard_buttonListButton {
padding: map-get($spacers, 2);
}
.o_RtcInvitationCard_buttonListButtonIcon {
margin: map-get($spacers, 3);
}
.o_RtcInvitationCard_partnerInfo {
display: flex;
width: 130px;
flex-direction: column;
justify-content: space-around;
align-items: center;
white-space: nowrap;
}
.o_RtcInvitationCard_partnerInfoImage {
margin-bottom: map-get($spacers, 2);
width: 70%;
height: 70%;
}
.o_RtcInvitationCard_partnerInfoName {
overflow: hidden;
width: 100%;
}
// ------------------------------------------------------------------
// Style
// ------------------------------------------------------------------
.o_RtcInvitationCard {
border-radius: 3px;
background-color: gray('900');
border: 1px solid black;
}
.o_RtcInvitationCard_buttonListButton {
border-radius: 100%;
cursor: pointer;
user-select: none;
border: none;
}
.o_RtcInvitationCard_buttonListAccept {
background-color: theme-color('success');
&:hover {
background-color: darken(theme-color('success'), 10%);
}
}
.o_RtcInvitationCard_buttonListRefuse {
background-color: theme-color('danger');
&:hover {
background-color: darken(theme-color('danger'), 10%);
}
}
.o_RtcInvitationCard_partnerInfoImage {
border: 3px solid gray;
cursor: pointer;
}
.o_RtcInvitationCard_partnerInfoName {
font-weight: bold;
@include text-truncate();
text-align: center;
}
.o_RtcInvitationCard_partnerInfoText {
font-style: italic;
opacity: 0.9;
}
addons/mail/static/src/components/rtc_invitation_card/rtc_invitation_card.xml
+12 -12
View File
@@ -3,30 +3,30 @@
<t t-name="mail.RtcInvitationCard" owl="1">
<t t-if="rtcInvitationCard">
<div class="o_RtcInvitationCard" t-attf-class="{{ className }}" t-ref="root">
<div class="o_RtcInvitationCard d-flex flex-column m-2 p-5 border border-dark rounded-sm bg-900" t-attf-class="{{ className }}" t-ref="root">
<t t-if="rtcInvitationCard.thread.rtcInvitingSession">
<div class="o_RtcInvitationCard_partnerInfo">
<img class="o_RtcInvitationCard_partnerInfoImage rounded-circle"
<div class="o_RtcInvitationCard_partnerInfo d-flex flex-column justify-content-around align-items-center text-nowrap">
<img class="o_RtcInvitationCard_partnerInfoImage mb-2 rounded-circle o_cursor_pointer"
t-att-src="rtcInvitationCard.thread.rtcInvitingSession.avatarUrl"
t-on-click="rtcInvitationCard.onClickAvatar"
alt="Avatar"/>
<span class="o_RtcInvitationCard_partnerInfoName" t-esc="rtcInvitationCard.thread.rtcInvitingSession.name"/>
<span class="o_RtcInvitationCard_partnerInfoText">Incoming Call...</span>
<span class="o_RtcInvitationCard_partnerInfoName w-100 font-weight-bolder text-truncate text-center overflow-hidden" t-esc="rtcInvitationCard.thread.rtcInvitingSession.name"/>
<span class="o_RtcInvitationCard_partnerInfoText font-italic opacity-75">Incoming Call...</span>
</div>
</t>
<div class="o_RtcInvitationCard_buttonList">
<div class="o_RtcInvitationCard_buttonListButton o_RtcInvitationCard_buttonListRefuse"
<div class="o_RtcInvitationCard_buttonList d-flex justify-content-around align-items-center w-100 mt-4">
<button class="o_RtcInvitationCard_buttonListButton o_RtcInvitationCard_buttonListRefuse p-2 rounded-circle border-0 bg-danger"
aria-label="Refuse"
title="Refuse"
t-on-click="rtcInvitationCard.onClickRefuse">
<i class="o_RtcInvitationCard_buttonListButtonIcon fa fa-lg fa-times"/>
</div>
<div class="o_RtcInvitationCard_buttonListButton o_RtcInvitationCard_buttonListAccept"
<i class="o_RtcInvitationCard_buttonListButtonIcon fa fa-lg fa-times m-3"/>
</button>
<button class="o_RtcInvitationCard_buttonListButton o_RtcInvitationCard_buttonListAccept p-2 rounded-circle border-0 bg-success"
aria-label="Accept"
title="Accept"
t-on-click="rtcInvitationCard.onClickAccept">
<i class="o_RtcInvitationCard_buttonListButtonIcon fa fa-lg fa-phone"/>
</div>
<i class="o_RtcInvitationCard_buttonListButtonIcon fa fa-lg fa-phone m-3"/>
</button>
</div>
</div>
</t>