
GusCSS
Retour aux projetsDescription
GusCSS is a lightweight and modular CSS framework designed to help developers quickly build modern, responsive user interfaces. Inspired by Bootstrap, it focuses on simplicity, customization, and ease of use. It includes essential components such as grids, buttons, modals, tabs, and more, making it ideal for both learning and smaller-scale projects.
Design
The framework follows a modular architecture: each component has its own SCSS file, making the codebase easier to maintain, extend, and understand. SCSS variables centralize customization options such as colors, spacing, and breakpoints. Mixins are used to dynamically generate utility classes for margins, padding, and columns.
The project was developed collaboratively in an educational context at Epitech, with special attention to documentation, component consistency, and accessibility. The goal was to build a robust yet accessible tool that beginners could adopt quickly and understand easily.
Features
The application includes the following features:
- Responsive grid: 12-column grid system with customizable breakpoints for adaptive layouts.
- Styled buttons: Multiple button variants (colors, sizes, disabled states) with hover effects.
- Modals: Accessible and customizable modal windows, controllable via JavaScript.
- Tabs: Interactive tab component for organizing content.
- Alerts: Color-coded alert messages, optionally dismissible.
- Visibility utilities: Classes to show/hide elements based on breakpoints or print mode.
- Images: Classes for responsive, rounded, circular, thumbnail, or blurred images.
- Badges: Visual indicators for notifications or statuses.
- Spinners: Animated loading indicators.
- Accordions: Expandable/collapsible content sections.
- Padding & Margin: SCSS utility classes to control spacing inside and around elements.