Inspiración
BPL DS no surgió en el vacío. Muchas de sus decisiones de diseño — desde el sistema de capas hasta el naming de variables privadas — tienen raíces en trabajo previo de otras personas que pensaron profundamente sobre CSS. Esta página documenta esas deudas.
Kevin Powell — Full-Bleed Layout
Section titled “Kevin Powell — Full-Bleed Layout”El sistema de grid de BPL DS implementa la técnica Full-Bleed Layout introducida por Kevin Powell. La idea central — reemplazar los wrappers .container con líneas nombradas en CSS Grid para controlar cuánto puede crecer cada elemento — es directamente la suya.
La referencia original: Using grid instead of containers/wrappers en CodePen, y su artículo Centering content with no container.
El bp-content-grid con sus zonas content, popout, breakout, y full-width es una extensión directa de ese patrón.
Lea Verou → Giorgio Saud — Convención --_ para variables privadas
Section titled “Lea Verou → Giorgio Saud — Convención --_ para variables privadas”La convención de prefijo --_ para variables CSS privadas tiene una cadena de autoría documentada.
Lea Verou publicó en 2021 Custom properties with defaults: 3+1 strategies, donde describe el patrón de resolver una variable pública en una interna para evitar repetir el fallback en cada uso:
/* en lugar de repetir var(--accent, blue) en cada selector */--_accent: var(--accent, blue); /* una vez, en el root */Giorgio Saud tomó ese patrón, lo extendió y lo documentó como una arquitectura completa de componente CSS en Custom properties with defaults — combinándolo con @layer para la cascada, @property para tipos y animaciones, y clamp() para tipografía fluida. Esa arquitectura integrada es la que BPL DS adopta directamente.
/* pública — API del consumidor */--tabs-accent: var(--bp-primary);
/* privada — patrón de Lea Verou, documentado por Giorgio Saud */--_accent: var(--tabs-accent, var(--bp-primary));El patrón aparece en todos los componentes de BPL DS — cada --_* en cada archivo CSS es una instancia directa de esta idea.
La comunidad CSS — Estándares sobre abstracciones
Section titled “La comunidad CSS — Estándares sobre abstracciones”BPL DS es en parte una apuesta por los estándares web sobre las abstracciones de framework. Esa filosofía no es original — existe en el trabajo de muchas personas:
- Lea Verou — años de trabajo en CSS custom properties,
@property, y la idea de que CSS puede ser un lenguaje de programación completo. Su investigación sobre defaults de custom properties es la base directa de la arquitectura de componentes del DS. - Adam Argyle — arquitectura de
@layery cómo resolver la cascada sin !important. Ver su artículo Cascade Layers en Chrome Developers. - Miriam Suzanne — especificación y educación sobre
@layery@scope. Ver CSS Cascade 5 y su trabajo en Open Props. - Šime Vidas — Baseline, el estándar de interoperabilidad que usamos para documentar el soporte de cada API. Ver Web Platform News.
Inspiración directa en diseño
Section titled “Inspiración directa en diseño”El sistema de tokens — colores, espacio, tipografía, sombras — sigue los principios de los sistemas de diseño abiertos más influyentes: Primer (GitHub), Spectrum (Adobe), y Radix Colors. No hay tokens copiados, pero sí decisiones de estructura y nomenclatura informadas por esas referencias.
Si encontrás en BPL DS una idea que viene de otro lugar y no está documentada aquí, abrí un issue para que lo podamos agregar.