refactor: Use o_sign_image_item class for image sign item styling instead of data-type attribute.

This commit is contained in:
Suherdy Yacob 2026-02-12 15:48:19 +07:00
parent 71a54e4eb7
commit a197c027ef
2 changed files with 9 additions and 9 deletions

View File

@ -1,19 +1,19 @@
/* Sign Image Field Styles */ /* Sign Image Field Styles */
.o_sign_sign_item[data-type="image"] { .o_sign_sign_item.o_sign_image_item {
border: 2px dashed #ccc; border: 2px dashed #ccc;
background-color: #f9f9f9; background-color: #f9f9f9;
cursor: pointer; cursor: pointer;
transition: all 0.2s ease; transition: all 0.2s ease;
} }
.o_sign_sign_item[data-type="image"]:hover { .o_sign_sign_item.o_sign_image_item:hover {
border-color: #007bff; border-color: #007bff;
background-color: #f0f8ff; background-color: #f0f8ff;
} }
.o_sign_sign_item[data-type="image"] .o_placeholder, .o_sign_sign_item.o_sign_image_item .o_placeholder,
.o_sign_sign_item[data-type="image"] .o_placeholder { .o_sign_sign_item.o_sign_image_item .o_placeholder {
font-size: 12px !important; font-size: 12px !important;
color: #666 !important; color: #666 !important;
font-weight: normal !important; font-weight: normal !important;
@ -25,7 +25,7 @@
line-height: 1 !important; line-height: 1 !important;
} }
.o_sign_sign_item[data-type="image"] img { .o_sign_sign_item.o_sign_image_item img {
max-width: 100%; max-width: 100%;
max-height: 100%; max-height: 100%;
object-fit: contain; object-fit: contain;
@ -33,11 +33,11 @@
} }
/* Force reasonable font size for all image placeholders with highest specificity */ /* Force reasonable font size for all image placeholders with highest specificity */
div.o_sign_sign_item[data-type="image"] span.o_placeholder { div.o_sign_sign_item.o_sign_image_item span.o_placeholder {
font-size: 12px !important; font-size: 12px !important;
} }
/* Override any inherited font sizes with maximum specificity */ /* Override any inherited font sizes with maximum specificity */
body div.o_sign_sign_item[data-type="image"] span.o_placeholder { body div.o_sign_sign_item.o_sign_image_item span.o_placeholder {
font-size: 12px !important; font-size: 12px !important;
} }

View File

@ -5,7 +5,7 @@
<t t-if="type == 'image'" t-call="sign.imageSignItem"/> <t t-if="type == 'image'" t-call="sign.imageSignItem"/>
</xpath> </xpath>
<xpath expr="//div[@t-if=&quot;type == 'selection'&quot;]" position="after"> <xpath expr="//div[@t-if=&quot;type == 'selection'&quot;]" position="after">
<div t-if="type == 'image'" t-att-title="role" t-attf-class="{{classes}} o_sign_sign_item" t-att-style="style" t-att-data-value="value" t-att-data-type="'image'" style="text-align:center; display:flex; align-items:center; justify-content:center;"> <div t-if="type == 'image'" t-att-title="role" t-attf-class="{{classes}} o_sign_sign_item o_sign_image_item" t-att-style="style" t-att-data-value="value" t-att-data-type="'image'" style="text-align:center; display:flex; align-items:center; justify-content:center;">
<input type="file" accept="image/*" class="o_sign_image_upload_input" style="display:none"/> <input type="file" accept="image/*" class="o_sign_image_upload_input" style="display:none"/>
<t t-if="value"> <t t-if="value">
<img t-att-src="value" style="max-width:100%; max-height:100%; object-fit:contain;"/> <img t-att-src="value" style="max-width:100%; max-height:100%; object-fit:contain;"/>
@ -21,7 +21,7 @@
</t> </t>
<t t-name="sign.imageSignItem"> <t t-name="sign.imageSignItem">
<div t-att-title="role" t-attf-class="{{classes}} o_sign_sign_item" t-att-data-id="id" t-att-style="style" t-att-data-type="'image'" style="text-align:center; display:flex; align-items:center; justify-content:center;"> <div t-att-title="role" t-attf-class="{{classes}} o_sign_sign_item o_sign_image_item" t-att-data-id="id" t-att-style="style" t-att-data-type="'image'" style="text-align:center; display:flex; align-items:center; justify-content:center;">
<div class="sign_item_body"> <div class="sign_item_body">
<t t-if="value"> <t t-if="value">
<img t-att-src="value" style="max-width:100%; max-height:100%; object-fit:contain;"/> <img t-att-src="value" style="max-width:100%; max-height:100%; object-fit:contain;"/>