Merge pull request #3882 from czwe-01/thulasizwe/f/3711

Thulasizwe/f/3711

Author: James-Baloyi

shesha-reactjs/src/components/fileUpload/index.tsx

@@ -198,7 +198,7 @@ export const FileUpload: FC<IFileUploadProps> = ({
     return (
       <div>
         {showThumbnailControls && styledfileControls()}
-        <span title={file.name}>
+        <a title={file.name}>
           <Space>
             <div className="thumbnail-item-name">
               {(listType === 'text' || !hideFileName) && (
@@ -214,7 +214,7 @@ export const FileUpload: FC<IFileUploadProps> = ({
               {showTextControls && fileControls(theme.application.primaryColor)}
             </div>
           </Space>
-        </span>
+        </a>
       </div>
     );
   };

shesha-reactjs/src/components/fileUpload/styles/styles.ts

@@ -38,7 +38,7 @@ export const useStyles = createStyles(({ token, css, cx, prefixCls }, { style, m
     height,
     maxHeight,
     minHeight,
-    textAlign = 'center',
+    textAlign = 'left',
   } = style || {};
 
   const { layout, isDragger, hideFileName, listType } = model;
@@ -183,7 +183,8 @@ export const useStyles = createStyles(({ token, css, cx, prefixCls }, { style, m
       }
 
       .${prefixCls}-upload {
-        ${layout && !isDragger && 'width: var(--thumbnail-width) !important;'};
+
+        width: ${layout && !isDragger ? 'var(--thumbnail-width)' : '100%'} !important;
         ${layout && !isDragger && 'height: var(--thumbnail-height) !important'};
         border-radius: ${borderRadius} !important;
         align-items: center;
@@ -201,11 +202,10 @@ export const useStyles = createStyles(({ token, css, cx, prefixCls }, { style, m
 
       .ant-btn {
         color: ${primaryColor || token.colorPrimary} !important;
+        ${commonTextStyles}
         padding: 0;
         * {
-          font-size: ${fontSize} !important;
-          font-weight: ${fontWeight} !important;
-          font-family: ${fontFamily} !important;
+          ${commonTextStyles}
         }
         ${listType === 'thumbnail' && style}
         width: 100%;

shesha-reactjs/src/components/panel/styles/styles.ts

@@ -58,6 +58,9 @@ export const useStyles = createStyles(({ css, cx, token, prefixCls }, {
   const {
     backgroundImage: headerBgImage,
     backgroundColor: headerBgColor,
+    backgroundSize: headerBackgroundSize,
+    backgroundPosition: headerBackgroundPosition,
+    backgroundRepeat: headerBackgroundRepeat,
     height: headerHeight,
     minHeight: headerMinHeight,
     maxHeight: headerMaxHeight,
@@ -158,6 +161,9 @@ export const useStyles = createStyles(({ css, cx, token, prefixCls }, {
       visibility: ${hideCollapseContent ? 'hidden' : 'visible'};
       background: ${headerBgImage || headerBgColor};
       width: ${width};
+      background-size: ${headerBackgroundSize};
+      background-repeat: ${headerBackgroundRepeat};
+      background-position: ${headerBackgroundPosition};
       min-width: ${minWidth};
       max-width: ${maxWidth};
       height: ${headerHeight};

shesha-reactjs/src/designer-components/fileUpload/index.tsx

@@ -47,7 +47,7 @@ const FileUploadComponent: IToolboxComponent<IFileUploadProps> = {
   Factory: ({ model }) => {
     const { backendUrl } = useSheshaApplication();
 
-    const finalStyle = !model.enableStyleOnReadonly && model.readOnly ? {
+    const finalStyle = (!model.enableStyleOnReadonly && model.readOnly) || model.listType === 'text' ? {
       ...model.allStyles.fontStyles,
       ...model.allStyles.dimensionsStyles,
     } : model.allStyles.fullStyle;