✨(component): [line]: 新增 margin 属性,控制分割线边距
This commit is contained in:
@@ -66,12 +66,6 @@
|
||||
margin-left: 15px;
|
||||
}
|
||||
|
||||
.layui-dropdown-content .layui-line-horizontal,
|
||||
.layui-dropdown .layui-line-horizontal{
|
||||
margin: 0px;
|
||||
border-color: #EEEEEE;
|
||||
}
|
||||
|
||||
.layui-dropdown-content .layui-menu li.layui-disabled:hover {
|
||||
background-color: inherit;
|
||||
}
|
||||
|
||||
@@ -5,7 +5,7 @@
|
||||
width: 100%;
|
||||
min-width: 100%;
|
||||
max-width: 100%;
|
||||
margin: 10px 0;
|
||||
margin: var(--layui-line-margin) 0;
|
||||
border-bottom: var(--layui-line-border-width) var(--layui-line-border-style) var(--global-neutral-color-5);
|
||||
border-top-style: none;
|
||||
border-left-style: none;
|
||||
@@ -21,7 +21,7 @@
|
||||
min-width: 1px;
|
||||
max-width: 1px;
|
||||
height: 1em;
|
||||
margin: 0 8px;
|
||||
margin: 0 var(--layui-line-margin);
|
||||
vertical-align: middle;
|
||||
border-left: var(--layui-line-border-width) var(--layui-line-border-style) var(--global-neutral-color-5);
|
||||
border-top-style: none;
|
||||
|
||||
@@ -14,6 +14,7 @@ export interface LayLineProps {
|
||||
borderStyle?: string;
|
||||
offset?: string;
|
||||
theme?: string;
|
||||
margin?: string;
|
||||
}
|
||||
|
||||
const props = withDefaults(defineProps<LayLineProps>(), {
|
||||
@@ -22,6 +23,7 @@ const props = withDefaults(defineProps<LayLineProps>(), {
|
||||
borderWidth: "1px",
|
||||
borderStyle: "solid",
|
||||
offset: "25px",
|
||||
margin: "8px",
|
||||
});
|
||||
|
||||
const slots = useSlots();
|
||||
@@ -34,20 +36,21 @@ const lineTheme: string[] = [
|
||||
"black",
|
||||
"gray",
|
||||
];
|
||||
const isSupportedTheme: boolean = lineTheme.includes(props.theme ?? "");
|
||||
const isBuiltInColor: boolean = lineTheme.includes(props.theme ?? "");
|
||||
|
||||
const lineClass = computed(() => [
|
||||
`layui-line-${props.direction}`,
|
||||
{
|
||||
[`layui-border-${props.theme}`]: isSupportedTheme,
|
||||
[`layui-border-${props.theme}`]: isBuiltInColor,
|
||||
[`layui-line-with-text`]: Boolean(slots.default),
|
||||
},
|
||||
]);
|
||||
|
||||
const lineStyle = computed(() => ({
|
||||
"border-color": !isSupportedTheme ? props.theme : undefined,
|
||||
"border-color": !isBuiltInColor ? props.theme : undefined,
|
||||
"--layui-line-border-width": props.borderWidth,
|
||||
"--layui-line-border-style": props.borderStyle,
|
||||
"--layui-line-margin": props.margin,
|
||||
}));
|
||||
|
||||
const lineTextStyle = computed(() => ({
|
||||
|
||||
Reference in New Issue
Block a user