Movatterモバイル変換

[0]ホーム
URL:

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

Commitc459d56

Browse files
Timeline: added gradient
1 parent9c11938 commitc459d56

File tree

2 files changed

+22
-13
lines changed

2 files changed

+22
-13
lines changed

‎client/packages/lowcoder/src/comps/comps/timelineComp/timelineComp.tsx

Lines changed: 21 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -36,6 +36,7 @@ import {
3636
heightCalculator,
3737
widthCalculator,
3838
marginCalculator,
39+
TimeLineStyleType,
3940
}from"comps/controls/styleControlConstants";
4041
import{stateComp,valueComp}from"comps/generators/simpleGenerators";
4142
import{
@@ -47,6 +48,24 @@ import { timelineDate, timelineNode, TimelineDataTooltip } from "./timelineConst
4748
import{convertTimeLineData}from"./timelineUtils";
4849
import{defaultasTimeline}from"antd/es/timeline";
4950
import{EditorContext}from"comps/editorState";
51+
import{styled}from"styled-components";
52+
53+
constTimelineWrapper=styled.div<{
54+
$style:TimeLineStyleType
55+
}>`
56+
${props=>`margin:${props.$style.margin??'3px'}`};
57+
${props=>`padding:${props.$style.padding!=='3px' ?props.$style.padding :'20px 10px 0px 10px'}`};
58+
${props=>`width:${widthCalculator(props.$style.margin??'3px')}`};
59+
${props=>`height:${heightCalculator(props.$style.margin??'3px')}`};
60+
${props=>`background:${props.$style.background}`};
61+
${props=>`border-radius:${props.$style.radius}`};
62+
overflow: auto;
63+
overflow-x: hidden;
64+
65+
.ant-timeline .ant-timeline-item-head {
66+
background-color: transparent;
67+
}
68+
`;
5069

5170
constEventOptions=[
5271
clickEvent,
@@ -139,18 +158,7 @@ const TimelineComp = (
139158

140159
return(
141160
<ScrollBarhideScrollbar={!props.verticalScrollbar}>
142-
<div
143-
style={{
144-
margin:style.margin??'3px',
145-
padding:style.padding!=='3px' ?style.padding :'20px 10px 0px 10px',
146-
width:widthCalculator(style.margin??'3px'),
147-
height:heightCalculator(style.margin??'3px'),
148-
background:style.background,
149-
overflow:"auto",
150-
overflowX:"hidden",
151-
borderRadius:style.radius,
152-
}}
153-
>
161+
<TimelineWrapper$style={style}>
154162
<Timeline
155163
mode={props?.mode||"left"}
156164
reverse={props?.reverse}
@@ -163,7 +171,7 @@ const TimelineComp = (
163171
}
164172
items={timelineItems}
165173
/>
166-
</div>
174+
</TimelineWrapper>
167175
</ScrollBar>
168176
);
169177
};

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

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1986,6 +1986,7 @@ export const RichTextEditorStyle = [
19861986
]asconst;
19871987

19881988
exporttypeQRCodeStyleType=StyleConfigType<typeofQRCodeStyle>;
1989+
exporttypeTimeLineStyleType=StyleConfigType<typeofTimeLineStyle>;
19891990
exporttypeAvatarStyleType=StyleConfigType<typeofAvatarStyle>;
19901991
exporttypeAvatarLabelStyleType=StyleConfigType<typeofavatarLabelStyle>;
19911992
exporttypeAvatarContainerStyleType=StyleConfigType<

0 commit comments

Comments
 (0)
[8]ページ先頭
©2009-2025 Movatter.jp