Skip to content

Commit 285d086

Browse files
Tshepo1103-labTshepo1103-lab
committed
chore: applying styles to the anchor
1 parent affb968 commit 285d086

File tree

2 files changed

+37
-49
lines changed

2 files changed

+37
-49
lines changed

‎shesha-reactjs/src/designer-components/link/index.tsx‎

Lines changed: 22 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -64,14 +64,10 @@ const LinkComponent: IToolboxComponent<ILinkProps> = {
6464
font,
6565
} = model;
6666

67-
const align = font?.align || 'left';
6867
const fontStyles = useMemo(() => getFontStyle(font), [font]);
6968
const finalStyle = removeUndefinedProps({ ...fontStyles, ...getStyle(style, data) });
7069
// Create link container style with textAlign from fontStyles
71-
const linkStyle: CSSProperties = {
72-
display: 'block',
73-
textAlign: align,
74-
};
70+
const linkStyle: CSSProperties = {};
7571

7672
if (direction === 'horizontal' && justifyContent) {
7773
linkStyle['display'] = 'flex';
@@ -91,7 +87,7 @@ const LinkComponent: IToolboxComponent<ILinkProps> = {
9187

9288
if (!hasChildren) {
9389
return (
94-
<div style={{ ...linkStyle}}>
90+
<div style={{ ...linkStyle }}>
9591
<a href={href} target={target} className="sha-link" style={finalStyle}>
9692
{content}
9793
</a>
@@ -139,26 +135,27 @@ const LinkComponent: IToolboxComponent<ILinkProps> = {
139135

140136
return customProps;
141137
},
142-
migrator: (m) => m
143-
.add<ILinkProps>(0, (prev) => ({ ...prev } as ILinkProps))
144-
.add<ILinkProps>(1, (prev) => {
145-
return {
146-
...prev,
147-
label: prev.label ?? prev['name'],
148-
href: prev.content,
149-
content: prev['name'],
150-
};
151-
})
152-
.add<ILinkProps>(2, (prev) => migratePropertyName(migrateCustomFunctions(prev)))
153-
.add<ILinkProps>(3, (prev) => ({ ...migrateFormApi.properties(prev) }))
154-
.add<ILinkProps>(4, (prev) => {
155-
const styles: IInputStyles = {
156-
style: prev.style
157-
};
138+
migrator: (m) =>
139+
m
140+
.add<ILinkProps>(0, (prev) => ({ ...prev }) as ILinkProps)
141+
.add<ILinkProps>(1, (prev) => {
142+
return {
143+
...prev,
144+
label: prev.label ?? prev['name'],
145+
href: prev.content,
146+
content: prev['name'],
147+
};
148+
})
149+
.add<ILinkProps>(2, (prev) => migratePropertyName(migrateCustomFunctions(prev)))
150+
.add<ILinkProps>(3, (prev) => ({ ...migrateFormApi.properties(prev) }))
151+
.add<ILinkProps>(4, (prev) => {
152+
const styles: IInputStyles = {
153+
style: prev.style,
154+
};
158155

159-
return { ...prev, desktop: { ...styles }, tablet: { ...styles }, mobile: { ...styles } };
160-
})
161-
.add<ILinkProps>(5, (prev) => ({ ...migratePrevStyles(prev, defaultStyles()) }))
156+
return { ...prev, desktop: { ...styles }, tablet: { ...styles }, mobile: { ...styles } };
157+
})
158+
.add<ILinkProps>(5, (prev) => ({ ...migratePrevStyles(prev, defaultStyles()) })),
162159
};
163160

164161
export default LinkComponent;

‎shesha-reactjs/src/designer-components/link/settingsForm.ts‎

Lines changed: 15 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { DesignerToolbarSettings } from '@/interfaces/toolbarSettings';
2-
import { fontTypes, fontWeights, textAlign } from '../_settings/utils/font/utils';
2+
import { fontTypes, fontWeights } from '../_settings/utils/font/utils';
33
import { FormLayout } from 'antd/es/form/Form';
44

55
export const getSettings = (data: any) => {
@@ -255,15 +255,6 @@ export const getSettings = (data: any) => {
255255
hideLabel: true,
256256
propertyName: 'font.color',
257257
},
258-
{
259-
type: 'dropdown',
260-
id: 'fontAlign-s4gmBg31azZC0UjZjpfTm',
261-
label: 'Align',
262-
propertyName: 'font.align',
263-
hideLabel: true,
264-
width: 60,
265-
dropdownOptions: textAlign,
266-
},
267258
],
268259
})
269260
.toJson(),
@@ -298,11 +289,11 @@ export const getSettings = (data: any) => {
298289
value: 'center',
299290
},
300291
{
301-
label: 'Flex Start',
292+
label: 'Flex start',
302293
value: 'flex-start',
303294
},
304295
{
305-
label: 'Flex End',
296+
label: 'Flex end',
306297
value: 'flex-end',
307298
},
308299
{
@@ -314,15 +305,15 @@ export const getSettings = (data: any) => {
314305
value: 'right',
315306
},
316307
{
317-
label: 'Space Between',
308+
label: 'Space between',
318309
value: 'space-between',
319310
},
320311
{
321-
label: 'Space Around',
312+
label: 'Space around',
322313
value: 'space-around',
323314
},
324315
{
325-
label: 'Space Evenly',
316+
label: 'Space evenly',
326317
value: 'space-evenly',
327318
},
328319
{
@@ -352,11 +343,11 @@ export const getSettings = (data: any) => {
352343
value: 'end',
353344
},
354345
{
355-
label: 'Flex End',
346+
label: 'Flex end',
356347
value: 'flex-end',
357348
},
358349
{
359-
label: 'Flex Start',
350+
label: 'Flex start',
360351
value: 'flex-start',
361352
},
362353
{
@@ -376,11 +367,11 @@ export const getSettings = (data: any) => {
376367
value: 'revert',
377368
},
378369
{
379-
label: 'Self End',
370+
label: 'Self end',
380371
value: 'self-end',
381372
},
382373
{
383-
label: 'Self Start',
374+
label: 'Self start',
384375
value: 'self-start',
385376
},
386377
{
@@ -406,7 +397,7 @@ export const getSettings = (data: any) => {
406397
layout: 'horizontal',
407398
dropdownOptions: [
408399
{
409-
label: 'Baseline',
400+
label: 'baseline',
410401
value: 'baseline',
411402
},
412403
{
@@ -418,11 +409,11 @@ export const getSettings = (data: any) => {
418409
value: 'end',
419410
},
420411
{
421-
label: 'Flex End',
412+
label: 'Flex end',
422413
value: 'flex-end',
423414
},
424415
{
425-
label: 'Flex Start',
416+
label: 'Flex start',
426417
value: 'flex-start',
427418
},
428419
{
@@ -454,11 +445,11 @@ export const getSettings = (data: any) => {
454445
value: 'right',
455446
},
456447
{
457-
label: 'Self End',
448+
label: 'Self end',
458449
value: 'self-end',
459450
},
460451
{
461-
label: 'Self Start',
452+
label: 'Self start',
462453
value: 'self-start',
463454
},
464455
{

0 commit comments

Comments
 (0)