Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Sign up
Appearance settings

Commit 3159fc0

Browse files
Add line Height in Said Components
1 parent caa36ff commit 3159fc0

File tree

3 files changed

+44
-8
lines changed

3 files changed

+44
-8
lines changed

‎client/packages/lowcoder/src/api/commonSettingApi.ts

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -62,6 +62,7 @@ export interface ThemeDetail {
6262
animationDuration?: string;
6363
opacity?: string;
6464
boxShadow?: string;
65+
lineHeight?: string;
6566
boxShadowColor?: string;
6667
animationIterationCount?: string;
6768
components?: Record<string, JSONObject>;
@@ -83,6 +84,7 @@ export function getThemeDetailName(key: keyof ThemeDetail) {
8384
case "padding": return trans("style.padding");
8485
case "gridColumns": return trans("themeDetail.gridColumns");
8586
case "textSize": return trans("style.textSize");
87+
case "lineHeight": return trans("themeDetail.lineHeight");
8688
}
8789
return "";
8890
}
@@ -105,6 +107,7 @@ export function isThemeColorKey(key: string) {
105107
case "padding":
106108
case "gridColumns":
107109
case "textSize":
110+
case "lineHeight":
108111
return true;
109112
}
110113
return false;

‎client/packages/lowcoder/src/comps/comps/selectInputComp/checkboxComp.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -150,7 +150,7 @@ let CheckboxBasicComp = (function () {
150150
options: SelectInputOptionControl,
151151
style: styleControl(InputFieldStyle , 'style'),
152152
labelStyle: styleControl(
153-
LabelStyle.filter((style) => ['accent', 'validate'].includes(style.name) === false),
153+
LabelStyle.filter((style) => ['accent', 'validate','lineheight'].includes(style.name) === false),
154154
'labelStyle',
155155
),
156156
layout: dropdownControl(RadioLayoutOptions, "horizontal"),

‎client/packages/lowcoder/src/comps/controls/styleControlConstants.tsx

Lines changed: 40 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,11 @@ export type SimpleColorConfig = CommonColorConfig & {
1616
readonly color: string;
1717
};
1818

19+
export type LineHeightConfig = CommonColorConfig & {
20+
readonly lineHeight: string; // Define the lineHeight property
21+
};
22+
23+
1924
export type RadiusConfig = CommonColorConfig & {
2025
readonly radius: string;
2126
};
@@ -224,7 +229,10 @@ export type SingleColorConfig =
224229
| OpacityConfig
225230
| BoxShadowConfig
226231
| BoxShadowColorConfig
227-
| AnimationIterationCountConfig;
232+
| AnimationIterationCountConfig
233+
| LineHeightConfig
234+
235+
228236

229237
export const SURFACE_COLOR = "#FFFFFF";
230238
const SECOND_SURFACE_COLOR = "#D7D9E0";
@@ -368,6 +376,24 @@ export function handleToCalendarToday(color: string) {
368376
return "#0000000c";
369377
}
370378
}
379+
export function getLineHeightValue(theme: ThemeDetail, value: string | number) {
380+
if (typeof value === 'number') {
381+
return `${value}px`;
382+
} else if (value === 'inherit') {
383+
return 'inherit';
384+
} else if (value === 'initial') {
385+
return 'initial';
386+
} else if (value === 'unset') {
387+
return 'unset';
388+
} else {
389+
const lineHeightValue = theme.lineHeight;
390+
if (lineHeightValue) {
391+
return lineHeightValue;
392+
} else {
393+
return '1.5'; // default line height value
394+
}
395+
}
396+
}
371397

372398
// return calendar text
373399
function handleCalendarText(
@@ -516,6 +542,12 @@ const BACKGROUND_IMAGE_ORIGIN = {
516542
backgroundImageOrigin: "backgroundImageOrigin",
517543
} as const;
518544

545+
const LINE_HEIGHT = {
546+
name: "lineHeight",
547+
label: trans("style.lineHeight"),
548+
lineHeight: "lineHeight",
549+
} as const;
550+
519551
const MARGIN = {
520552
name: "margin",
521553
label: trans("style.margin"),
@@ -645,6 +677,7 @@ const STYLING_FIELDS_SEQUENCE = [
645677
RADIUS,
646678
BORDER_WIDTH,
647679
ROTATION,
680+
LINE_HEIGHT
648681
];
649682

650683
const STYLING_FIELDS_CONTAINER_SEQUENCE = [
@@ -658,6 +691,7 @@ const STYLING_FIELDS_CONTAINER_SEQUENCE = [
658691
BOXSHADOW,
659692
BOXSHADOWCOLOR,
660693
ROTATION,
694+
LINE_HEIGHT
661695
];
662696

663697
export const AnimationStyle = [
@@ -1116,10 +1150,9 @@ export const LabelStyle = [
11161150
export const InputFieldStyle = [
11171151
getBackground(),
11181152
getStaticBorder(),
1119-
...STYLING_FIELDS_CONTAINER_SEQUENCE.filter(
1120-
(style) =>["border"].includes(style.name)===false
1153+
...STYLING_FIELDS_CONTAINER_SEQUENCE.filter(
1154+
(style) =>!["border","lineHeight"].includes(style.name)
11211155
),
1122-
// ...STYLING_FIELDS_CONTAINER_SEQUENCE,
11231156
] as const;
11241157

11251158
export const SignatureContainerStyle = [
@@ -1291,7 +1324,7 @@ function checkAndUncheck() {
12911324
}
12921325

12931326
export const CheckboxStyle = [
1294-
...replaceAndMergeMultipleStyles(STYLING_FIELDS_SEQUENCE.filter(styles=>styles.name!=='rotation'),"text", [
1327+
...replaceAndMergeMultipleStyles(STYLING_FIELDS_SEQUENCE.filter(styles=>styles.name!=='rotation'&&styles.name!=='lineHeight'),"text", [
12951328
STATIC_TEXT,
12961329
VALIDATE,
12971330
]).filter((style) => style.name !== "border"),
@@ -1309,7 +1342,7 @@ export const CheckboxStyle = [
13091342
] as const;
13101343

13111344
export const RadioStyle = [
1312-
...replaceAndMergeMultipleStyles(STYLING_FIELDS_SEQUENCE.filter(style=>style.name!=='rotation'), "text", [
1345+
...replaceAndMergeMultipleStyles(STYLING_FIELDS_SEQUENCE.filter(style=>style.name!=='rotation'&&style.name!=='lineHeight'), "text", [
13131346
STATIC_TEXT,
13141347
VALIDATE,
13151348
]).filter((style) => style.name !== "border" && style.name !== "radius"),
@@ -1554,7 +1587,7 @@ export const IframeStyle = [
15541587
BORDER_WIDTH,
15551588
MARGIN,
15561589
PADDING,
1557-
ROTATION
1590+
ROTATION,
15581591
] as const;
15591592

15601593
export const CustomStyle = [

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /