[IMP] web: improve design of block_ui
Prior this commit the spinner was an image. After this commit the spinner is an animated SVG. It also improves the layout of the block_ui component. task-2750837 closes odoo/odoo#83811 Signed-off-by: Adrien Dieudonné (adr) <adr@odoo.com>
This commit is contained in:
@@ -71,12 +71,12 @@ export class BlockUI extends Component {
|
||||
}
|
||||
|
||||
BlockUI.template = xml`
|
||||
<div t-att-class="state.blockUI ? 'o_blockUI fixed-top d-flex justify-content-center align-items-center flex-column vh-100 bg-black' : ''">
|
||||
<div t-att-class="state.blockUI ? 'o_blockUI fixed-top d-flex justify-content-center align-items-center flex-column vh-100 bg-black-50' : ''">
|
||||
<t t-if="state.blockUI">
|
||||
<div class="o_spinner mb-3 h-auto">
|
||||
<img src="/web/static/img/spin.png" alt="Loading..."/>
|
||||
<div class="o_spinner mb-4">
|
||||
<img src="/web/static/img/spin.svg" alt="Loading..."/>
|
||||
</div>
|
||||
<div class="o_message text-center">
|
||||
<div class="o_message text-center px-4">
|
||||
<t t-esc="state.line1"/> <br/>
|
||||
<t t-esc="state.line2"/>
|
||||
</div>
|
||||
|
||||
@@ -1,8 +1,5 @@
|
||||
.o_blockUI {
|
||||
cursor: wait;
|
||||
opacity: 0.6;
|
||||
|
||||
img {
|
||||
animation: fa-spin 1s infinite steps(12);
|
||||
}
|
||||
-webkit-backdrop-filter: blur(2px);
|
||||
backdrop-filter: blur(2px);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user