franken-ui
Version:
Franken UI is an HTML-first, open-source library of UI components based on the utility-first Tailwind CSS with UIkit 3 compatibility. The design is based on shadcn/ui ported to be framework-agnostic.
67 lines (66 loc) • 2.03 kB
JavaScript
import merge from 'lodash/merge.js';
export const rules = {
"[class*='uk-align']": { display: 'block', marginBottom: '30px' },
"* + [class*='uk-align']": { marginTop: '30px' },
'.uk-align-center': { marginLeft: 'auto', marginRight: 'auto' },
'.uk-align-left': { marginTop: '0', marginRight: '30px', cssFloat: 'left' },
'.uk-align-right': { marginTop: '0', marginLeft: '30px', cssFloat: 'right' }
};
export const media = {
'@media (min-width: 640px)': {
'.uk-align-left\\@s': {
marginTop: '0',
marginRight: '30px',
cssFloat: 'left'
},
'.uk-align-right\\@s': {
marginTop: '0',
marginLeft: '30px',
cssFloat: 'right'
}
},
'@media (min-width: 768px)': {
'.uk-align-left\\@m': {
marginTop: '0',
marginRight: '30px',
cssFloat: 'left'
},
'.uk-align-right\\@m': {
marginTop: '0',
marginLeft: '30px',
cssFloat: 'right'
}
},
'@media (min-width: 1024px)': {
'.uk-align-left\\@l': { marginTop: '0', cssFloat: 'left' },
'.uk-align-right\\@l': { marginTop: '0', cssFloat: 'right' },
'.uk-align-left,.uk-align-left\\@s,.uk-align-left\\@m,.uk-align-left\\@l': {
marginRight: '40px'
},
'.uk-align-right,.uk-align-right\\@s,.uk-align-right\\@m,.uk-align-right\\@l': {
marginLeft: '40px'
}
},
'@media (min-width: 1280px)': {
'.uk-align-left\\@xl': {
marginTop: '0',
marginRight: '40px',
cssFloat: 'left'
},
'.uk-align-right\\@xl': {
marginTop: '0',
marginLeft: '40px',
cssFloat: 'right'
}
}
};
export const addHooks = (args) => {
const { hooks } = args;
const defaultHooks = {
'hook-misc': {}
};
const _hooks = merge(defaultHooks, hooks);
return {
..._hooks['hook-misc']
};
};