mirror of
https://github.com/primefaces/primevue.git
synced 2025-05-09 00:42:36 +00:00
Fixed #4530 - Export styles of all components
This commit is contained in:
parent
7b6d458067
commit
dc2913e887
463 changed files with 10696 additions and 9670 deletions
96
components/lib/divider/style/DividerStyle.js
Normal file
96
components/lib/divider/style/DividerStyle.js
Normal file
|
@ -0,0 +1,96 @@
|
|||
import BaseStyle from 'primevue/base/style';
|
||||
|
||||
const css = `
|
||||
@layer primevue {
|
||||
.p-divider-horizontal {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
position: relative;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.p-divider-horizontal:before {
|
||||
position: absolute;
|
||||
display: block;
|
||||
top: 50%;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
content: '';
|
||||
}
|
||||
|
||||
.p-divider-content {
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.p-divider-vertical {
|
||||
min-height: 100%;
|
||||
margin: 0 1rem;
|
||||
display: flex;
|
||||
position: relative;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.p-divider-vertical:before {
|
||||
position: absolute;
|
||||
display: block;
|
||||
top: 0;
|
||||
left: 50%;
|
||||
height: 100%;
|
||||
content: '';
|
||||
}
|
||||
|
||||
.p-divider-solid.p-divider-horizontal:before {
|
||||
border-top-style: solid;
|
||||
}
|
||||
|
||||
.p-divider-solid.p-divider-vertical:before {
|
||||
border-left-style: solid;
|
||||
}
|
||||
|
||||
.p-divider-dashed.p-divider-horizontal:before {
|
||||
border-top-style: dashed;
|
||||
}
|
||||
|
||||
.p-divider-dashed.p-divider-vertical:before {
|
||||
border-left-style: dashed;
|
||||
}
|
||||
|
||||
.p-divider-dotted.p-divider-horizontal:before {
|
||||
border-top-style: dotted;
|
||||
}
|
||||
|
||||
.p-divider-dotted.p-divider-vertical:before {
|
||||
border-left-style: dotted;
|
||||
}
|
||||
}
|
||||
`;
|
||||
|
||||
/* Position */
|
||||
const inlineStyles = {
|
||||
root: ({ props }) => ({
|
||||
justifyContent: props.layout === 'horizontal' ? (props.align === 'center' || props.align === null ? 'center' : props.align === 'left' ? 'flex-start' : props.align === 'right' ? 'flex-end' : null) : null,
|
||||
alignItems: props.layout === 'vertical' ? (props.align === 'center' || props.align === null ? 'center' : props.align === 'top' ? 'flex-start' : props.align === 'bottom' ? 'flex-end' : null) : null
|
||||
})
|
||||
};
|
||||
|
||||
const classes = {
|
||||
root: ({ props }) => [
|
||||
'p-divider p-component',
|
||||
'p-divider-' + props.layout,
|
||||
'p-divider-' + props.type,
|
||||
{ 'p-divider-left': props.layout === 'horizontal' && (!props.align || props.align === 'left') },
|
||||
{ 'p-divider-center': props.layout === 'horizontal' && props.align === 'center' },
|
||||
{ 'p-divider-right': props.layout === 'horizontal' && props.align === 'right' },
|
||||
{ 'p-divider-top': props.layout === 'vertical' && props.align === 'top' },
|
||||
{ 'p-divider-center': props.layout === 'vertical' && (!props.align || props.align === 'center') },
|
||||
{ 'p-divider-bottom': props.layout === 'vertical' && props.align === 'bottom' }
|
||||
],
|
||||
content: 'p-divider-content'
|
||||
};
|
||||
|
||||
export default BaseStyle.extend({
|
||||
name: 'divider',
|
||||
css,
|
||||
classes,
|
||||
inlineStyles
|
||||
});
|
Loading…
Add table
Add a link
Reference in a new issue