A modular CSS grid system built with Lost and BEM methodology for flexible, responsive layouts.
Sharps is a modular CSS grid system that uses Lost and BEM methodology to create responsive and maintainable layouts. It solves the problem of building flexible grids with customizable columns, gutters, and alignment options, streamlining frontend development.
Frontend developers and teams using BEM methodology who need a structured, responsive grid system integrated into PostCSS or ENB-based build processes.
Developers choose Sharps for its seamless integration with BEM and build tools like PostCSS and ENB, offering a modular and configurable grid solution without the bloat of larger frameworks.
Modular grid powered by Lost and BEM
Open-Awesome is built by the community, for the community. Submit a project, suggest an awesome list, or help improve the catalog on GitHub.
Leverages BEM class naming conventions for maintainable and scalable CSS, as shown in the README with 'row__col' elements and modifiers like 'row__col_mw_6'.
Supports responsive design with modifiers for multiple screen sizes (s, m, l, xl, xxl), enabling precise layout adjustments at different breakpoints.
Allows configuration of columns, max width, gutter, and flex settings via PostCSS or ENB, providing flexibility to tailor grids to project needs.
Available as a standalone CSS file, PostCSS plugin, or ENB module, making it adaptable to various frontend workflows and build processes.
Requires integration with PostCSS or ENB for full customization, adding setup complexity and limiting use in projects without these tools.
Tightly coupled to BEM methodology, making it less suitable for teams using other CSS conventions like SMACSS or utility-first approaches.
The README notes potential conflicts in ENB setup that require manual adjustments, indicating a steeper learning curve for proper configuration.