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

[REF] mail: callOptionMenu, review and simplify scss

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

task-2855813

closes odoo/odoo#91563

Signed-off-by: Alexandre Kühn (aku) <aku@odoo.com>
This commit is contained in:
xlu-odoo
2022-06-28 16:03:14 +02:00
parent 47c73c7213
commit 2453eda926
2 changed files with 22 additions and 63 deletions
Download Patch File Download Diff File Expand all files Collapse all files
addons/mail/static/src/components/call_option_menu/call_option_menu.scss
+4 -45
View File
@@ -1,55 +1,14 @@
// ------------------------------------------------------------------
// Layout
// ------------------------------------------------------------------
.o_CallOptionMenu {
display: flex;
flex-direction: column;
}
.o_CallOptionMenu_button {
display: flex;
margin: map-get($spacers, 1);
align-items: center;
color: gray('800');
}
.o_CallOptionMenu_buttonIcon {
margin: map-get($spacers, 1);
padding: map-get($spacers, 1);
}
.o_CallOptionMenu_buttonText {
@include text-truncate();
}
// ------------------------------------------------------------------
// Style
// ------------------------------------------------------------------
.o_CallOptionMenu_button {
background: none;
border: none;
outline: none;
cursor: pointer;
border-radius: 5px;
color: gray('800');
&:hover {
background-color: gray('100');
box-shadow: 0px 0px 1px 1px gray('300') inset;
background-color: $gray-100;
box-shadow: 0px 0px 1px 1px $gray-300 inset;
}
&:active {
background-color: gray('200');
box-shadow: 0px 0px 1px 1px gray('400') inset;
}
@include hover-focus () {
outline: none;
background-color: $gray-200;
box-shadow: 0px 0px 1px 1px $gray-400 inset;
}
}
.o_CallOptionMenu_separator {
background-color: $border-color;
}
addons/mail/static/src/components/call_option_menu/call_option_menu.xml
+18 -18
View File
@@ -3,36 +3,36 @@
<t t-name="mail.CallOptionMenu" owl="1">
<t t-if="callOptionMenu">
<div class="o_CallOptionMenu" t-attf-class="{{ className }}" t-ref="root">
<div class="o_CallOptionMenu d-flex flex-column" t-attf-class="{{ className }}" t-ref="root">
<t t-if="callOptionMenu.callActionListView.callView.threadView.thread.videoCount > 0">
<div class="o_CallOptionMenu_button">
<label class="o_CallOptionMenu_checkBoxLabel o_cursor_pointer d-flex align-items-center p-1 mb-0">
<input class="o_CallOptionMenu_checkBox p-1 ml-2 mr-2" type="checkbox" t-on-change="callOptionMenu.onChangeVideoFilterCheckbox" t-att-checked="callOptionMenu.callActionListView.callView.filterVideoGrid"/>
<span class="o_CallOptionMenu_buttonText">Video only</span>
<div class="o_CallOptionMenu_button btn d-flex align-items-center border-0 rounded">
<label class="o_CallOptionMenu_checkBoxLabel o_cursor_pointer d-flex align-items-center mb-0 text-800 font-weight-normal">
<input class="o_CallOptionMenu_checkBox mx-2 p-1" type="checkbox" t-on-change="callOptionMenu.onChangeVideoFilterCheckbox" t-att-checked="callOptionMenu.callActionListView.callView.filterVideoGrid"/>
<span class="o_CallOptionMenu_buttonText py-1 pl-1 text-truncate">Video only</span>
</label>
</div>
<hr class="o_CallOptionMenu_separator w-100"/>
<hr class="o_CallOptionMenu_separator w-100 my-1 bg-300"/>
</t>
<t t-if="callOptionMenu.callActionListView.callView.isFullScreen">
<button class="o_CallOptionMenu_button" t-on-click="callOptionMenu.onClickDeactivateFullScreen">
<i class="o_CallOptionMenu_buttonIcon fa fa-lg fa-compress"/>
<span class="o_CallOptionMenu_buttonText">Exit full screen</span>
<button class="o_CallOptionMenu_button btn d-flex align-items-center border-0 rounded text-800 font-weight-normal" t-on-click="callOptionMenu.onClickDeactivateFullScreen">
<i class="o_CallOptionMenu_buttonIcon fa fa-lg fa-compress m-1 p-1"/>
<span class="o_CallOptionMenu_buttonText text-truncate">Exit full screen</span>
</button>
</t>
<t t-else="">
<button class="o_CallOptionMenu_button" t-on-click="callOptionMenu.onClickActivateFullScreen">
<i class="o_CallOptionMenu_buttonIcon fa fa-lg fa-arrows-alt"/>
<span class="o_CallOptionMenu_buttonText">Full screen</span>
<button class="o_CallOptionMenu_button btn d-flex align-items-center border-0 rounded text-800 font-weight-normal" t-on-click="callOptionMenu.onClickActivateFullScreen">
<i class="o_CallOptionMenu_buttonIcon fa fa-lg fa-arrows-alt m-1 p-1"/>
<span class="o_CallOptionMenu_buttonText text-truncate">Full screen</span>
</button>
</t>
<button class="o_CallOptionMenu_button" t-on-click="callOptionMenu.onClickOptions">
<i class="o_CallOptionMenu_buttonIcon fa fa-lg fa-cog"/>
<span class="o_CallOptionMenu_buttonText">Settings</span>
<button class="o_CallOptionMenu_button btn d-flex align-items-center border-0 rounded text-800 font-weight-normal" t-on-click="callOptionMenu.onClickOptions">
<i class="o_CallOptionMenu_buttonIcon fa fa-lg fa-cog m-1 p-1"/>
<span class="o_CallOptionMenu_buttonText text-truncate">Settings</span>
</button>
<t t-if="messaging.modelManager.isDebug">
<button class="o_CallOptionMenu_button" t-on-click="callOptionMenu.onClickDownloadLogs">
<i class="o_CallOptionMenu_buttonIcon fa fa-lg fa-file-text-o"/>
<span class="o_CallOptionMenu_buttonText">Download logs</span>
<button class="o_CallOptionMenu_button btn d-flex align-items-center border-0 rounded text-800 font-weight-normal" t-on-click="callOptionMenu.onClickDownloadLogs">
<i class="o_CallOptionMenu_buttonIcon fa fa-lg fa-file-text-o m-1 p-1"/>
<span class="o_CallOptionMenu_buttonText text-truncate">Download logs</span>
</button>
</t>
</div>