[IMP] mail: adapt for dark-mode

This commit adapts several components in order to correctly handle
color-scheme variations.

task-2710677

Part-of: odoo/odoo#102868
This commit is contained in:
stefanorigano (SRI)
2022-10-11 13:15:53 +02:00
committed by Pierre Paridans
parent 5234fad374
commit 3fb351e4de
57 changed files with 160 additions and 134 deletions
@@ -44,5 +44,5 @@
}
.o_Activity_iconContainer {
box-shadow: 0 0 0 2px currentColor;
box-shadow: 0 0 0 2px $o-view-background-color;
}
@@ -9,11 +9,11 @@
<t t-if="activityView.activity.assignee">
<img class="o_Activity_userAvatar rounded-circle h-100 w-100 o_object_fit_cover" t-attf-src="/web/image/res.users/{{ activityView.activity.assignee.id }}/avatar_128" t-att-alt="activityView.activity.assignee.nameOrDisplayName"/>
</t>
<div class="o_Activity_iconContainer d-flex align-items-center justify-content-center rounded-circle w-50 h-50 text-white"
<div class="o_Activity_iconContainer d-flex align-items-center justify-content-center rounded-circle w-50 h-50"
t-att-class="{
'bg-success': activityView.activity.state === 'planned',
'bg-warning': activityView.activity.state === 'today',
'bg-danger': activityView.activity.state === 'overdue',
'text-bg-success': activityView.activity.state === 'planned',
'text-bg-warning': activityView.activity.state === 'today',
'text-bg-danger': activityView.activity.state === 'overdue',
}"
>
<i class="o_Activity_icon fa small" t-attf-class="{{ activityView.activity.icon }}"/>
@@ -99,7 +99,6 @@
.o_ActivityMenuView_activityGroupNoCount {
cursor: initial;
align-items: center;
color: grey;
opacity: 0.5;
padding: 3px;
min-height: inherit;
@@ -6,7 +6,7 @@
<a class="o_ActivityMenuView_dropdownToggle dropdown-toggle o-no-caret o-dropdown--narrow" t-att-aria-expanded="activityMenuView.isOpen ? 'true' : 'false'" title="Activities" href="#" role="button" t-on-click="activityMenuView.onClickDropdownToggle">
<i class="fa fa-lg fa-clock-o" role="img" aria-label="Activities"/> <span t-if="activityMenuView.counter > 0" class="o_ActivityMenuView_counter badge" t-esc="activityMenuView.counter"/>
</a>
<div t-if="activityMenuView.isOpen" class="o_ActivityMenuView_dropdownMenu o-dropdown-menu dropdown-menu-end show" role="menu">
<div t-if="activityMenuView.isOpen" class="o_ActivityMenuView_dropdownMenu o-dropdown-menu dropdown-menu-end show bg-view" role="menu">
<div class="o_ActivityMenuView_activityGroups">
<t t-if="activityMenuView.activityGroupViews.length === 0">
<div class="o_ActivityMenuView_noActivity dropdown-item-text text-center d-flex justify-content-center">
@@ -40,11 +40,11 @@
</div>
<div t-if="activityGroupView.activityGroup.type == 'activity'">
<button t-if="activityGroupView.activityGroup.overdue_count" type="button" class="o_ActivityMenuView_activityGroupFilterButton btn btn-link mr16" t-att-data-res_model="activityGroupView.activityGroup.irModel.model" t-att-data-model_name="activityGroupView.activityGroup.irModel.name" data-filter='overdue'><t t-esc="activityGroupView.activityGroup.overdue_count"/> Late </button>
<span t-if="!activityGroupView.activityGroup.overdue_count" class="o_ActivityMenuView_activityGroupNoCount mr16">0 Late </span>
<span t-if="!activityGroupView.activityGroup.overdue_count" class="o_ActivityMenuView_activityGroupNoCount mr16 text-muted">0 Late </span>
<button t-if="activityGroupView.activityGroup.today_count" type="button" class="o_ActivityMenuView_activityGroupFilterButton btn btn-link mr16" t-att-data-res_model="activityGroupView.activityGroup.irModel.model" t-att-data-model_name="activityGroupView.activityGroup.irModel.name" data-filter='today'> <t t-esc="activityGroupView.activityGroup.today_count"/> Today </button>
<span t-if="!activityGroupView.activityGroup.today_count" class="o_ActivityMenuView_activityGroupNoCount mr16">0 Today </span>
<span t-if="!activityGroupView.activityGroup.today_count" class="o_ActivityMenuView_activityGroupNoCount mr16 text-muted">0 Today </span>
<button t-if="activityGroupView.activityGroup.planned_count" type="button" class="o_ActivityMenuView_activityGroupFilterButton btn btn-link float-end" t-att-data-res_model="activityGroupView.activityGroup.irModel.model" t-att-data-model_name="activityGroupView.activityGroup.irModel.name" data-filter='upcoming_all'> <t t-esc="activityGroupView.activityGroup.planned_count"/> Future </button>
<span t-if="!activityGroupView.activityGroup.planned_count" class="o_ActivityMenuView_activityGroupNoCount float-end">0 Future</span>
<span t-if="!activityGroupView.activityGroup.planned_count" class="o_ActivityMenuView_activityGroupNoCount float-end text-muted">0 Future</span>
</div>
</div>
</div>
@@ -3,7 +3,7 @@
<t t-name="mail.AttachmentCard" owl="1">
<t t-if="attachmentCard">
<div t-attf-class="{{ className }}" t-ref="root">
<div class="o_AttachmentCard o-has-card-details d-flex rounded border bg-200"
<div class="o_AttachmentCard o-has-card-details d-flex rounded bg-300"
t-att-class="{
'o-isUploading': attachmentCard.attachment.isUploading,
'o-viewable': attachmentCard.attachment.isViewable,
@@ -42,13 +42,13 @@
</t>
<!-- Remove button -->
<t t-if="attachmentCard.attachment.isDeletable">
<button class="o_AttachmentCard_asideItem o_AttachmentCard_asideItemUnlink btn top-0 justify-content-center align-items-center d-flex w-100 h-100 rounded-0" t-attf-class="{{ attachmentCard.attachmentList.composerViewOwner ? 'o-pretty position-absolute btn-primary transition-base' : 'bg-200' }}" t-on-click="attachmentCard.onClickUnlink" title="Remove">
<button class="o_AttachmentCard_asideItem o_AttachmentCard_asideItemUnlink btn top-0 justify-content-center align-items-center d-flex w-100 h-100 rounded-0" t-attf-class="{{ attachmentCard.attachmentList.composerViewOwner ? 'o-pretty position-absolute btn-primary transition-base' : 'bg-300' }}" t-on-click="attachmentCard.onClickUnlink" title="Remove">
<i class="fa fa-trash" role="img" aria-label="Remove"/>
</button>
</t>
<!-- Download button -->
<t t-if="!attachmentCard.attachmentList.composerViewOwner and !attachmentCard.attachment.isUploading">
<button class="o_AttachmentCard_asideItem o_AttachmentCard_asideItemDownload btn d-flex justify-content-center align-items-center w-100 h-100 rounded-0 bg-200" t-on-click="attachmentCard.attachment.onClickDownload" title="Download">
<button class="o_AttachmentCard_asideItem o_AttachmentCard_asideItemDownload btn d-flex justify-content-center align-items-center w-100 h-100 rounded-0 bg-300" t-on-click="attachmentCard.attachment.onClickDownload" title="Download">
<i class="fa fa-download" role="img" aria-label="Download"/>
</button>
</t>
@@ -2,7 +2,7 @@
<templates xml:space="preserve">
<t t-name="mail.AttachmentDeleteConfirm" owl="1">
<t t-if="attachmentDeleteConfirmView">
<div class="o_AttachmentDeleteConfirm card bg-white" t-attf-class="{{ className }}" t-ref="root">
<div class="o_AttachmentDeleteConfirm card bg-view" t-attf-class="{{ className }}" t-ref="root">
<h4 class="m-3">Confirmation</h4>
<hr class="mt-0 mb-3"/>
<p class="o_AttachmentDeleteConfirm_mainText mx-3 mb-3" t-esc="attachmentDeleteConfirmView.body"/>
@@ -49,11 +49,21 @@
color: lighten($gray-400, 15%);
}
.o_AttachmentViewer_toolbarButton.o_disabled {
filter: brightness(1.3);
.o_AttachmentViewer_toolbarButton {
background-color: var(--AttachmentViewer_toolbarButton-background-color, #{$o-gray-800});
color: #fff;
&:hover {
filter: brightness(1.3);
}
}
.o_AttachmentViewer_view {
box-shadow: 0 0 40px $black;
background-color: #000000;
box-shadow: 0 0 40px #000000;
outline: none;
&.o_AttachmentViewer_isText {
background: #FFFFFF;
}
}
@@ -43,51 +43,51 @@
<i class="fa fa-3x fa-circle-o-notch fa-fw fa-spin text-white" role="img" title="Loading"/>
</div>
</t>
<img class="o_AttachmentViewer_view o_AttachmentViewer_viewImage mw-100 mh-100 bg-black transition-base" t-on-click="attachmentViewer.onClickImage" t-on-mousedown="_onMousedownImage" t-on-wheel="_onWheelImage" t-on-load="attachmentViewer.onLoadImage" t-att-src="attachmentViewer.attachmentViewerViewable.imageUrl" t-att-style="attachmentViewer.imageStyle" draggable="false" alt="Viewer" t-key="'image_' + attachmentViewer.attachmentViewerViewable.localId" t-ref="image_{{ attachmentViewer.attachmentViewerViewable.localId }}"/>
<img class="o_AttachmentViewer_view o_AttachmentViewer_viewImage mw-100 mh-100 transition-base" t-on-click="attachmentViewer.onClickImage" t-on-mousedown="_onMousedownImage" t-on-wheel="_onWheelImage" t-on-load="attachmentViewer.onLoadImage" t-att-src="attachmentViewer.attachmentViewerViewable.imageUrl" t-att-style="attachmentViewer.imageStyle" draggable="false" alt="Viewer" t-key="'image_' + attachmentViewer.attachmentViewerViewable.localId" t-ref="image_{{ attachmentViewer.attachmentViewerViewable.localId }}"/>
</div>
</t>
<t t-if="attachmentViewer.attachmentViewerViewable.isPdf">
<iframe class="o_AttachmentViewer_view o_AttachmentViewer_viewIframe o_AttachmentViewer_viewPdf w-75 h-100 bg-black border-0" t-ref="iframeViewerPdf" t-att-class="{ 'w-100': messaging.device.isSmall }" t-att-src="attachmentViewer.attachmentViewerViewable.defaultSource"/>
<iframe class="o_AttachmentViewer_view o_AttachmentViewer_viewIframe o_AttachmentViewer_viewPdf w-75 h-100 border-0" t-ref="iframeViewerPdf" t-att-class="{ 'w-100': messaging.device.isSmall }" t-att-src="attachmentViewer.attachmentViewerViewable.defaultSource"/>
</t>
<t t-if="attachmentViewer.attachmentViewerViewable.isText">
<iframe class="o_AttachmentViewer_view o_AttachmentViewer_viewIframe o_text w-75 h-100 bg-white border-0" t-att-src="attachmentViewer.attachmentViewerViewable.defaultSource"/>
<iframe class="o_AttachmentViewer_view o_AttachmentViewer_viewIframe o_AttachmentViewer_isText o_text w-75 h-100 border-0" t-att-src="attachmentViewer.attachmentViewerViewable.defaultSource"/>
</t>
<t t-if="attachmentViewer.attachmentViewerViewable.isUrlYoutube">
<iframe allow="autoplay; encrypted-media" class="o_AttachmentViewer_view o_AttachmentViewer_viewIframe o_AttachmentViewer_youtube w-75 h-100 bg-black border-0" t-att-src="attachmentViewer.attachmentViewerViewable.defaultSource" height="315" width="560"/>
<iframe allow="autoplay; encrypted-media" class="o_AttachmentViewer_view o_AttachmentViewer_viewIframe o_AttachmentViewer_youtube w-75 h-100 border-0" t-att-src="attachmentViewer.attachmentViewerViewable.defaultSource" height="315" width="560"/>
</t>
<t t-if="attachmentViewer.attachmentViewerViewable.isVideo">
<video class="o_AttachmentViewer_view o_AttachmentViewer_viewVideo w-75 h-75 bg-black" t-att-class="{ 'w-100 h-100': messaging.device.isSmall }" t-on-click="attachmentViewer.onClickVideo" controls="controls">
<video class="o_AttachmentViewer_view o_AttachmentViewer_viewVideo w-75 h-75" t-att-class="{ 'w-100 h-100': messaging.device.isSmall }" t-on-click="attachmentViewer.onClickVideo" controls="controls">
<source t-att-data-type="attachmentViewer.attachmentViewerViewable.mimetype" t-att-src="attachmentViewer.attachmentViewerViewable.defaultSource"/>
</video>
</t>
</div>
<t t-if="attachmentViewer.attachmentViewerViewable.isImage">
<div class="o_AttachmentViewer_toolbar position-absolute bottom-0 d-flex" role="toolbar">
<div class="o_AttachmentViewer_toolbarButton btn btn-dark p-3 rounded-0" t-on-click="_onClickZoomIn" title="Zoom In (+)" role="button">
<div class="o_AttachmentViewer_toolbarButton p-3 rounded-0" t-on-click="_onClickZoomIn" title="Zoom In (+)" role="button">
<i class="fa fa-fw fa-plus" role="img"/>
</div>
<div class="o_AttachmentViewer_toolbarButton btn btn-dark p-3 rounded-0" t-att-class="{ o_disabled: attachmentViewer.scale === 1 }" t-on-click="_onClickZoomReset" role="button" title="Reset Zoom (0)">
<div class="o_AttachmentViewer_toolbarButton p-3 rounded-0" t-att-class="{ 'o_disabled opacity-50': attachmentViewer.scale === 1 }" t-on-click="_onClickZoomReset" role="button" title="Reset Zoom (0)">
<i class="fa fa-fw fa-search" role="img"/>
</div>
<div class="o_AttachmentViewer_toolbarButton btn btn-dark p-3 rounded-0" t-att-class="{ o_disabled: attachmentViewer.scale === MIN_SCALE }" t-on-click="_onClickZoomOut" title="Zoom Out (-)" role="button">
<div class="o_AttachmentViewer_toolbarButton p-3 rounded-0" t-att-class="{ 'o_disabled opacity-50': attachmentViewer.scale === MIN_SCALE }" t-on-click="_onClickZoomOut" title="Zoom Out (-)" role="button">
<i class="fa fa-fw fa-minus" role="img"/>
</div>
<div class="o_AttachmentViewer_toolbarButton btn btn-dark p-3 rounded-0" t-on-click="attachmentViewer.onClickRotate" title="Rotate (r)" role="button">
<div class="o_AttachmentViewer_toolbarButton p-3 rounded-0" t-on-click="attachmentViewer.onClickRotate" title="Rotate (r)" role="button">
<i class="fa fa-fw fa-repeat" role="img"/>
</div>
<div class="o_AttachmentViewer_toolbarButton btn btn-dark p-3 rounded-0" t-on-click="attachmentViewer.onClickPrint" title="Print" role="button">
<div class="o_AttachmentViewer_toolbarButton p-3 rounded-0" t-on-click="attachmentViewer.onClickPrint" title="Print" role="button">
<i class="fa fa-fw fa-print" role="img"/>
</div>
<div class="o_AttachmentViewer_buttonDownload o_AttachmentViewer_toolbarButton btn btn-dark p-3 rounded-0 cursor-pointer" t-on-click="attachmentViewer.onClickDownload" title="Download" role="button">
<div class="o_AttachmentViewer_buttonDownload o_AttachmentViewer_toolbarButton p-3 rounded-0 cursor-pointer" t-on-click="attachmentViewer.onClickDownload" title="Download" role="button">
<i class="fa fa-download fa-fw" role="img"/>
</div>
</div>
</t>
<t t-if="attachmentViewer.attachmentViewerViewables.length > 1">
<div class="o_AttachmentViewer_buttonNavigation o_AttachmentViewer_buttonNavigationPrevious o_AttachmentViewer_buttonNavigationPreviousIcon btn btn-dark position-absolute top-0 bottom-0 start-0 align-items-center justify-content-center d-flex my-auto ms-3 rounded-circle" t-on-click="attachmentViewer.onClickPrevious" title="Previous (Left-Arrow)" role="button">
<div class="o_AttachmentViewer_buttonNavigation o_AttachmentViewer_buttonNavigationPrevious o_AttachmentViewer_buttonNavigationPreviousIcon position-absolute top-0 bottom-0 start-0 align-items-center justify-content-center d-flex my-auto ms-3 rounded-circle" t-on-click="attachmentViewer.onClickPrevious" title="Previous (Left-Arrow)" role="button">
<span class="fa fa-chevron-left" role="img"/>
</div>
<div class="o_AttachmentViewer_buttonNavigation o_AttachmentViewer_buttonNavigationNext o_AttachmentViewer_buttonNavigationNextIcon btn btn-dark position-absolute top-0 bottom-0 end-0 align-items-center justify-content-center d-flex my-auto me-3 rounded-circle" t-on-click="attachmentViewer.onClickNext" title="Next (Right-Arrow)" role="button">
<div class="o_AttachmentViewer_buttonNavigation o_AttachmentViewer_buttonNavigationNext o_AttachmentViewer_buttonNavigationNextIcon position-absolute top-0 bottom-0 end-0 align-items-center justify-content-center d-flex my-auto me-3 rounded-circle" t-on-click="attachmentViewer.onClickNext" title="Next (Right-Arrow)" role="button">
<span class="fa fa-chevron-right" role="img"/>
</div>
</t>
@@ -0,0 +1,4 @@
.o_CallActionList_button:not(.btn-danger) {
background-color: var(--CallActionList_button-background-color, #{$o-gray-800});
color: #FFFFFF;
}
@@ -6,7 +6,7 @@
<div class="o_CallActionList d-flex justify-content-between" t-attf-class="{{ className }}" t-ref="root">
<div class="o_CallActionList_buttons d-flex align-items-center flex-wrap">
<t t-if="callActionListView.thread.rtc and messaging.rtc.currentRtcSession">
<button class="o_CallActionList_button btn d-flex m-1 border-0 rounded-circle bg-800 shadow-none"
<button class="o_CallActionList_button btn d-flex m-1 border-0 rounded-circle shadow-none opacity-100 opacity-75-hover"
t-att-class="{ 'o-isActive': !messaging.rtc.currentRtcSession.isMute, 'o-isSmall p-2': callActionListView.isSmall, 'p-3': !callActionListView.isSmall }"
t-att-aria-label="callActionListView.microphoneButtonTitle"
t-att-title="callActionListView.microphoneButtonTitle"
@@ -20,7 +20,7 @@
}"/>
</div>
</button>
<button class="o_CallActionList_button btn d-flex m-1 border-0 rounded-circle bg-800 shadow-none"
<button class="o_CallActionList_button btn d-flex m-1 border-0 rounded-circle shadow-none opacity-100 opacity-75-hover"
t-att-class="{ 'o-isActive': !messaging.rtc.currentRtcSession.isDeaf, 'o-isSmall p-2': callActionListView.isSmall, 'p-3': !callActionListView.isSmall }"
t-att-aria-label="callActionListView.headphoneButtonTitle"
t-att-title="callActionListView.headphoneButtonTitle"
@@ -34,7 +34,7 @@
}"/>
</div>
</button>
<button class="o_CallActionList_button o_CallActionList_videoButton btn d-flex m-1 border-0 rounded-circle bg-800 shadow-none"
<button class="o_CallActionList_button o_CallActionList_videoButton btn d-flex m-1 border-0 rounded-circle shadow-none opacity-100 opacity-75-hover"
t-att-class="{
'o-isActive': messaging.rtc.sendUserVideo,
'o-isSmall p-2': callActionListView.isSmall,
@@ -48,7 +48,7 @@
</div>
</button>
<t t-if="!messaging.device.isMobileDevice">
<button class="o_CallActionList_button o_CallActionList_videoButton btn d-flex m-1 border-0 rounded-circle bg-800 shadow-none"
<button class="o_CallActionList_button o_CallActionList_videoButton btn d-flex m-1 border-0 rounded-circle shadow-none opacity-100 opacity-75-hover"
t-att-class="{
'o-isActive': messaging.rtc.sendDisplay,
'o-isSmall p-2': callActionListView.isSmall,
@@ -63,7 +63,7 @@
</button>
</t>
<t t-if="!callActionListView.callView.isFullScreen">
<button class="o_CallActionList_button btn d-flex m-1 border-0 rounded-circle bg-800 shadow-none"
<button class="o_CallActionList_button btn d-flex m-1 border-0 rounded-circle shadow-none opacity-100 opacity-75-hover"
aria-label="Activate Full Screen"
title="Activate Full Screen"
t-att-class="{ 'o-isSmall p-2': callActionListView.isSmall, 'p-3': !callActionListView.isSmall }"
@@ -75,7 +75,7 @@
</button>
</t>
<t t-if="callActionListView.callView.isFullScreen">
<button class="o_CallActionList_button btn d-flex m-1 border-0 rounded-circle bg-800 shadow-none"
<button class="o_CallActionList_button btn d-flex m-1 border-0 rounded-circle shadow-none opacity-100 opacity-75-hover"
aria-label="Deactivate Full Screen"
title="Deactivate Full Screen"
t-att-class="{ 'o-isSmall p-2': callActionListView.isSmall, 'p-3': !callActionListView.isSmall }"
@@ -87,7 +87,7 @@
</button>
</t>
<t t-if="messaging.modelManager.isDebug">
<button class="o_CallActionList_button btn d-flex m-1 border-0 rounded-circle bg-800 shadow-none"
<button class="o_CallActionList_button btn d-flex m-1 border-0 rounded-circle shadow-none opacity-100 opacity-75-hover"
aria-label="More"
title="More"
t-att-class="{ 'o-isSmall p-2': callActionListView.isSmall, 'p-3': !callActionListView.isSmall }"
@@ -57,6 +57,6 @@
user-select: none;
}
.o_CallParticipantCard_name {
background-color: rgba(black, .75);
.o_CallParticipantCard_avatarFrame:not(.o-isMinimized) {
background-color: var(--CallParticipantCard_avatarFrame-background-color, #{$o-gray-700});
}
@@ -20,7 +20,7 @@
<CallParticipantVideo record="callParticipantCard.callParticipantVideoView"/>
</t>
<t t-else="">
<div class="o_CallParticipantCard_avatarFrame d-flex align-items-center justify-content-center h-100 w-100 rounded-1" t-att-class="{ 'o-isMinimized': callParticipantCard.isMinimized, 'bg-700': !callParticipantCard.isMinimized}" draggable="false">
<div class="o_CallParticipantCard_avatarFrame d-flex align-items-center justify-content-center h-100 w-100 rounded-1" t-att-class="{ 'o-isMinimized': callParticipantCard.isMinimized }" draggable="false">
<img alt="Avatar"
t-att-class="{
'o-isTalking': callParticipantCard.isTalking,
@@ -37,7 +37,7 @@
<!-- overlay -->
<span class="o_CallParticipantCard_overlay o_CallParticipantCard_overlayBottom position-absolute bottom-0 start-0 d-flex overflow-hidden">
<t t-if="!callParticipantCard.isMinimized">
<span class="o_CallParticipantCard_name p-1 rounded-1 text-white text-truncate" t-esc="callParticipantCard.channelMember.persona.name"/>
<span class="o_CallParticipantCard_name p-1 rounded-1 bg-black-75 text-truncate" t-esc="callParticipantCard.channelMember.persona.name"/>
</t>
<t t-if="callParticipantCard.rtcSession.isScreenSharingOn and callParticipantCard.isMinimized and !callParticipantCard.rtcSession.channel.rtc">
<small class="o_CallParticipantCard_liveIndicator o-isMinimized rounded-pill text-bg-danger d-flex align-items-center fw-bolder" title="live" aria-label="live">
@@ -2,7 +2,7 @@
<templates xml:space="preserve">
<t t-name="mail.CallParticipantCardPopoverContentView" owl="1">
<div class="d-flex flex-column p-3">
<input type="range" min="0.0" max="1" step="0.01" t-att-value="callParticipantCardPopoverContentView.callParticipantCard.rtcSession.volume" t-on-change="callParticipantCardPopoverContentView.onChangeVolume"/>
<input type="range" min="0.0" max="1" step="0.01" t-att-value="callParticipantCardPopoverContentView.callParticipantCard.rtcSession.volume" t-on-change="callParticipantCardPopoverContentView.onChangeVolume" class="form-range"/>
<t t-if="callParticipantCardPopoverContentView.hasConnectionInfo">
<hr class="o_CallParticipantCardPopoverContentView_volumeMenuAnchorSeparator w-100 border-top"/>
<div t-esc="callParticipantCardPopoverContentView.inboundConnectionTypeText"/>
@@ -3,7 +3,7 @@
<t t-name="mail.CallParticipantVideo" owl="1">
<t t-if="callParticipantVideoView">
<video class="o_CallParticipantVideo w-100 h-100 rounded-1 bg-black cursor-pointer"
<video class="o_CallParticipantVideo w-100 h-100 rounded-1 cursor-pointer"
t-attf-class="{{ className }}"
playsinline="true"
autoplay="true"
@@ -20,7 +20,7 @@
</div>
<div class="o_CallSettingsMenu_option mb-3 d-flex align-items-center flex-wrap">
<label class="o_CallSettingsMenu_optionLabel o_CallSettingsMenu_pushToTalkOption d-flex align-items-center flex-wrap mw-100 cursor-pointer" title="Enable Push-to-talk" aria-label="Enable Push-to-talk">
<input type="checkbox" aria-label="toggle push-to-talk" title="toggle push-to-talk" t-on-change="callSettingsMenu.onChangePushToTalk" t-att-checked="messaging.userSetting.usePushToTalk ? 'checked' : ''"/>
<input type="checkbox" aria-label="toggle push-to-talk" title="toggle push-to-talk" t-on-change="callSettingsMenu.onChangePushToTalk" t-att-checked="messaging.userSetting.usePushToTalk ? 'checked' : ''" class="form-check-input"/>
<span class="o_CallSettingsMenu_optionName ms-2 text-truncate">Enable Push-to-talk</span>
</label>
</div>
@@ -49,7 +49,7 @@
<label class="o_CallSettingsMenu_optionLabel o_CallSettingsMenu_pushToTalkDelayOption d-flex align-items-center flex-wrap mw-100 cursor-pointer" title="Delay after releasing push-to-talk" aria-label="Delay after releasing push-to-talk">
<span class="o_CallSettingsMenu_optionName me-2 text-truncate">Delay after releasing push-to-talk</span>
<div class="o_CallSettingsMenu_optionInputGroup d-flex w-100">
<input class="o_CallSettingsMenu_optionInputGroupInput" type="range" min="1" max="2000" step="1" t-att-value="messaging.userSetting.voiceActiveDuration" t-on-change="callSettingsMenu.onChangeDelay"/>
<input class="o_CallSettingsMenu_optionInputGroupInput form-range" type="range" min="1" max="2000" step="1" t-att-value="messaging.userSetting.voiceActiveDuration" t-on-change="callSettingsMenu.onChangeDelay"/>
</div>
</label>
</div>
@@ -59,7 +59,7 @@
<label class="o_CallSettingsMenu_optionLabel o_CallSettingsMenu_voiceThresholdOption d-flex align-items-center flex-wrap mw-100 cursor-pointer" title="Voice detection threshold" aria-label="Voice detection threshold">
<span class="o_CallSettingsMenu_optionName me-2 text-truncate">Voice detection threshold</span>
<div class="o_CallSettingsMenu_optionInputGroup d-flex w-100">
<input class="o_CallSettingsMenu_optionInputGroupInput" type="range" min="0.001" max="1" step="0.001" t-att-value="messaging.userSetting.voiceActivationThreshold" t-on-change="callSettingsMenu.onChangeThreshold"/>
<input class="o_CallSettingsMenu_optionInputGroupInput form-range" type="range" min="0.001" max="1" step="0.001" t-att-value="messaging.userSetting.voiceActivationThreshold" t-on-change="callSettingsMenu.onChangeThreshold"/>
</div>
</label>
</div>
@@ -69,14 +69,14 @@
<div class="o_CallSettingsMenu_categoryTitle py-2 fw-bolder text-700 text-truncate text-uppercase">Video Settings</div>
<div class="o_CallSettingsMenu_option mb-3 d-flex align-items-center flex-wrap">
<label class="o_CallSettingsMenu_optionLabel o_CallSettingsMenu_showOnlyVideoOption d-flex align-items-center flex-wrap mw-100 cursor-pointer" title="Show video participants only" aria-label="Show video participants only">
<input type="checkbox" aria-label="toggle push-to-talk" title="Show video participants only" t-on-change="callSettingsMenu.onChangeVideoFilterCheckbox" t-att-checked="callSettingsMenu.thread.channel.showOnlyVideo ? 'checked' : ''"/>
<input type="checkbox" aria-label="toggle push-to-talk" title="Show video participants only" t-on-change="callSettingsMenu.onChangeVideoFilterCheckbox" t-att-checked="callSettingsMenu.thread.channel.showOnlyVideo ? 'checked' : ''" class="form-check-input"/>
<span class="o_CallSettingsMenu_optionName ms-2 text-truncate">Show video participants only</span>
</label>
</div>
<t t-if="messaging.device.hasCanvasFilterSupport">
<div class="o_CallSettingsMenu_option mb-3 d-flex align-items-center flex-wrap">
<label class="o_CallSettingsMenu_optionLabel o_CallSettingsMenu_blurOption d-flex align-items-center flex-wrap mw-100 cursor-pointer" title="Blur video background" aria-label="Blur video background">
<input type="checkbox" aria-label="Blur video background" title="Blur video background" t-on-change="callSettingsMenu.onChangeBlur" t-att-checked="messaging.userSetting.useBlur ? 'checked' : ''"/>
<input type="checkbox" aria-label="Blur video background" title="Blur video background" t-on-change="callSettingsMenu.onChangeBlur" t-att-checked="messaging.userSetting.useBlur ? 'checked' : ''" class="form-check-input"/>
<span class="o_CallSettingsMenu_optionName ms-2 text-truncate">Blur video background</span>
</label>
</div>
@@ -86,7 +86,7 @@
<label class="o_CallSettingsMenu_optionLabel o_CallSettingsMenu_backgroundBlurIntensityOption d-flex align-items-center flex-wrap mw-100 cursor-pointer" title="Background blur intensity" aria-label="Background blur intensity">
<span class="o_CallSettingsMenu_optionName me-2 text-truncate">Background blur intensity</span>
<div class="o_CallSettingsMenu_optionInputGroup d-flex w-100">
<input class="o_CallSettingsMenu_optionInputGroupInput" type="range" min="0" max="20" step="1" t-att-value="messaging.userSetting.backgroundBlurAmount" t-on-change="callSettingsMenu.onChangeBackgroundBlurAmount"/>
<input class="o_CallSettingsMenu_optionInputGroupInput form-range" type="range" min="0" max="20" step="1" t-att-value="messaging.userSetting.backgroundBlurAmount" t-on-change="callSettingsMenu.onChangeBackgroundBlurAmount"/>
</div>
</label>
</div>
@@ -94,7 +94,7 @@
<label class="o_CallSettingsMenu_optionLabel o_CallSettingsMenu_edgeBlurIntensityOption d-flex align-items-center flex-wrap mw-100 cursor-pointer" title="Edge blur intensity" aria-label="Edge blur intensity">
<span class="o_CallSettingsMenu_optionName me-2 text-truncate">Edge blur intensity</span>
<div class="o_CallSettingsMenu_optionInputGroup d-flex w-100">
<input class="o_CallSettingsMenu_optionInputGroupInput" type="range" min="0" max="20" step="1" t-att-value="messaging.userSetting.edgeBlurAmount" t-on-change="callSettingsMenu.onChangeEdgeBlurAmount"/>
<input class="o_CallSettingsMenu_optionInputGroupInput form-range" type="range" min="0" max="20" step="1" t-att-value="messaging.userSetting.edgeBlurAmount" t-on-change="callSettingsMenu.onChangeEdgeBlurAmount"/>
</div>
</label>
</div>
@@ -4,6 +4,7 @@
.o_CallView {
min-height: 50%;
background: var(--CallView-background-color, #{$dark});
&.o-isMinimized {
height: 20%;
@@ -3,7 +3,7 @@
<t t-name="mail.CallView" owl="1">
<t t-if="callView">
<div class="o_CallView d-flex bg-dark" t-att-class="{'o-fullScreen fixed-top vw-100 vh-100': callView.isFullScreen, 'o-isMinimized': callView.isMinimized, 'h-50': !callView.isMinimized and !callView.isFullScreen, 'position-relative': !callView.isFullScreen }" t-attf-class="{{ className }}" t-ref="root">
<div class="o_CallView d-flex" t-att-class="{'o-fullScreen fixed-top vw-100 vh-100': callView.isFullScreen, 'o-isMinimized': callView.isMinimized, 'h-50': !callView.isMinimized and !callView.isFullScreen, 'position-relative': !callView.isFullScreen }" t-attf-class="{{ className }}" t-ref="root">
<!-- Used to make the component depend on the window size and trigger an update when the window size changes. -->
<CallMainView record="callView.callMainView"/>
@@ -7,7 +7,7 @@
<h3 class="mx-3 mt-3 mb-2">Invite people</h3>
<t t-if="!messaging.isCurrentUserGuest">
<div class="mx-3 my-2">
<input class="o_ChannelInvitationForm_searchInput" type="text" t-att-value="channelInvitationForm.searchTerm" placeholder="Type the name of a person" t-on-input="channelInvitationForm.onInputSearch" t-ref="searchInput"/>
<input class="o_ChannelInvitationForm_searchInput form-control" type="text" t-att-value="channelInvitationForm.searchTerm" placeholder="Type the name of a person" t-on-input="channelInvitationForm.onInputSearch" t-ref="searchInput"/>
</div>
<div class="d-flex flex-column flex-grow-1 mx-0 py-2 overflow-auto">
<t t-foreach="channelInvitationForm.selectablePartnerViews" t-as="selectablePartnerView" t-key="selectablePartnerView.localId">
@@ -19,7 +19,7 @@
<span class="o_ChannelInvitationFormSelectablePartner_name flex-grow-1 mx-2 text-truncate">
<t t-esc="channelInvitationFormSelectablePartnerView.partner.nameOrDisplayName"/>
</span>
<input class="o_ChannelInvitationFormSelectablePartner_checkbox flex-shrink-0" type="checkbox" t-att-checked="channelInvitationFormSelectablePartnerView.channelInvitationFormOwner.selectedPartners.includes(channelInvitationFormSelectablePartnerView.partner) ? 'checked' : undefined" t-on-input="ev => channelInvitationFormSelectablePartnerView.channelInvitationFormOwner.onInputPartnerCheckbox(channelInvitationFormSelectablePartnerView.partner, ev)" t-ref="selection-status"/>
<input class="o_ChannelInvitationFormSelectablePartner_checkbox form-check-input flex-shrink-0" type="checkbox" t-att-checked="channelInvitationFormSelectablePartnerView.channelInvitationFormOwner.selectedPartners.includes(channelInvitationFormSelectablePartnerView.partner) ? 'checked' : undefined" t-on-input="ev => channelInvitationFormSelectablePartnerView.channelInvitationFormOwner.onInputPartnerCheckbox(channelInvitationFormSelectablePartnerView.partner, ev)" t-ref="selection-status"/>
</div>
</t>
@@ -30,11 +30,11 @@
.o_ChatWindow {
background-color: $o-mail-thread-window-bg;
box-shadow: -5px -5px 10px rgba($black, 0.09);
box-shadow: -5px -5px 10px rgba(#000000, 0.09);
outline: none;
&.o-focused:not(.o-isDeviceSmall) {
box-shadow: -5px -5px 10px rgba($black, 0.18);
box-shadow: -5px -5px 10px rgba(#000000, 0.18);
}
.o_Composer {
@@ -3,7 +3,7 @@
<t t-name="mail.ChatWindow" owl="1">
<t t-if="chatWindow">
<div class="o_ChatWindow position-absolute bottom-0 d-flex flex-column rounded-top-3 bg-white" t-attf-class="{{ className }}" tabindex="0" t-att-data-visible-index="chatWindow.visibleIndex"
<div class="o_ChatWindow position-absolute bottom-0 d-flex flex-column rounded-top-3 bg-view" t-attf-class="{{ className }}" tabindex="0" t-att-data-visible-index="chatWindow.visibleIndex"
t-att-class="{
'o-focused': chatWindow.isFocused,
'o-folded': chatWindow.isFolded,
@@ -20,10 +20,10 @@
record="chatWindow.chatWindowHeaderView"
/>
<t t-if="chatWindow.channelMemberListView">
<ChannelMemberList record="chatWindow.channelMemberListView" className="'bg-white'"/>
<ChannelMemberList record="chatWindow.channelMemberListView" className="'bg-view'"/>
</t>
<t t-if="chatWindow.callSettingsMenu">
<CallSettingsMenu record="chatWindow.callSettingsMenu" className="'bg-white'"/>
<CallSettingsMenu record="chatWindow.callSettingsMenu" className="'bg-view'"/>
</t>
<t t-if="chatWindow.channelInvitationForm">
<ChannelInvitationForm className="'o_ChatWindow_channelInvitationForm'" record="chatWindow.channelInvitationForm"/>
@@ -21,7 +21,8 @@
// ------------------------------------------------------------------
.o_ChatWindowHeader {
background-color: $o-brand-odoo;
background-color: var(--ChatWindowHeader-background-color, #{$o-brand-odoo});
color: #FFFFFF;
}
.o_ChatWindowHeader_command.o-isDeviceSmall {
@@ -3,7 +3,7 @@
<t t-name="mail.ChatWindowHeader" owl="1">
<t t-if="chatWindowHeaderView and chatWindow">
<div class="o_ChatWindowHeader d-flex align-items-center text-white" t-att-class="{ 'o-isDeviceSmall': messaging.device.isSmall, 'cursor-pointer': !messaging.device.isSmall }" t-attf-class="{{ className }}" t-on-click="chatWindowHeaderView.onClick" t-ref="root">
<div class="o_ChatWindowHeader d-flex align-items-center" t-att-class="{ 'o-isDeviceSmall': messaging.device.isSmall, 'cursor-pointer': !messaging.device.isSmall }" t-attf-class="{{ className }}" t-on-click="chatWindowHeaderView.onClick" t-ref="root">
<t t-if="chatWindow.hasCloseAsBackButton">
<div class="o_ChatWindowHeader_command o_ChatWindowHeader_commandBack o_ChatWindowHeader_commandClose cursor-pointer d-flex align-items-center h-100 px-3 py-0 me-2" t-att-class="{ 'o-isDeviceSmall': messaging.device.isSmall }" t-on-click="chatWindow.onClickClose" title="Close conversation">
<i class="fa fa-arrow-left"/>
@@ -4,7 +4,7 @@
<t t-name="mail.ChatterTopbar" owl="1">
<t t-if="chatterTopbar">
<div class="o_ChatterTopbar justify-content-between d-flex" t-attf-class="{{ className }}" t-ref="root">
<div class="o_ChatterTopbar_actions flex-fill d-flex" t-attf-class="{{ chatterTopbar.chatter.composerView ? 'o-has-active-button' : 'border-white' }}">
<div class="o_ChatterTopbar_actions flex-fill d-flex border-transparent">
<div class="o_ChatterTopbar_controllers d-flex pe-2" t-if="chatterTopbar.chatter.threadView">
<button class="o_ChatterTopbar_button o_ChatterTopbar_buttonSendMessage btn text-nowrap me-2"
type="button"
@@ -9,7 +9,7 @@
'o-has-current-partner-avatar pe-3 ps-1': composerView.hasCurrentPartnerAvatar,
'o-has-footer': composerView.hasFooter,
'o-has-header': composerView.hasHeader,
'o-is-in-thread-view bg-white': composerView.threadView,
'o-is-in-thread-view bg-view': composerView.threadView,
'o-is-compact': composerView.isCompact,
'o-messaging-in-editing': composerView.messageViewInEditing,
'pt-3 pb-4': composerView.hasCurrentPartnerAvatar and composerView.hasHeader,
@@ -71,7 +71,7 @@
class="o_Composer_coreMain d-flex flex-nowrap align-items-start flex-grow-1"
t-att-class="{
'o-composer-is-compact': composerView.isCompact,
'flex-column border rounded-3 bg-white': !composerView.isCompact,
'flex-column border rounded-3 bg-view': !composerView.isCompact,
}"
>
<ComposerTextInput
@@ -87,14 +87,14 @@
t-key="composerView.localId"
/>
<div class="o_Composer_buttons d-flex align-items-stretch align-self-stretch flex-shrink-0" t-att-class="{ 'o-composer-is-compact': composerView.isCompact, 'h-auto w-100 px-3': !composerView.isCompact, 'o-isDeviceSmall': messaging.device.isSmall, 'o-messaging-in-editing': composerView and composerView.messageViewInEditing, 'border-end': composerView.messageViewInEditing and !composerView.hasCurrentPartnerAvatar }">
<div class="o_Composer_toolButtons d-flex py-1 border-top bg-white"
<div class="o_Composer_toolButtons d-flex py-1 border-top bg-view"
t-att-class="{
'o-composer-has-current-partner-avatar': composerView.hasCurrentPartnerAvatar,
'o-composer-is-compact border-bottom': composerView.isCompact,
'flex-row flex-grow-1 justify-content-between': !composerView.isCompact,
}">
<div class="o_Composer_primaryToolButtons d-flex align-items-center" t-att-class="{ 'o-composer-is-compact px-2': composerView.isCompact, 'flex-column': composerView.messageViewInEditing and composerView.messageViewInEditing.isInChatWindow }">
<button class="o_Composer_button o_Composer_buttonEmojis o_Composer_toolButton btn btn-light border-0 rounded-pill"
<button class="o_Composer_button o_Composer_buttonEmojis o_Composer_toolButton btn btn-light border-0 rounded-pill bg-view"
t-att-class="{
'o-open bg-200': composerView.emojisPopoverView,
'o-isDeviceSmall': messaging.device.isSmall,
@@ -107,11 +107,11 @@
>
<i class="fa fa-smile-o" role="img" aria-label="Emojis"/>
</button>
<button class="o_Composer_button o_Composer_buttonAttachment o_Composer_toolButton btn btn-light fa fa-paperclip border-0 rounded-pill bg-white" t-att-class="{ 'o-isDeviceSmall': messaging.device.isSmall }" t-attf-class="{{ composerView.messageViewInEditing ? 'my-1' : 'mx-1' }}" title="Add attachment" aria-label="Add attachment" type="button" t-on-click="composerView.onClickAddAttachment"/>
<button class="o_Composer_button o_Composer_buttonAttachment o_Composer_toolButton btn btn-light fa fa-paperclip border-0 rounded-pill bg-view" t-att-class="{ 'o-isDeviceSmall': messaging.device.isSmall }" t-attf-class="{{ composerView.messageViewInEditing ? 'my-1' : 'mx-1' }}" title="Add attachment" aria-label="Add attachment" type="button" t-on-click="composerView.onClickAddAttachment"/>
</div>
<t t-if="composerView.isExpandable">
<div class="o_Composer_secondaryToolButtons">
<button class="o_Composer_button o_Composer_buttonFullComposer o_Composer_toolButton btn btn-light fa fa-expand mx-1 border-0 rounded-pill bg-white" t-att-class="{ 'o-isDeviceSmall': messaging.device.isSmall }" title="Full composer" aria-label="Full composer" type="button" t-on-click="composerView.onClickFullComposer"/>
<button class="o_Composer_button o_Composer_buttonFullComposer o_Composer_toolButton btn btn-light fa fa-expand mx-1 border-0 rounded-pill bg-view" t-att-class="{ 'o-isDeviceSmall': messaging.device.isSmall }" title="Full composer" aria-label="Full composer" type="button" t-on-click="composerView.onClickFullComposer"/>
</div>
</t>
</div>
@@ -3,7 +3,7 @@
<t t-name="mail.ComposerTextInput" owl="1">
<t t-if="composerTextInputView">
<div class="o_ComposerTextInput position-relative bg-white" t-attf-class="{{ className }} {{ composerTextInputView.owner.isCompact ? 'border border-end-0' : 'border-0' }}" t-att-class="{ 'border-start-0': composerTextInputView.owner.isInChatWindow }" t-on-paste="composerTextInputView.owner.onPasteTextInput" t-ref="root">
<div class="o_ComposerTextInput position-relative bg-view" t-attf-class="{{ className }} {{ composerTextInputView.owner.isCompact ? 'border border-end-0' : 'border-0' }}" t-att-class="{ 'border-start-0': composerTextInputView.owner.isInChatWindow }" t-on-paste="composerTextInputView.owner.onPasteTextInput" t-ref="root">
<t t-if="composerTextInputView.owner.composerSuggestionListView">
<ComposerSuggestionListView record="composerTextInputView.owner.composerSuggestionListView"/>
</t>
@@ -2,7 +2,7 @@
<templates xml:space="preserve">
<t t-name="mail.DeleteMessageConfirm" owl="1">
<t t-if="deleteMessageConfirmView">
<div class="o_DeleteMessageConfirm card bg-white" t-attf-class="{{ className }}" t-ref="root">
<div class="o_DeleteMessageConfirm card bg-view" t-attf-class="{{ className }}" t-ref="root">
<h4 class="m-3">Confirmation</h4>
<hr class="mt-0 mb-3"/>
<p class="mx-3 mb-3">Are you sure you want to delete this message?</p>
@@ -4,7 +4,7 @@
<t t-name="mail.Discuss" owl="1">
<t t-if="discussView">
<div class="o_Discuss d-flex h-100" t-attf-class="{{ className }}"
t-att-class="{ 'o-isDeviceSmall flex-column align-items-center bg-white': messaging.device.isSmall }"
t-att-class="{ 'o-isDeviceSmall flex-column align-items-center bg-view': messaging.device.isSmall }"
t-ref="root"
>
<t t-if="!messaging.device.isSmall">
@@ -41,7 +41,7 @@
/>
</t>
<t t-if="!discussView.discuss.activeThread and (!messaging.device.isSmall or discussView.discuss.activeMobileNavbarTabId === 'mailbox')">
<div class="o_Discuss_noThread d-flex flex-grow-1 align-items-center justify-content-center w-100 bg-white">
<div class="o_Discuss_noThread d-flex flex-grow-1 align-items-center justify-content-center w-100 bg-view">
<h4 class="text-muted"><b><i>No conversation selected.</i></b></h4>
</div>
</t>
@@ -2,7 +2,7 @@
<templates xml:space="preserve">
<t t-name="mail.DropZone" owl="1">
<div class="o_DropZone position-absolute top-0 start-0 align-items-center justify-content-center d-flex w-100 h-100 border-primary bg-white-75 text-primary" t-att-class="{ 'o-dragging-inside': dropZoneView.isDraggingInside }" t-attf-class="{{ className }}" t-on-dragenter="dropZoneView.onDragenter" t-on-dragleave="dropZoneView.onDragleave" t-on-dragover="dropZoneView.onDragover" t-on-drop="dropZoneView.onDrop" t-ref="root">
<div class="o_DropZone position-absolute top-0 start-0 align-items-center justify-content-center d-flex w-100 h-100 border-primary bg-view text-primary opacity-75" t-att-class="{ 'o-dragging-inside': dropZoneView.isDraggingInside }" t-attf-class="{{ className }}" t-on-dragenter="dropZoneView.onDragenter" t-on-dragleave="dropZoneView.onDragleave" t-on-dragover="dropZoneView.onDragover" t-on-drop="dropZoneView.onDrop" t-ref="root">
<h4>
Drag Files Here <i class="fa fa-download"/>
</h4>
@@ -0,0 +1,3 @@
.o_EmojiCategoryBarView {
background-color: var(--EmojiCategoryBarView-background-color, #{$o-gray-200});
}
@@ -1,4 +1,4 @@
.o_EmojiCategoryView {
.o_EmojiCategoryView:not(.active) {
filter: grayscale(1);
}
@@ -2,7 +2,7 @@
<templates xml:space="preserve">
<t t-name="mail.EmojiCategoryView" owl="1">
<span class="o_EmojiCategoryView px-2 py-1 fs-5 cursor-pointer" t-att-class="(emojiCategoryView.isHovered or emojiCategoryView.isActive) ? 'bg-200' : ''" t-att-title="emojiCategoryView.category.name" t-on-click="emojiCategoryView.onClick" t-on-mouseenter="emojiCategoryView.onMouseenter" t-on-mouseleave="emojiCategoryView.onMouseleave" t-attf-class="{{ className }}" t-ref="root">
<span class="o_EmojiCategoryView flex-grow-1 px-2 py-1 fs-5 cursor-pointer" t-att-class="(emojiCategoryView.isHovered or emojiCategoryView.isActive) ? 'active bg-view' : 'border-bottom'" t-att-title="emojiCategoryView.category.name" t-on-click="emojiCategoryView.onClick" t-on-mouseenter="emojiCategoryView.onMouseenter" t-on-mouseleave="emojiCategoryView.onMouseleave" t-attf-class="{{ className }}" t-ref="root">
<t t-esc="emojiCategoryView.category.title"/>
</span>
</t>
@@ -2,12 +2,11 @@
<templates xml:space="preserve">
<t t-name="mail.EmojiSearchBarView" owl="1">
<div class="o_EmojiSearchBarView overflow-auto d-flex flex-shrink-0 p-2 flex-column" t-attf-class="{{ className }}" t-ref="root">
<div class="o_EmojiSearchBarView overflow-auto d-flex flex-shrink-0 p-2 flex-column border-bottom" t-attf-class="{{ className }}" t-ref="root">
<div class="o_EmojiSearchBarView_inputContainer d-flex flex-grow-1 align-items-center">
<input class="o_EmojiSearchBarView_searchInput border-0 overflow-auto flex-fill" t-att-class="{ 'opacity-50': !emojiSearchBarView.isFocused }" t-att-placeholder="emojiSearchBarView.placeholder" t-on-focusin="emojiSearchBarView.onFocusinInput" t-on-focusout="emojiSearchBarView.onFocusoutInput" t-on-input="emojiSearchBarView.onInput" t-ref="input"/>
<i class="o_EmojiSearchBarView_icon oi oi-search" t-att-class="{ 'opacity-25': !emojiSearchBarView.isFocused, 'o-isFocused': emojiSearchBarView.isFocused }" title="Search..." role="img" aria-label="Search..."/>
<input class="o_EmojiSearchBarView_searchInput o_input form-control overflow-auto flex-fill" t-att-placeholder="emojiSearchBarView.placeholder" t-on-focusin="emojiSearchBarView.onFocusinInput" t-on-focusout="emojiSearchBarView.onFocusoutInput" t-on-input="emojiSearchBarView.onInput" t-ref="input"/>
<i class="o_EmojiSearchBarView_icon oi oi-search ps-2" title="Search..." role="img" aria-label="Search..."/>
</div>
<hr class="o_EmojiSearchBarView_inputBar my-1" t-att-class="{ 'o-isFocused opacity-75': emojiSearchBarView.isFocused }"/>
</div>
</t>
@@ -5,7 +5,7 @@
<t t-if="followerSubtypeView">
<div class="o_FollowerSubtype" t-attf-class="{{ className }}" t-att-data-follower-subtype-id="followerSubtypeView.subtype.id" t-ref="root">
<label class="o_FollowerSubtype_label flex-grow-1 align-items-center d-flex mb-0 p-2 cursor-pointer">
<input class="o_FollowerSubtype_checkbox me-2" type="checkbox" t-att-checked="followerSubtypeView.follower.selectedSubtypes.includes(followerSubtypeView.subtype) ? 'checked': ''" t-on-change="followerSubtypeView.onChangeCheckbox"/>
<input class="o_FollowerSubtype_checkbox form-check-input me-2" type="checkbox" t-att-checked="followerSubtypeView.follower.selectedSubtypes.includes(followerSubtypeView.subtype) ? 'checked': ''" t-on-change="followerSubtypeView.onChangeCheckbox"/>
<t t-esc="followerSubtypeView.subtype.name"/>
</label>
</div>
@@ -16,3 +16,7 @@
-webkit-line-clamp: 3;
}
}
.o_LinkPreviewCardView_imageLinkWrap {
border-right: 1px solid $card-border-color;
}
@@ -1,17 +1,17 @@
<?xml version="1.0" encoding="UTF-8"?>
<templates xml:space="preserve">
<t t-name="mail.LinkPreviewCardView" owl="1">
<div class="o_LinkPreviewCardView card position-relative w-100 mb-2 rounded border border-light bg-white shadow-sm overflow-hidden" t-att-class="{ 'me-2': !linkPreviewCardView.linkPreviewListViewOwner.messageViewOwner.isInChatWindow }" t-attf-class="{{ className }}" t-on-mouseenter="linkPreviewCardView.onMouseEnter" t-on-mouseleave="linkPreviewCardView.onMouseLeave" t-ref="root">
<div class="o_LinkPreviewCardView card position-relative w-100 mb-2 rounded bg-view shadow-sm overflow-hidden" t-att-class="{ 'me-2': !linkPreviewCardView.linkPreviewListViewOwner.messageViewOwner.isInChatWindow }" t-attf-class="{{ className }}" t-on-mouseenter="linkPreviewCardView.onMouseEnter" t-on-mouseleave="linkPreviewCardView.onMouseLeave" t-ref="root">
<div class="row g-0 flex-row-reverse h-100">
<div class="col min-w-0" t-att-class="{ 'd-flex align-items-center': !linkPreviewCardView.linkPreview.og_description }">
<div class="o_LinkPreviewCardView_content p-3 bg-white">
<div class="o_LinkPreviewCardView_content p-3">
<h6 class="o_LinkPreviewCardView_title card-title mb-0 me-2" t-attf-class="{{ linkPreviewCardView.linkPreview.og_description ? 'text-truncate' : 'o_LinkPreviewCardView_hasMultineLines overflow-hidden' }}">
<a t-att-href="linkPreviewCardView.linkPreview.source_url" target="_blank" t-out="linkPreviewCardView.linkPreview.og_title"/>
</h6>
<p t-if="linkPreviewCardView.linkPreview.og_description" class="o_LinkPreviewCardView_description o_LinkPreviewCardView_hasMultineLines card-text mb-0 mt-2 text-muted small overflow-hidden" t-out="linkPreviewCardView.linkPreview.og_description"/>
</div>
</div>
<div class="col-4 d-block border-end border-light">
<div class="o_LinkPreviewCardView_imageLinkWrap col-4 d-block">
<a t-att-href="linkPreviewCardView.linkPreview.source_url" class="o_LinkPreviewCardView_imageLink" target="_blank">
<img t-if="linkPreviewCardView.linkPreview.og_image" class="o_LinkPreviewCardView_image w-100 h-100 o_object_fit_cover" t-att-src="linkPreviewCardView.linkPreview.og_image" t-att-alt="linkPreviewCardView.linkPreview.og_title"/>
<span t-else="" class="o_LinkPreviewCardView_imageEmpty d-flex align-items-center justify-content-center w-100 h-100 bg-100 text-300">
@@ -1,7 +1,7 @@
<?xml version="1.0" encoding="UTF-8"?>
<templates xml:space="preserve">
<t t-name="mail.LinkPreviewDeleteConfirmView" owl="1">
<div class="o_LinkPreviewDeleteConfirmView card bg-white" t-attf-class="{{ className }}" t-ref="root">
<div class="o_LinkPreviewDeleteConfirmView card bg-view" t-attf-class="{{ className }}" t-ref="root">
<h4 class="m-3">Confirmation</h4>
<hr class="mt-0 mb-3"/>
<p class="o_LinkPreviewDeleteConfirmView_mainText mx-3 mb-3">Do you really want to delete this preview?</p>
@@ -16,3 +16,15 @@
-webkit-line-clamp: 3;
}
}
.o_LinkPreviewVideoView_imageLinkWrap {
border-right: 1px solid $card-border-color;
}
.o_LinkPreviewVideoView_playBtn {
background: #000000;
i {
color: #ffffff;
}
}
@@ -1,23 +1,23 @@
<?xml version="1.0" encoding="UTF-8"?>
<templates xml:space="preserve">
<t t-name="mail.LinkPreviewVideoView" owl="1">
<div class="o_LinkPreview o_LinkPreviewVideoView card position-relative w-100 mb-2 rounded border border-light bg-white shadow-sm overflow-hidden" t-att-class="{ 'me-2': !linkPreviewVideoView.linkPreviewListViewOwner.messageViewOwner.isInChatWindow }" t-attf-class="{{ className }}" t-on-mouseenter="linkPreviewVideoView.onMouseEnter" t-on-mouseleave="linkPreviewVideoView.onMouseLeave" t-ref="root">
<div class="o_LinkPreview o_LinkPreviewVideoView card position-relative w-100 mb-2 rounded bg-view shadow-sm overflow-hidden" t-att-class="{ 'me-2': !linkPreviewVideoView.linkPreviewListViewOwner.messageViewOwner.isInChatWindow }" t-attf-class="{{ className }}" t-on-mouseenter="linkPreviewVideoView.onMouseEnter" t-on-mouseleave="linkPreviewVideoView.onMouseLeave" t-ref="root">
<div class="row g-0 flex-row-reverse h-100">
<div class="col min-w-0" t-att-class="{ 'd-flex align-items-center': !linkPreviewVideoView.linkPreview.og_description }">
<div class="o_LinkPreviewVideoView_content p-3 bg-white">
<div class="o_LinkPreviewVideoView_content p-3 bg-view">
<h6 class="o_LinkPreviewVideoView_title card-title mb-0 me-2" t-attf-class="{{ linkPreviewVideoView.linkPreview.og_description ? 'text-truncate' : 'o_LinkPreviewVideoView_hasMultineLines overflow-hidden' }}">
<a t-att-href="linkPreviewVideoView.linkPreview.source_url" target="_blank" t-esc="linkPreviewVideoView.linkPreview.og_title"/>
</h6>
<p t-if="linkPreviewVideoView.linkPreview.og_description" class="o_LinkPreviewVideoView_description o_LinkPreviewVideoView_hasMultineLines card-text mb-0 mt-2 text-muted small overflow-hidden" t-out="linkPreviewVideoView.linkPreview.og_description"></p>
</div>
</div>
<div class="col-4 d-block border-end border-light">
<div class="o_LinkPreviewVideoView_imageLinkWrap col-4 d-block">
<a t-att-href="linkPreviewVideoView.linkPreview.source_url" class="o_LinkPreviewVideoView_imageLink" target="_blank">
<div t-if="linkPreviewVideoView.linkPreview.og_image" class="o_linkPreviewVideo_overlay position-relative h-100 opacity-trigger-hover">
<img class="o_LinkPreviewVideoView_image img-fluid h-100 rounded-bottom o_object_fit_cover" t-att-src="linkPreviewVideoView.linkPreview.og_image" t-att-alt="linkPreviewVideoView.linkPreview.og_title"/>
<div class="position-absolute top-50 start-50 translate-middle">
<div class="btn btn-dark btn-lg rounded opacity-75 opacity-100-hover transition-base">
<i class="fa fa-play text-white"/>
<div class="o_LinkPreviewVideoView_playBtn btn btn-lg rounded opacity-75 opacity-100-hover transition-base">
<i class="fa fa-play"/>
</div>
</div>
</div>
@@ -10,7 +10,7 @@
'o-discussion': messageView.message.isDiscussionOrNotification,
'o-has-message-selection': messageView.messageListViewItemOwner and messageView.messageListViewItemOwner.messageListViewOwner.threadViewOwner.replyingToMessageView,
'o-highlighted': messageView.message.isHighlighted or messageView.isHighlighted,
'o-isReplyHighlighted bg-white shadow-lg': messageView.isHighlighted,
'o-isReplyHighlighted bg-view shadow-lg': messageView.isHighlighted,
'o-isDeviceSmall': messaging.device.isSmall,
'o-not-discussion': !messageView.message.isDiscussionOrNotification,
'o-notification': messageView.message.message_type === 'notification',
@@ -1,3 +1,7 @@
.o_MessageActionList:not(.o-isDeviceSmall) {
font-size: 0.9rem;
.o_MessageActionList {
background-color: var(--MessageActionList-background-color, #{$o-white});
&:not(.o-isDeviceSmall) {
font-size: 0.9rem;
}
}
@@ -2,7 +2,7 @@
<templates>
<t t-name="mail.MessageActionList" owl="1">
<t t-if="messageActionList">
<div class="o_MessageActionList d-flex rounded-1 bg-white shadow-sm" t-att-class="{ 'o-isDeviceSmall': messaging.device.isSmall, 'flex-row-reverse': messageActionList.messageView.isInChatWindowAndIsAlignedRight }" t-attf-class="{{ className }}" t-ref="root">
<div class="o_MessageActionList d-flex rounded-1 shadow-sm overflow-hidden" t-att-class="{ 'o-isDeviceSmall': messaging.device.isSmall, 'flex-row-reverse': messageActionList.messageView.isInChatWindowAndIsAlignedRight }" t-attf-class="{{ className }}" t-ref="root">
<t t-foreach="messageActionList.messageActionViews" t-as="messageActionView" t-key="messageActionView.localId">
<MessageActionView record="messageActionView"/>
</t>
@@ -1,5 +1,5 @@
.o_MessageActionView:hover {
background-color: mix($border-color, $white);
background-color: var(--MessageActionView-background-color--hover, #{mix($border-color, $white)});
}
.o_MessageActionView_actionToggleStar_active {
@@ -3,5 +3,5 @@
// ------------------------------------------------------------------
.o_MessageReactionGroup.o-hasUserReacted {
background: mix($o-brand-primary, white, 10%);
background: mix($o-brand-primary, $o-view-background-color, 10%);
}
@@ -3,7 +3,7 @@
<t t-name="mail.MessageReactionGroup" owl="1">
<t t-if="messageReactionGroup">
<button class="o_MessageReactionGroup btn d-flex p-0 border rounded-1" t-att-class="{'o-hasUserReacted border-primary': messageReactionGroup.hasUserReacted, 'bg-white': !messageReactionGroup.hasUserReacted}" t-attf-class="{{ className }}" t-att-title="messageReactionGroup.summary" t-on-click="messageReactionGroup.onClick" t-ref="root">
<button class="o_MessageReactionGroup btn d-flex p-0 border rounded-1" t-att-class="{'o-hasUserReacted border-primary': messageReactionGroup.hasUserReacted, 'bg-view': !messageReactionGroup.hasUserReacted}" t-attf-class="{{ className }}" t-att-title="messageReactionGroup.summary" t-on-click="messageReactionGroup.onClick" t-ref="root">
<span class="o_MessageReactionGroup_content mx-1">
<t t-esc="messageReactionGroup.content"/>
</span>
@@ -16,7 +16,7 @@
</t>
</a>
<t t-if="messagingMenu.isOpen">
<div class="o_MessagingMenu_dropdownMenu o-dropdown-menu dropdown-menu-end d-flex flex-column mt-0 py-0 overflow-auto" t-att-class="{ 'o-isDeviceSmall position-fixed bottom-0 start-0 end-0 flex-grow-1 w-100 m-0 border-0': messaging.device.isSmall, 'border': !messaging.device.isSmall, 'o-messaging-not-initialized align-items-center justify-content-center': !messaging.isInitialized }" role="menu">
<div class="o_MessagingMenu_dropdownMenu o-dropdown-menu dropdown-menu-end d-flex flex-column mt-0 py-0 bg-view overflow-auto" t-att-class="{ 'o-isDeviceSmall position-fixed bottom-0 start-0 end-0 flex-grow-1 w-100 m-0 border-0': messaging.device.isSmall, 'border': !messaging.device.isSmall, 'o-messaging-not-initialized align-items-center justify-content-center': !messaging.isInitialized }" role="menu">
<t t-if="!messaging.isInitialized">
<span><i class="o_MessagingMenu_dropdownLoadingIcon fa fa-circle-o-notch fa-spin me-1"/>Please wait...</span>
</t>
@@ -3,7 +3,7 @@
<t t-name="mail.MobileMessagingNavbar" owl="1">
<t t-if="mobileMessagingNavbarView">
<div class="o_MobileMessagingNavbar d-flex flex-shrink-0 border-top bg-white shadow-lg" t-attf-class="{{ className }}" t-ref="root">
<div class="o_MobileMessagingNavbar d-flex flex-shrink-0 border-top bg-view shadow-lg" t-attf-class="{{ className }}" t-ref="root">
<t t-foreach="mobileMessagingNavbarView.tabs" t-as="tab" t-key="tab.id">
<div class="o_MobileMessagingNavbar_tab d-flex flex-column align-items-center flex-grow-1 p-2" t-att-class="{ 'o-active text-primary': mobileMessagingNavbarView.activeTabId === tab.id, 'border-start': tab_index !== 0 }" t-on-click="ev => mobileMessagingNavbarView.onClick(tab.id, ev)" t-att-data-tab-id="tab.id">
<t t-if="tab.icon">
@@ -1,4 +1,4 @@
$o-mail-notification-list-item-background-color: $white !default;
$o-mail-notification-list-item-background-color: $o-view-background-color !default;
$o-mail-notification-list-item-hover-background-color:
darken($o-mail-notification-list-item-background-color, 7%) !default;
@@ -15,14 +15,6 @@
// ------------------------------------------------------------------
// Style
// ------------------------------------------------------------------
.o_PersonaImStatusIcon_icon {
&.o-bot {
color: $o-enterprise-primary-color;
}
&.o-online {
color: $o-enterprise-primary-color;
}
.o_PersonaImStatusIcon_outerBackground, .o_PersonaImStatusIcon_innerBackground {
color: $o-view-background-color;
}
@@ -17,10 +17,10 @@
>
<t t-if="personaImStatusIconView.hasBackground">
<i class="o_PersonaImStatusIcon_outerBackground fa fa-circle fa-stack-1x"/>
<i class="o_PersonaImStatusIcon_innerBackground fa fa-circle fa-stack-1x text-white"/>
<i class="o_PersonaImStatusIcon_innerBackground fa fa-circle fa-stack-1x"/>
</t>
<t t-if="personaImStatusIconView.persona.im_status === 'online'">
<i class="o_PersonaImStatusIcon_icon o-online fa fa-circle fa-stack-1x" title="Online" role="img" aria-label="User is online"/>
<i class="o_PersonaImStatusIcon_icon o-online fa fa-circle fa-stack-1x text-primary" title="Online" role="img" aria-label="User is online"/>
</t>
<t t-if="personaImStatusIconView.persona.im_status === 'away'">
<i class="o_PersonaImStatusIcon_icon o-away fa fa-circle fa-stack-1x text-warning" title="Idle" role="img" aria-label="User is idle"/>
@@ -29,7 +29,7 @@
<i class="o_PersonaImStatusIcon_icon o-offline fa fa-circle-o fa-stack-1x text-700" title="Offline" role="img" aria-label="User is offline"/>
</t>
<t t-if="personaImStatusIconView.persona === messaging.partnerRoot.persona">
<i class="o_PersonaImStatusIcon_icon o-bot fa fa-heart fa-stack-1x" title="Bot" role="img" aria-label="User is a bot"/>
<i class="o_PersonaImStatusIcon_icon o-bot fa fa-heart fa-stack-1x text-primary" title="Bot" role="img" aria-label="User is a bot"/>
</t>
</span>
</t>
@@ -3,7 +3,7 @@
<t t-name="mail.PopoverView" owl="1">
<t t-if="popoverView">
<div class="o_PopoverView border bg-white shadow-sm" t-attf-class="{{ className }}" t-ref="root">
<div class="o_PopoverView border bg-view shadow-sm" t-attf-class="{{ className }}" t-ref="root">
<t
t-component="constructor.components[popoverView.contentComponentName]"
className="popoverView.contentClassName"
@@ -10,12 +10,12 @@
<div class="o_ThreadViewTopbar_title d-flex flex-grow-1 align-self-center align-items-center">
<t t-if="threadViewTopbar.thread">
<t t-if="!threadViewTopbar.isEditingThreadName">
<div class="o_ThreadViewTopbar_threadName o_ThreadViewTopbar_editableItem lead flex-shrink-0 px-1 border text-truncate fw-bold" t-att-title="threadViewTopbar.thread.displayName" t-on-click="threadViewTopbar.onClickTopbarThreadName" t-on-mouseenter="threadViewTopbar.onMouseEnterTopbarThreadName" t-on-mouseleave="threadViewTopbar.onMouseLeaveTopbarThreadName" t-attf-class="{{ threadViewTopbar.isMouseOverThreadName and !messaging.isCurrentUserGuest ? 'o-threadNameEditable bg-white' : 'border-light' }}">
<div class="o_ThreadViewTopbar_threadName o_ThreadViewTopbar_editableItem lead flex-shrink-0 px-1 border text-truncate fw-bold" t-att-title="threadViewTopbar.thread.displayName" t-on-click="threadViewTopbar.onClickTopbarThreadName" t-on-mouseenter="threadViewTopbar.onMouseEnterTopbarThreadName" t-on-mouseleave="threadViewTopbar.onMouseLeaveTopbarThreadName" t-attf-class="{{ threadViewTopbar.isMouseOverThreadName and !messaging.isCurrentUserGuest ? 'o-threadNameEditable bg-view' : 'border-light' }}">
<t t-esc="threadViewTopbar.thread.displayName"/>
</div>
</t>
<t t-if="threadViewTopbar.isEditingThreadName">
<input class="o_ThreadViewTopbar_threadNameInput lead fw-bold" type="text" t-att-value="threadViewTopbar.pendingThreadName" t-on-input="threadViewTopbar.onInputThreadNameInput" t-on-keydown="threadViewTopbar.onKeyDownThreadNameInput" t-ref="threadNameInput"/>
<input class="o_ThreadViewTopbar_threadNameInput form-control lead fw-bold" type="text" t-att-value="threadViewTopbar.pendingThreadName" t-on-input="threadViewTopbar.onInputThreadNameInput" t-on-keydown="threadViewTopbar.onKeyDownThreadNameInput" t-ref="threadNameInput"/>
</t>
</t>
<t t-if="!threadViewTopbar.thread">
@@ -27,7 +27,7 @@
<div class="o_ThreadViewTopbar_threadDescriptionSeparator flex-shrink-0 mx-2 py-2 border-start"/>
<t t-if="!threadViewTopbar.isEditingThreadDescription">
<t t-if="threadViewTopbar.thread.description">
<div class="o_ThreadViewTopbar_threadDescription o_ThreadViewTopbar_editableItem px-1 border text-truncate" t-att-title="threadViewTopbar.thread.description" t-on-click="threadViewTopbar.onClickTopbarThreadDescription" t-on-mouseenter="threadViewTopbar.onMouseEnterTopbarThreadDescription" t-on-mouseleave="threadViewTopbar.onMouseLeaveTopbarThreadDescription" t-attf-class="{{ threadViewTopbar.isDescriptionHighlighted ? 'o-threadDescriptionEditable bg-white' : 'border-light' }}">
<div class="o_ThreadViewTopbar_threadDescription o_ThreadViewTopbar_editableItem px-1 border text-truncate" t-att-title="threadViewTopbar.thread.description" t-on-click="threadViewTopbar.onClickTopbarThreadDescription" t-on-mouseenter="threadViewTopbar.onMouseEnterTopbarThreadDescription" t-on-mouseleave="threadViewTopbar.onMouseLeaveTopbarThreadDescription" t-attf-class="{{ threadViewTopbar.isDescriptionHighlighted ? 'o-threadDescriptionEditable bg-view' : 'border-light' }}">
<t t-esc="threadViewTopbar.thread.description"/>
</div>
</t>
@@ -38,7 +38,7 @@
</t>
</t>
<t t-if="threadViewTopbar.isEditingThreadDescription">
<input class="o_ThreadViewTopbar_threadDescriptionInput" type="text" t-att-value="threadViewTopbar.pendingThreadDescription" t-on-input="threadViewTopbar.onInputThreadDescriptionInput" t-on-keydown="threadViewTopbar.onKeyDownThreadDescriptionInput" t-ref="threadDescriptionInput"/>
<input class="o_ThreadViewTopbar_threadDescriptionInput form-control" type="text" t-att-value="threadViewTopbar.pendingThreadDescription" t-on-input="threadViewTopbar.onInputThreadDescriptionInput" t-on-keydown="threadViewTopbar.onKeyDownThreadDescriptionInput" t-ref="threadDescriptionInput"/>
</t>
</t>
</div>
@@ -89,12 +89,12 @@
<div class="o_ThreadViewTopbar_userInfo d-flex align-items-center">
<img class="o_ThreadViewTopbar_avatar mx-1 rounded-circle o_object_fit_cover" t-att-src="threadViewTopbar.avatarUrl" alt="Avatar"/>
<t t-if="!threadViewTopbar.isEditingGuestName">
<span class="o_ThreadViewTopbar_userName o_ThreadViewTopbar_editableItem px-1 border fw-bold text-truncate" t-attf-class="{{ threadViewTopbar.isMouseOverUserName and messaging.isCurrentUserGuest ? 'o-userNameEditable bg-white' : 'border-light' }}" t-on-click="threadViewTopbar.onClickUserName" t-on-mouseenter="threadViewTopbar.onMouseEnterUserName" t-on-mouseleave="threadViewTopbar.onMouseLeaveUserName">
<span class="o_ThreadViewTopbar_userName o_ThreadViewTopbar_editableItem px-1 border fw-bold text-truncate" t-attf-class="{{ threadViewTopbar.isMouseOverUserName and messaging.isCurrentUserGuest ? 'o-userNameEditable bg-view' : 'border-light' }}" t-on-click="threadViewTopbar.onClickUserName" t-on-mouseenter="threadViewTopbar.onMouseEnterUserName" t-on-mouseleave="threadViewTopbar.onMouseLeaveUserName">
<t t-esc="messaging.isCurrentUserGuest ? messaging.currentGuest.name : messaging.currentUser.nameOrDisplayName"/>
</span>
</t>
<t t-if="threadViewTopbar.isEditingGuestName">
<input class="o_ThreadViewTopbar_guestNameInput" type="text" t-att-value="messaging.currentGuest.name" t-on-input="threadViewTopbar.onInputGuestNameInput" t-on-keydown="threadViewTopbar.onKeyDownGuestNameInput" t-ref="guestNameInput"/>
<input class="o_ThreadViewTopbar_guestNameInput form-control" type="text" t-att-value="messaging.currentGuest.name" t-on-input="threadViewTopbar.onInputGuestNameInput" t-on-keydown="threadViewTopbar.onKeyDownGuestNameInput" t-ref="guestNameInput"/>
</t>
</div>
</t>
@@ -57,7 +57,7 @@
export const emojiCategoriesData = JSON.parse(`[
{
"name": "Smileys & Emotion",
"title": "🤠",
"title": "🙂",
"sortId": 1
},
{
@@ -67,32 +67,32 @@ export const emojiCategoriesData = JSON.parse(`[
},
{
"name": "Animals & Nature",
"title": "🐘",
"title": "🐢",
"sortId": 3
},
{
"name": "Food & Drink",
"title": "🍔",
"title": "🍭",
"sortId": 4
},
{
"name": "Travel & Places",
"title": "🚍",
"title": "🚗",
"sortId": 5
},
{
"name": "Activities",
"title": "🎣",
"title": "🏈",
"sortId": 6
},
{
"name": "Objects",
"title": "🎩",
"title": "📕",
"sortId": 7
},
{
"name": "Symbols",
"title": "🚰",
"title": "🔠",
"sortId": 8
}
]`);
@@ -1,7 +1,6 @@
.o_activity_view {
height: 100%;
> table {
background-color: white;
thead > tr > th:first-of-type {
min-width: 300px;
}
@@ -10,7 +9,6 @@
}
}
.o_activity_summary_cell {
background-color: #FFF;
&.planned {
background-color: map-get($theme-colors, 'success');
}
@@ -38,7 +36,7 @@
display: none;
}
&:hover {
background-color: #eee;
background-color: $component-active-bg;
> i {
color: gray;
@@ -102,9 +100,6 @@
.o_activity_filter_overdue {
background-color: mix(map-get($theme-colors, 'danger'), $o-webclient-background-color, 5%);
}
.o_record_selector {
color: $o-enterprise-primary-color;
}
.o_activity_type_cell {
padding:10px;
min-width:100px;
+2 -2
View File
@@ -76,7 +76,7 @@
<tfoot>
<tr class="o_data_row">
<td class="o_record_selector p-3" t-on-click.prevent.stop="() => this.trigger('schedule_activity')">
<span class="fa fa-plus pe-2"/><span>Schedule activity</span>
<span class="btn btn-link"><i class="fa fa-plus pe-2"/><span>Schedule activity</span></span>
</td>
</tr>
</tfoot>
@@ -84,7 +84,7 @@
<div t-name="mail.ActivityRenderer" class="o_activity_view" owl="1">
<t t-if="!props.activity_types.length" t-call="web.NoContentHelper"/>
<table t-else="" class="table table-bordered mb-5">
<table t-else="" class="table table-bordered mb-5 bg-view">
<t t-call="mail.ActivityViewHeader"/>
<t t-call="mail.ActivityViewBody"/>
<t t-call="mail.ActivityViewFooter"/>
@@ -1,5 +1,5 @@
.o_odoobot_command {
background-color: lightgray;
background-color: $gray-200;
border-radius: 4px;
padding: 2px;
padding-left: 10px;
+2
View File
@@ -261,6 +261,8 @@ $form-check-input-checked-bg-color: $o-brand-primary !default;
$form-switch-checked-color: $input-bg !default;
$form-switch-circle-bg-color: $input-bg !default;
$form-range-thumb-bg: $primary !default;
// Badge
$badge-color: inherit !default;
$badge-padding-y: 0.25em !default;