UNPKG

@pnp/spfx-controls-react

Version:

Reusable React controls for SharePoint Framework solutions

45 lines 2.94 kB
"use strict"; Object.defineProperty(exports, "__esModule", { value: true }); exports.useUploadFilesStyles = void 0; var tslib_1 = require("tslib"); var react_components_1 = require("@fluentui/react-components"); exports.useUploadFilesStyles = (0, react_components_1.makeStyles)({ baseStyle: tslib_1.__assign(tslib_1.__assign(tslib_1.__assign(tslib_1.__assign(tslib_1.__assign(tslib_1.__assign(tslib_1.__assign(tslib_1.__assign(tslib_1.__assign({}, react_components_1.shorthands.flex('auto')), { display: 'flex', flexDirection: 'column', alignItems: 'center' }), react_components_1.shorthands.padding('20px')), react_components_1.shorthands.borderWidth('2px')), react_components_1.shorthands.borderRadius('2px')), react_components_1.shorthands.borderColor(react_components_1.tokens.colorNeutralBackground5)), react_components_1.shorthands.borderStyle('dashed')), react_components_1.shorthands.outline('none')), { '&:hover': tslib_1.__assign(tslib_1.__assign({}, react_components_1.shorthands.borderColor(react_components_1.tokens.colorNeutralBackground3Pressed)), { cursor: 'pointer' }) }), dragContainer: tslib_1.__assign({ display: 'flex', flexDirection: 'column', alignItems: 'center', justifyContent: 'center' }, react_components_1.shorthands.gap('10px')), imagesContainer: tslib_1.__assign(tslib_1.__assign({ display: 'grid', maxHeight: '500px', gridTemplateColumns: 'repeat(auto-fill, minmax(min(100%,150px), 1fr))' }, react_components_1.shorthands.gap('10px')), { paddingTop: '15px', paddingBottom: '15px', overflowY: 'auto', scrollbarWidth: 'thin' }), itemBody: { display: 'flex', flexDirection: 'column', /* paddingBottom: "10px", */ }, headerTitle: tslib_1.__assign(tslib_1.__assign({ display: '-webkit-box', '-webkit-line-clamp': '1', '-webkit-box-orient': 'vertical' }, react_components_1.shorthands.overflow('hidden')), { breakWord: 'break-all', lineBreak: 'anywhere', textAlign: 'start', textOverflow: 'ellipsis' }), bottomContainer: { justifyContent: 'end', alignItems: 'center', display: 'flex', flexDirection: 'row', position: 'absolute', bottom: '15px', right: '5px', height: '20px', }, card: tslib_1.__assign({ height: '210px' }, react_components_1.shorthands.borderRadius('6px')), deleteStyle: { width: '16px', height: '16px', }, iconRefreshStyle: { width: '16px', height: '16px', }, selectedImage: tslib_1.__assign(tslib_1.__assign({}, react_components_1.shorthands.border('3px', 'solid', react_components_1.tokens.colorBrandBackground)), react_components_1.shorthands.padding('3px')), dragDropIconStyles: { width: '28px', height: '28px', color: react_components_1.tokens.colorBrandBackground, }, containerGlobalMarginTop: { marginTop: '10px', }, }); //# sourceMappingURL=useUploadFilesStyles.js.map