Elgato_dark/ToolJet
1
0
Fork 0
mirror of https://github.com/ToolJet/ToolJet synced 2026-05-06 06:48:21 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 4

Added background color property for image widget(#2022)

Browse source
This commit is contained in:
Muhsin Shah C P 2022-01-31 14:10:17 +05:30 committed by GitHub
parent 1ab0e36ec9
commit 8f2ab3f269
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 3 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

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

@ -3,7 +3,7 @@ import LazyLoad from 'react-lazyload';
export const Image = function Image({ height, properties, styles, fireEvent }) {
const { source } = properties;
const { visibility, disabledState, borderType } = styles;
const { visibility, disabledState, borderType, backgroundColor } = styles;
const widgetVisibility = visibility ?? true;
const imageRef = useRef(null);
const [imageOffset, setImageOffset] = useState(0);
@ -37,6 +37,7 @@ export const Image = function Image({ height, properties, styles, fireEvent }) {
<img
src={source}
className={`${borderType !== 'none' ? borderType : ''}`}
style={{ backgroundColor }}
height={height}
onClick={() => fireEvent('onClick')}
/>

1
frontend/src/Editor/Components/components.js
View file

@ -797,6 +797,7 @@ export const componentTypes = [
{ name: 'Thumbnail', value: 'img-thumbnail' },
],
},
backgroundColor: { type: 'color', displayName: 'Background color' },
visibility: { type: 'code', displayName: 'Visibility' },
disabledState: { type: 'code', displayName: 'Disable' },
},