@kubit-ui-web/react-components
Version:
Kubit React Components is a customizable, accessible library of React web components, designed to enhance your application's user experience
41 lines • 2.15 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.SKELETON_STYLES = void 0;
const borders_1 = require("../../foundations/borders");
const colors_1 = require("../../foundations/colors");
const variants_1 = require("./variants");
exports.SKELETON_STYLES = {
[variants_1.SkeletonShapeVariant.SQUARE]: {
[variants_1.SkeletonVariantType.DEFAULT]: {
skeleton: {
background_size: '200% 100%',
border_radius: borders_1.RADIUS.radius_50,
background: `linear-gradient(90deg, ${colors_1.COLORS.NEUTRAL.color_neutral_font_200} 0%, ${colors_1.COLORS.NEUTRAL.color_neutral_font_200}00 45%, ${colors_1.COLORS.NEUTRAL.color_neutral_font_200} 87%)`,
},
},
[variants_1.SkeletonVariantType.ALTERNATIVE]: {
skeleton: {
background_size: '200% 100%',
border_radius: borders_1.RADIUS.radius_50,
background: `linear-gradient(90deg, ${colors_1.COLORS.NEUTRAL.color_neutral_bg_200} 0%, ${colors_1.COLORS.NEUTRAL.color_neutral_bg_200}00 45%, ${colors_1.COLORS.NEUTRAL.color_neutral_bg_200} 87%)`,
},
},
},
[variants_1.SkeletonShapeVariant.CIRCLE]: {
[variants_1.SkeletonVariantType.DEFAULT]: {
skeleton: {
background_size: '200% 100%',
border_radius: borders_1.RADIUS.radius_circle,
background: `linear-gradient(90deg, ${colors_1.COLORS.NEUTRAL.color_neutral_font_200} 0%, ${colors_1.COLORS.NEUTRAL.color_neutral_font_200}00 45%, ${colors_1.COLORS.NEUTRAL.color_neutral_font_200} 87%)`,
},
},
[variants_1.SkeletonVariantType.ALTERNATIVE]: {
skeleton: {
background_size: '200% 100%',
border_radius: borders_1.RADIUS.radius_circle,
background: `linear-gradient(90deg, ${colors_1.COLORS.NEUTRAL.color_neutral_bg_200} 0%, ${colors_1.COLORS.NEUTRAL.color_neutral_bg_200}00 45%, ${colors_1.COLORS.NEUTRAL.color_neutral_bg_200} 87%)`,
},
},
},
};
//# sourceMappingURL=styles.js.map