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

Commitd5e3b23

Browse files
committed
[Fix]: table header on different table sizes
1 parent9a900cc commitd5e3b23

File tree

3 files changed

+20
-1
lines changed

3 files changed

+20
-1
lines changed

‎client/packages/lowcoder/src/comps/comps/tableComp/tableCompView.tsx‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -376,6 +376,7 @@ export const TableCompView = React.memo((props: {
376376
$isVirtual={scrollConfig.virtual}
377377
$showHorizontalScrollbar={showHorizontalScrollbar}
378378
$showVerticalScrollbar={showVerticalScrollbar}
379+
$tableSize={sizeas'small'|'middle'|'large'}
379380
>
380381
<ResizeableTable<RecordType>
381382
expandable={{

‎client/packages/lowcoder/src/comps/comps/tableComp/tableStyles.ts‎

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -141,6 +141,7 @@ export const TableWrapper = styled.div.attrs<{
141141
$isVirtual?:boolean;
142142
$showHorizontalScrollbar?:boolean;
143143
$showVerticalScrollbar?:boolean;
144+
$tableSize?:"small"|"middle"|"large";
144145
}>`
145146
.ant-table-wrapper {
146147
border-top: unset;
@@ -207,6 +208,7 @@ export const TableWrapper = styled.div.attrs<{
207208
border-color:${(props)=>props.$headerStyle.border};
208209
border-width:${(props)=>props.$headerStyle.borderWidth};
209210
color:${(props)=>props.$headerStyle.headerText};
211+
padding: 0 !important; /* Override Ant Design's default padding */
210212
// border-inline-end:${(props)=>`${props.$headerStyle.borderWidth} solid${props.$headerStyle.border}`} !important;
211213
212214
/* Proper styling for fixed header cells */
@@ -223,6 +225,9 @@ export const TableWrapper = styled.div.attrs<{
223225
224226
> div {
225227
margin:${(props)=>props.$headerStyle.margin};
228+
/* Default padding for middle size (Ant Design default) */
229+
padding: 8px 8px;
230+
min-height: 24px;
226231
227232
&, .ant-table-column-title > div {
228233
font-size:${(props)=>props.$headerStyle.textSize};
@@ -231,6 +236,20 @@ export const TableWrapper = styled.div.attrs<{
231236
font-style:${(props)=>props.$headerStyle.fontStyle};
232237
color:${(props)=>props.$headerStyle.headerText}
233238
}
239+
240+
/* Adjust header size based on table size */
241+
${(props)=>props.$tableSize==='small'&&`
242+
padding: 1px 8px;
243+
min-height: 14px;
244+
`}
245+
${(props)=>props.$tableSize==='middle'&&`
246+
padding: 8px 8px;
247+
min-height: 24px;
248+
`}
249+
${(props)=>props.$tableSize==='large'&&`
250+
padding: 16px 16px;
251+
min-height: 48px;
252+
`}
234253
}
235254
236255
&:last-child {

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

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1771,7 +1771,6 @@ export const TableToolbarStyle = [
17711771

17721772
exportconstTableHeaderStyle=[
17731773
MARGIN,
1774-
PADDING,
17751774
FONT_FAMILY,
17761775
FONT_STYLE,
17771776
TEXT,

0 commit comments

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