Elgato_dark/ToolJet
1
0
Fork 0
mirror of https://github.com/ToolJet/ToolJet synced 2026-05-23 17:08:34 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

fix: image alignment

Browse source
This commit is contained in:
Vijaykant Yadav 2025-04-03 14:36:07 +05:30
parent 1497c22720
commit ec6e226130
4 changed files with 33 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

13
frontend/src/AppBuilder/WidgetManager/widgets/image.js
View file

@ -143,6 +143,15 @@ export const imageConfig = {
},
accordian: 'Image',
},
alignment: {
type: 'alignButtons',
displayName: 'Alignment',
validation: {
schema: { type: 'string' },
defaultValue: 'center',
},
accordian: 'Image',
},
backgroundColor: {
type: 'color',
displayName: 'Background',
@ -179,11 +188,11 @@ export const imageConfig = {
padding: {
type: 'switch',
displayName: 'Padding',
validation: { schema: { type: 'string' }, defaultValue: 'default' },
options: [
{ displayName: 'Default', value: 'default' },
{ displayName: 'Custom', value: 'custom' },
],
validation: { schema: { type: 'string' }, defaultValue: 'default' },
accordian: 'Container',
isFxNotRequired: true,
},
@ -244,7 +253,6 @@ export const imageConfig = {
loadingState: { value: '{{false}}' },
disabledState: { value: '{{false}}' },
visibility: { value: '{{true}}' },
visible: { value: '{{true}}' },
},
events: [],
styles: {
@ -256,6 +264,7 @@ export const imageConfig = {
boxShadow: { value: '0px 0px 0px 0px #00000090' },
padding: { value: 'default' },
customPadding: { value: '{{0}}' },
alignment: { value: 'center' },
},
},
};

1
frontend/src/Editor/Components/Image/Image.jsx
View file

@ -177,6 +177,7 @@ export const Image = function Image({
border: '1px solid',
borderRadius: imageShape === 'circle' ? '50%' : `${borderRadius}px`,
borderColor: borderColor ? borderColor : 'transparent',
objectPosition: alignment,
}}
height={height}
onClick={() => fireEvent('onClick')}

10
frontend/src/Editor/WidgetManager/configs/image.js
View file

@ -143,6 +143,15 @@ export const imageConfig = {
},
accordian: 'Image',
},
alignment: {
type: 'alignButtons',
displayName: 'Alignment',
validation: {
schema: { type: 'string' },
defaultValue: 'center',
},
accordian: 'Image',
},
backgroundColor: {
type: 'color',
displayName: 'Background',
@ -255,6 +264,7 @@ export const imageConfig = {
boxShadow: { value: '0px 0px 0px 0px #00000090' },
padding: { value: 'default' },
customPadding: { value: '{{0}}' },
alignment: { value: 'center' },
},
},
};

13
server/src/modules/apps/services/widget-config/image.js
View file

@ -143,6 +143,15 @@ export const imageConfig = {
},
accordian: 'Image',
},
alignment: {
type: 'alignButtons',
displayName: 'Alignment',
validation: {
schema: { type: 'string' },
defaultValue: 'center',
},
accordian: 'Image',
},
backgroundColor: {
type: 'color',
displayName: 'Background',
@ -179,11 +188,11 @@ export const imageConfig = {
padding: {
type: 'switch',
displayName: 'Padding',
validation: { schema: { type: 'string' }, defaultValue: 'default' },
options: [
{ displayName: 'Default', value: 'default' },
{ displayName: 'Custom', value: 'custom' },
],
validation: { schema: { type: 'string' }, defaultValue: 'default' },
accordian: 'Container',
isFxNotRequired: true,
},
@ -244,7 +253,6 @@ export const imageConfig = {
loadingState: { value: '{{false}}' },
disabledState: { value: '{{false}}' },
visibility: { value: '{{true}}' },
visible: { value: '{{true}}' },
},
events: [],
styles: {
@ -256,6 +264,7 @@ export const imageConfig = {
boxShadow: { value: '0px 0px 0px 0px #00000090' },
padding: { value: 'default' },
customPadding: { value: '{{0}}' },
alignment: { value: 'center' },
},
},
};