breakouts 0.1.1 → 0.1.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (14) hide show
  1. package/dist/breakouts.css +9 -9
  2. package/dist/breakouts.css.map +1 -1
  3. package/dist/breakouts.min.css +1 -1
  4. package/dist/breakouts.min.css.map +1 -1
  5. package/package.json +1 -1
  6. package/src/_index.scss +1 -6
  7. package/src/base/_colors.scss +1 -1
  8. package/src/{layout/_grid.scss → base/_layout.scss} +17 -0
  9. package/src/theme/_chupa-pop.scss +4 -7
  10. package/src/theme/_medical.scss +6 -9
  11. package/src/theme/_tootsie-pop.scss +6 -9
  12. package/src/layout/_breakouts.scss +0 -4
  13. package/src/layout/_container.scss +0 -5
  14. package/src/layout/_full-bleed.scss +0 -5
package/dist/breakouts.css CHANGED
@@ -50,7 +50,7 @@
50
50
  --color-accent: #c60055;
51
51
  }
52
52
  }
53
- .bg-background {
53
+ .background {
54
54
  background-color: var(--color-background);
55
55
  }
56
56
 
@@ -650,6 +650,14 @@ a:hover {
650
650
  line-height: 2;
651
651
  }
652
652
 
653
+ :root {
654
+ --gap: clamp(1rem, 6vw, 3rem);
655
+ --full: minmax(var(--gap), 1fr);
656
+ --feature: minmax(0, 5rem);
657
+ --popout: minmax(0, 2rem);
658
+ --content: min(50ch, 100% - var(--gap) * 2);
659
+ }
660
+
653
661
  .container {
654
662
  margin-inline: auto;
655
663
  max-width: 72rem;
@@ -667,14 +675,6 @@ a:hover {
667
675
  margin-left: calc(-1 * (100vw - 100%) / 2);
668
676
  }
669
677
 
670
- :root {
671
- --gap: clamp(1rem, 6vw, 3rem);
672
- --full: minmax(var(--gap), 1fr);
673
- --feature: minmax(0, 5rem);
674
- --popout: minmax(0, 2rem);
675
- --content: min(50ch, 100% - var(--gap) * 2);
676
- }
677
-
678
678
  .breakouts-grid {
679
679
  display: grid;
680
680
  grid-template-columns: [full-start] var(--full) [feature-start] var(--feature) [popout-start] var(--popout) [content-start] var(--content) [content-end] var(--popout) [popout-end] var(--feature) [feature-end] var(--full) [full-end];
package/dist/breakouts.css.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sourceRoot":"","sources":["../src/base/_colors.scss","../src/base/_reset.scss","../src/base/_spacing.scss","../src/base/_typography.scss","../src/layout/_container.scss","../src/layout/_full-bleed.scss","../src/layout/_breakouts.scss","../src/layout/_grid.scss"],"names":[],"mappings":"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","file":"breakouts.css"}
1
+ {"version":3,"sourceRoot":"","sources":["../src/base/_colors.scss","../src/base/_reset.scss","../src/base/_spacing.scss","../src/base/_typography.scss","../src/base/_layout.scss"],"names":[],"mappings":"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","file":"breakouts.css"}
package/dist/breakouts.min.css CHANGED
@@ -1 +1 @@
1
- :root{--color-background: #ffffff;--color-surface: #f0f0f0;--color-text: #111111;--color-muted: #666666;--color-primary: #0055ff;--color-secondary: #0033aa;--color-accent: #ff4081;--color-neutral-100: #f8f9fa;--color-neutral-200: #e9ecef;--color-neutral-300: #dee2e6;--color-neutral-400: #ced4da;--color-neutral-500: #adb5bd;--color-neutral-600: #6c757d;--color-neutral-700: #495057;--color-neutral-800: #343a40;--color-neutral-900: #212529}.dark,.dark :root{--color-background: #111111;--color-surface: #1a1a1a;--color-text: #eeeeee;--color-muted: #aaaaaa;--color-primary: #0033aa;--color-secondary: #002277;--color-accent: #c60055}.light,.light :root{--color-background: #ffffff;--color-surface: #f8f8f8;--color-text: #222222;--color-muted: #999999;--color-primary: #88b0ff;--color-secondary: #ccd9ff;--color-accent: #ff80ab}@media(prefers-color-scheme: dark){:root:not(.light):not(.dark){--color-background: #111111;--color-surface: #1a1a1a;--color-text: #eeeeee;--color-muted: #aaaaaa;--color-primary: #0033aa;--color-secondary: #002277;--color-accent: #c60055}}.bg-background{background-color:var(--color-background)}.bg-surface{background-color:var(--color-surface)}.bg-primary{background-color:var(--color-primary)}.bg-secondary{background-color:var(--color-secondary)}.bg-accent{background-color:var(--color-accent)}.text-text{color:var(--color-text)}.text-background{color:var(--color-background)}.text-muted{color:var(--color-muted)}*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}html,body{margin:0;padding:0;width:100%;overflow-x:hidden}body{padding:2rem;font-family:system-ui,sans-serif;line-height:1.6}.m-0{margin:0}.mt-0{margin-top:0}.mr-0{margin-right:0}.mb-0{margin-bottom:0}.ml-0{margin-left:0}.mx-0{margin-left:0;margin-right:0}.my-0{margin-top:0;margin-bottom:0}.p-0{padding:0}.pt-0{padding-top:0}.pr-0{padding-right:0}.pb-0{padding-bottom:0}.pl-0{padding-left:0}.px-0{padding-left:0;padding-right:0}.py-0{padding-top:0;padding-bottom:0}.m-1{margin:.25rem}.mt-1{margin-top:.25rem}.mr-1{margin-right:.25rem}.mb-1{margin-bottom:.25rem}.ml-1{margin-left:.25rem}.mx-1{margin-left:.25rem;margin-right:.25rem}.my-1{margin-top:.25rem;margin-bottom:.25rem}.p-1{padding:.25rem}.pt-1{padding-top:.25rem}.pr-1{padding-right:.25rem}.pb-1{padding-bottom:.25rem}.pl-1{padding-left:.25rem}.px-1{padding-left:.25rem;padding-right:.25rem}.py-1{padding-top:.25rem;padding-bottom:.25rem}.m-2{margin:.5rem}.mt-2{margin-top:.5rem}.mr-2{margin-right:.5rem}.mb-2{margin-bottom:.5rem}.ml-2{margin-left:.5rem}.mx-2{margin-left:.5rem;margin-right:.5rem}.my-2{margin-top:.5rem;margin-bottom:.5rem}.p-2{padding:.5rem}.pt-2{padding-top:.5rem}.pr-2{padding-right:.5rem}.pb-2{padding-bottom:.5rem}.pl-2{padding-left:.5rem}.px-2{padding-left:.5rem;padding-right:.5rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.m-3{margin:.75rem}.mt-3{margin-top:.75rem}.mr-3{margin-right:.75rem}.mb-3{margin-bottom:.75rem}.ml-3{margin-left:.75rem}.mx-3{margin-left:.75rem;margin-right:.75rem}.my-3{margin-top:.75rem;margin-bottom:.75rem}.p-3{padding:.75rem}.pt-3{padding-top:.75rem}.pr-3{padding-right:.75rem}.pb-3{padding-bottom:.75rem}.pl-3{padding-left:.75rem}.px-3{padding-left:.75rem;padding-right:.75rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}.m-4{margin:1rem}.mt-4{margin-top:1rem}.mr-4{margin-right:1rem}.mb-4{margin-bottom:1rem}.ml-4{margin-left:1rem}.mx-4{margin-left:1rem;margin-right:1rem}.my-4{margin-top:1rem;margin-bottom:1rem}.p-4{padding:1rem}.pt-4{padding-top:1rem}.pr-4{padding-right:1rem}.pb-4{padding-bottom:1rem}.pl-4{padding-left:1rem}.px-4{padding-left:1rem;padding-right:1rem}.py-4{padding-top:1rem;padding-bottom:1rem}.m-5{margin:1.25rem}.mt-5{margin-top:1.25rem}.mr-5{margin-right:1.25rem}.mb-5{margin-bottom:1.25rem}.ml-5{margin-left:1.25rem}.mx-5{margin-left:1.25rem;margin-right:1.25rem}.my-5{margin-top:1.25rem;margin-bottom:1.25rem}.p-5{padding:1.25rem}.pt-5{padding-top:1.25rem}.pr-5{padding-right:1.25rem}.pb-5{padding-bottom:1.25rem}.pl-5{padding-left:1.25rem}.px-5{padding-left:1.25rem;padding-right:1.25rem}.py-5{padding-top:1.25rem;padding-bottom:1.25rem}.m-6{margin:1.5rem}.mt-6{margin-top:1.5rem}.mr-6{margin-right:1.5rem}.mb-6{margin-bottom:1.5rem}.ml-6{margin-left:1.5rem}.mx-6{margin-left:1.5rem;margin-right:1.5rem}.my-6{margin-top:1.5rem;margin-bottom:1.5rem}.p-6{padding:1.5rem}.pt-6{padding-top:1.5rem}.pr-6{padding-right:1.5rem}.pb-6{padding-bottom:1.5rem}.pl-6{padding-left:1.5rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}.py-6{padding-top:1.5rem;padding-bottom:1.5rem}body{font-family:system-ui,sans-serif;font-size:1rem;line-height:1.6;color:var(--color-text);background-color:var(--color-background);margin:0}h1{font-size:2.25rem;line-height:1.2;margin:2rem 0 1rem;font-weight:600;color:var(--color-text)}h2{font-size:1.75rem;line-height:1.2;margin:2rem 0 1rem;font-weight:600;color:var(--color-text)}h3{font-size:1.5rem;line-height:1.2;margin:2rem 0 1rem;font-weight:600;color:var(--color-text)}h4{font-size:1.25rem;line-height:1.2;margin:2rem 0 1rem;font-weight:600;color:var(--color-text)}h5{font-size:1.125rem;line-height:1.2;margin:2rem 0 1rem;font-weight:600;color:var(--color-text)}h6{font-size:1rem;line-height:1.2;margin:2rem 0 1rem;font-weight:600;color:var(--color-text)}p{margin:1rem 0}a{color:var(--color-primary);text-decoration:underline}a:hover{color:var(--color-secondary)}.text-left{text-align:left}.text-center{text-align:center}.text-right{text-align:right}.text-justify{text-align:justify}.text-uppercase{text-transform:uppercase}.text-lowercase{text-transform:lowercase}.text-capitalize{text-transform:capitalize}.font-bold{font-weight:bold}.font-normal{font-weight:normal}.italic{font-style:italic}.not-italic{font-style:normal}.leading-tight{line-height:1.25}.leading-normal{line-height:1.5}.leading-loose{line-height:2}.container{margin-inline:auto;max-width:72rem;padding-inline:1rem}.full-bleed{width:100vw;margin-left:50%;transform:translateX(-50%)}.breakout{width:100vw;margin-left:calc(-1*(100vw - 100%)/2)}:root{--gap: clamp(1rem, 6vw, 3rem);--full: minmax(var(--gap), 1fr);--feature: minmax(0, 5rem);--popout: minmax(0, 2rem);--content: min(50ch, 100% - var(--gap) * 2)}.breakouts-grid{display:grid;grid-template-columns:[full-start] var(--full) [feature-start] var(--feature) [popout-start] var(--popout) [content-start] var(--content) [content-end] var(--popout) [popout-end] var(--feature) [feature-end] var(--full) [full-end];gap:var(--gap)}.content{grid-column:content}.popout{grid-column:popout}.feature{grid-column:feature}.full{grid-column:full}.grid{display:grid;grid-template-columns:1fr minmax(0, var(--container-max-width, 64rem)) 1fr;gap:var(--gap)}.grid>*{grid-column:2}.grid--full>*{grid-column:1/-1}/*# sourceMappingURL=breakouts.min.css.map */
1
+ :root{--color-background: #ffffff;--color-surface: #f0f0f0;--color-text: #111111;--color-muted: #666666;--color-primary: #0055ff;--color-secondary: #0033aa;--color-accent: #ff4081;--color-neutral-100: #f8f9fa;--color-neutral-200: #e9ecef;--color-neutral-300: #dee2e6;--color-neutral-400: #ced4da;--color-neutral-500: #adb5bd;--color-neutral-600: #6c757d;--color-neutral-700: #495057;--color-neutral-800: #343a40;--color-neutral-900: #212529}.dark,.dark :root{--color-background: #111111;--color-surface: #1a1a1a;--color-text: #eeeeee;--color-muted: #aaaaaa;--color-primary: #0033aa;--color-secondary: #002277;--color-accent: #c60055}.light,.light :root{--color-background: #ffffff;--color-surface: #f8f8f8;--color-text: #222222;--color-muted: #999999;--color-primary: #88b0ff;--color-secondary: #ccd9ff;--color-accent: #ff80ab}@media(prefers-color-scheme: dark){:root:not(.light):not(.dark){--color-background: #111111;--color-surface: #1a1a1a;--color-text: #eeeeee;--color-muted: #aaaaaa;--color-primary: #0033aa;--color-secondary: #002277;--color-accent: #c60055}}.background{background-color:var(--color-background)}.bg-surface{background-color:var(--color-surface)}.bg-primary{background-color:var(--color-primary)}.bg-secondary{background-color:var(--color-secondary)}.bg-accent{background-color:var(--color-accent)}.text-text{color:var(--color-text)}.text-background{color:var(--color-background)}.text-muted{color:var(--color-muted)}*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}html,body{margin:0;padding:0;width:100%;overflow-x:hidden}body{padding:2rem;font-family:system-ui,sans-serif;line-height:1.6}.m-0{margin:0}.mt-0{margin-top:0}.mr-0{margin-right:0}.mb-0{margin-bottom:0}.ml-0{margin-left:0}.mx-0{margin-left:0;margin-right:0}.my-0{margin-top:0;margin-bottom:0}.p-0{padding:0}.pt-0{padding-top:0}.pr-0{padding-right:0}.pb-0{padding-bottom:0}.pl-0{padding-left:0}.px-0{padding-left:0;padding-right:0}.py-0{padding-top:0;padding-bottom:0}.m-1{margin:.25rem}.mt-1{margin-top:.25rem}.mr-1{margin-right:.25rem}.mb-1{margin-bottom:.25rem}.ml-1{margin-left:.25rem}.mx-1{margin-left:.25rem;margin-right:.25rem}.my-1{margin-top:.25rem;margin-bottom:.25rem}.p-1{padding:.25rem}.pt-1{padding-top:.25rem}.pr-1{padding-right:.25rem}.pb-1{padding-bottom:.25rem}.pl-1{padding-left:.25rem}.px-1{padding-left:.25rem;padding-right:.25rem}.py-1{padding-top:.25rem;padding-bottom:.25rem}.m-2{margin:.5rem}.mt-2{margin-top:.5rem}.mr-2{margin-right:.5rem}.mb-2{margin-bottom:.5rem}.ml-2{margin-left:.5rem}.mx-2{margin-left:.5rem;margin-right:.5rem}.my-2{margin-top:.5rem;margin-bottom:.5rem}.p-2{padding:.5rem}.pt-2{padding-top:.5rem}.pr-2{padding-right:.5rem}.pb-2{padding-bottom:.5rem}.pl-2{padding-left:.5rem}.px-2{padding-left:.5rem;padding-right:.5rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.m-3{margin:.75rem}.mt-3{margin-top:.75rem}.mr-3{margin-right:.75rem}.mb-3{margin-bottom:.75rem}.ml-3{margin-left:.75rem}.mx-3{margin-left:.75rem;margin-right:.75rem}.my-3{margin-top:.75rem;margin-bottom:.75rem}.p-3{padding:.75rem}.pt-3{padding-top:.75rem}.pr-3{padding-right:.75rem}.pb-3{padding-bottom:.75rem}.pl-3{padding-left:.75rem}.px-3{padding-left:.75rem;padding-right:.75rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}.m-4{margin:1rem}.mt-4{margin-top:1rem}.mr-4{margin-right:1rem}.mb-4{margin-bottom:1rem}.ml-4{margin-left:1rem}.mx-4{margin-left:1rem;margin-right:1rem}.my-4{margin-top:1rem;margin-bottom:1rem}.p-4{padding:1rem}.pt-4{padding-top:1rem}.pr-4{padding-right:1rem}.pb-4{padding-bottom:1rem}.pl-4{padding-left:1rem}.px-4{padding-left:1rem;padding-right:1rem}.py-4{padding-top:1rem;padding-bottom:1rem}.m-5{margin:1.25rem}.mt-5{margin-top:1.25rem}.mr-5{margin-right:1.25rem}.mb-5{margin-bottom:1.25rem}.ml-5{margin-left:1.25rem}.mx-5{margin-left:1.25rem;margin-right:1.25rem}.my-5{margin-top:1.25rem;margin-bottom:1.25rem}.p-5{padding:1.25rem}.pt-5{padding-top:1.25rem}.pr-5{padding-right:1.25rem}.pb-5{padding-bottom:1.25rem}.pl-5{padding-left:1.25rem}.px-5{padding-left:1.25rem;padding-right:1.25rem}.py-5{padding-top:1.25rem;padding-bottom:1.25rem}.m-6{margin:1.5rem}.mt-6{margin-top:1.5rem}.mr-6{margin-right:1.5rem}.mb-6{margin-bottom:1.5rem}.ml-6{margin-left:1.5rem}.mx-6{margin-left:1.5rem;margin-right:1.5rem}.my-6{margin-top:1.5rem;margin-bottom:1.5rem}.p-6{padding:1.5rem}.pt-6{padding-top:1.5rem}.pr-6{padding-right:1.5rem}.pb-6{padding-bottom:1.5rem}.pl-6{padding-left:1.5rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}.py-6{padding-top:1.5rem;padding-bottom:1.5rem}body{font-family:system-ui,sans-serif;font-size:1rem;line-height:1.6;color:var(--color-text);background-color:var(--color-background);margin:0}h1{font-size:2.25rem;line-height:1.2;margin:2rem 0 1rem;font-weight:600;color:var(--color-text)}h2{font-size:1.75rem;line-height:1.2;margin:2rem 0 1rem;font-weight:600;color:var(--color-text)}h3{font-size:1.5rem;line-height:1.2;margin:2rem 0 1rem;font-weight:600;color:var(--color-text)}h4{font-size:1.25rem;line-height:1.2;margin:2rem 0 1rem;font-weight:600;color:var(--color-text)}h5{font-size:1.125rem;line-height:1.2;margin:2rem 0 1rem;font-weight:600;color:var(--color-text)}h6{font-size:1rem;line-height:1.2;margin:2rem 0 1rem;font-weight:600;color:var(--color-text)}p{margin:1rem 0}a{color:var(--color-primary);text-decoration:underline}a:hover{color:var(--color-secondary)}.text-left{text-align:left}.text-center{text-align:center}.text-right{text-align:right}.text-justify{text-align:justify}.text-uppercase{text-transform:uppercase}.text-lowercase{text-transform:lowercase}.text-capitalize{text-transform:capitalize}.font-bold{font-weight:bold}.font-normal{font-weight:normal}.italic{font-style:italic}.not-italic{font-style:normal}.leading-tight{line-height:1.25}.leading-normal{line-height:1.5}.leading-loose{line-height:2}:root{--gap: clamp(1rem, 6vw, 3rem);--full: minmax(var(--gap), 1fr);--feature: minmax(0, 5rem);--popout: minmax(0, 2rem);--content: min(50ch, 100% - var(--gap) * 2)}.container{margin-inline:auto;max-width:72rem;padding-inline:1rem}.full-bleed{width:100vw;margin-left:50%;transform:translateX(-50%)}.breakout{width:100vw;margin-left:calc(-1*(100vw - 100%)/2)}.breakouts-grid{display:grid;grid-template-columns:[full-start] var(--full) [feature-start] var(--feature) [popout-start] var(--popout) [content-start] var(--content) [content-end] var(--popout) [popout-end] var(--feature) [feature-end] var(--full) [full-end];gap:var(--gap)}.content{grid-column:content}.popout{grid-column:popout}.feature{grid-column:feature}.full{grid-column:full}.grid{display:grid;grid-template-columns:1fr minmax(0, var(--container-max-width, 64rem)) 1fr;gap:var(--gap)}.grid>*{grid-column:2}.grid--full>*{grid-column:1/-1}/*# sourceMappingURL=breakouts.min.css.map */
package/dist/breakouts.min.css.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sourceRoot":"","sources":["../src/base/_colors.scss","../src/base/_reset.scss","../src/base/_spacing.scss","../src/base/_typography.scss","../src/layout/_container.scss","../src/layout/_full-bleed.scss","../src/layout/_breakouts.scss","../src/layout/_grid.scss"],"names":[],"mappings":"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","file":"breakouts.min.css"}
1
+ {"version":3,"sourceRoot":"","sources":["../src/base/_colors.scss","../src/base/_reset.scss","../src/base/_spacing.scss","../src/base/_typography.scss","../src/base/_layout.scss"],"names":[],"mappings":"AAEA,MACI,4BACA,yBACA,sBACA,uBACA,yBACA,2BACA,wBAEA,6BACA,6BACA,6BACA,6BACA,6BACA,6BACA,6BACA,6BACA,6BAGJ,kBAEI,4BACA,yBACA,sBACA,uBACA,yBACA,2BACA,wBAGJ,oBAEI,4BACA,yBACA,sBACA,uBACA,yBACA,2BACA,wBAGJ,mCACI,6BACI,4BACA,yBACA,sBACA,uBACA,yBACA,2BACA,yBAMR,YACI,yCAGJ,YACI,sCAGJ,YACI,sCAGJ,cACI,wCAGJ,WACI,qCAGJ,WACI,wBAGJ,iBACI,8BAGJ,YACI,yBCtFJ,qBAGI,sBACA,SACA,UAGJ,UAEI,SACA,UACA,WACA,kBAGJ,KACI,aACA,iCACA,gBCSI,KAQQ,OArCF,EA6BN,MAQQ,WArCF,EA6BN,MAQQ,aArCF,EA6BN,MAQQ,cArCF,EA6BN,MAQQ,YArCF,EA6BN,MAGY,YAhCN,EAgCM,aAhCN,EA6BN,MAGY,WAhCN,EAgCM,cAhCN,EA6BN,KAQQ,QArCF,EA6BN,MAQQ,YArCF,EA6BN,MAQQ,cArCF,EA6BN,MAQQ,eArCF,EA6BN,MAQQ,aArCF,EA6BN,MAGY,aAhCN,EAgCM,cAhCN,EA6BN,MAGY,YAhCN,EAgCM,eAhCN,EA6BN,KAQQ,OArCF,OA6BN,MAQQ,WArCF,OA6BN,MAQQ,aArCF,OA6BN,MAQQ,cArCF,OA6BN,MAQQ,YArCF,OA6BN,MAGY,YAhCN,OAgCM,aAhCN,OA6BN,MAGY,WAhCN,OAgCM,cAhCN,OA6BN,KAQQ,QArCF,OA6BN,MAQQ,YArCF,OA6BN,MAQQ,cArCF,OA6BN,MAQQ,eArCF,OA6BN,MAQQ,aArCF,OA6BN,MAGY,aAhCN,OAgCM,cAhCN,OA6BN,MAGY,YAhCN,OAgCM,eAhCN,OA6BN,KAQQ,OArCF,MA6BN,MAQQ,WArCF,MA6BN,MAQQ,aArCF,MA6BN,MAQQ,cArCF,MA6BN,MAQQ,YArCF,MA6BN,MAGY,YAhCN,MAgCM,aAhCN,MA6BN,MAGY,WAhCN,MAgCM,cAhCN,MA6BN,KAQQ,QArCF,MA6BN,MAQQ,YArCF,MA6BN,MAQQ,cArCF,MA6BN,MAQQ,eArCF,MA6BN,MAQQ,aArCF,MA6BN,MAGY,aAhCN,MAgCM,cAhCN,MA6BN,MAGY,YAhCN,MAgCM,eAhCN,MA6BN,KAQQ,OArCF,OA6BN,MAQQ,WArCF,OA6BN,MAQQ,aArCF,OA6BN,MAQQ,cArCF,OA6BN,MAQQ,YArCF,OA6BN,MAGY,YAhCN,OAgCM,aAhCN,OA6BN,MAGY,WAhCN,OAgCM,cAhCN,OA6BN,KAQQ,QArCF,OA6BN,MAQQ,YArCF,OA6BN,MAQQ,cArCF,OA6BN,MAQQ,eArCF,OA6BN,MAQQ,aArCF,OA6BN,MAGY,aAhCN,OAgCM,cAhCN,OA6BN,MAGY,YAhCN,OAgCM,eAhCN,OA6BN,KAQQ,OArCF,KA6BN,MAQQ,WArCF,KA6BN,MAQQ,aArCF,KA6BN,MAQQ,cArCF,KA6BN,MAQQ,YArCF,KA6BN,MAGY,YAhCN,KAgCM,aAhCN,KA6BN,MAGY,WAhCN,KAgCM,cAhCN,KA6BN,KAQQ,QArCF,KA6BN,MAQQ,YArCF,KA6BN,MAQQ,cArCF,KA6BN,MAQQ,eArCF,KA6BN,MAQQ,aArCF,KA6BN,MAGY,aAhCN,KAgCM,cAhCN,KA6BN,MAGY,YAhCN,KAgCM,eAhCN,KA6BN,KAQQ,OArCF,QA6BN,MAQQ,WArCF,QA6BN,MAQQ,aArCF,QA6BN,MAQQ,cArCF,QA6BN,MAQQ,YArCF,QA6BN,MAGY,YAhCN,QAgCM,aAhCN,QA6BN,MAGY,WAhCN,QAgCM,cAhCN,QA6BN,KAQQ,QArCF,QA6BN,MAQQ,YArCF,QA6BN,MAQQ,cArCF,QA6BN,MAQQ,eArCF,QA6BN,MAQQ,aArCF,QA6BN,MAGY,aAhCN,QAgCM,cAhCN,QA6BN,MAGY,YAhCN,QAgCM,eAhCN,QA6BN,KAQQ,OArCF,OA6BN,MAQQ,WArCF,OA6BN,MAQQ,aArCF,OA6BN,MAQQ,cArCF,OA6BN,MAQQ,YArCF,OA6BN,MAGY,YAhCN,OAgCM,aAhCN,OA6BN,MAGY,WAhCN,OAgCM,cAhCN,OA6BN,KAQQ,QArCF,OA6BN,MAQQ,YArCF,OA6BN,MAQQ,cArCF,OA6BN,MAQQ,eArCF,OA6BN,MAQQ,aArCF,OA6BN,MAGY,aAhCN,OAgCM,cAhCN,OA6BN,MAGY,YAhCN,OAgCM,eAhCN,OCgBd,KACI,YAde,qBAef,UAba,KAcb,YAbe,IAcf,wBACA,yCACA,SAMA,GACI,UApBG,QAqBH,gBACA,mBACA,gBACA,wBALJ,GACI,UApBG,QAqBH,gBACA,mBACA,gBACA,wBALJ,GACI,UApBG,OAqBH,gBACA,mBACA,gBACA,wBALJ,GACI,UApBG,QAqBH,gBACA,mBACA,gBACA,wBALJ,GACI,UApBG,SAqBH,gBACA,mBACA,gBACA,wBALJ,GACI,UApBG,KAqBH,gBACA,mBACA,gBACA,wBAIR,EACI,cAGJ,EACI,2BACA,0BAEA,QACI,6BAKR,WACI,gBAGJ,aACI,kBAGJ,YACI,iBAGJ,cACI,mBAIJ,gBACI,yBAGJ,gBACI,yBAGJ,iBACI,0BAIJ,WACI,iBAGJ,aACI,mBAGJ,QACI,kBAGJ,YACI,kBAIJ,eACI,iBAGJ,gBACI,gBAGJ,eACI,cC3GJ,MACI,8BACA,gCACA,2BACA,0BACA,4CAGJ,WACI,mBACA,gBACA,oBAGJ,YACI,YACA,gBACA,2BAGJ,UACI,YACA,sCAIJ,gBACI,aACA,sBACI,iNACJ,eAGJ,SACI,oBAGJ,QACI,mBAGJ,SACI,oBAGJ,MACI,iBAIJ,MACI,aACA,2EACA,eAEA,QACI,cAIR,cACI","file":"breakouts.min.css"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "breakouts",
3
- "version": "0.1.1",
3
+ "version": "0.1.2",
4
4
  "description": "A personal SCSS/CSS layout utility framework.",
5
5
  "main": "dist/breakouts.css",
6
6
  "files": [
package/src/_index.scss CHANGED
@@ -7,9 +7,4 @@
7
7
  @forward 'base/reset';
8
8
  @forward 'base/spacing';
9
9
  @forward 'base/typography';
10
-
11
- // Layout utilities
12
- @forward 'layout/container';
13
- @forward 'layout/full-bleed';
14
- @forward 'layout/breakouts';
15
- @forward 'layout/grid';
10
+ @forward 'base/layout';
package/src/base/_colors.scss CHANGED
@@ -56,7 +56,7 @@
56
56
 
57
57
  // Utility classes for background and text colors
58
58
 
59
- .bg-background {
59
+ .background {
60
60
  background-color: var(--color-background);
61
61
  }
62
62
 
package/src/{layout/_grid.scss → base/_layout.scss} RENAMED
@@ -6,6 +6,23 @@
6
6
  --content: min(50ch, 100% - var(--gap) * 2);
7
7
  }
8
8
 
9
+ .container {
10
+ margin-inline: auto;
11
+ max-width: 72rem;
12
+ padding-inline: 1rem;
13
+ }
14
+
15
+ .full-bleed {
16
+ width: 100vw;
17
+ margin-left: 50%;
18
+ transform: translateX(-50%);
19
+ }
20
+
21
+ .breakout {
22
+ width: 100vw;
23
+ margin-left: calc(-1 * (100vw - 100%) / 2);
24
+ }
25
+
9
26
  // Breakouts Grid (named lines)
10
27
  .breakouts-grid {
11
28
  display: grid;
package/src/theme/_chupa-pop.scss CHANGED
@@ -1,8 +1,8 @@
1
1
  // src/theme/_chupa-pop.scss
2
2
 
3
- $color-primary: #ecb838 !default; // Giallo dorato
4
- $color-secondary: #ab4073 !default; // Rosa scuro
5
- $color-accent: #196484 !default; // Blu petrolio
3
+ $color-primary: #ecb838 !default;
4
+ $color-secondary: #ab4073 !default;
5
+ $color-accent: #196484 !default;
6
6
 
7
7
  @forward 'breakouts/src/theme/variables' with (
8
8
  $color-primary: $primary,
@@ -22,7 +22,4 @@ $color-accent: #196484 !default; // Blu petrolio
22
22
  @forward 'breakouts/src/theme/colors';
23
23
  @forward 'breakouts/src/base/reset';
24
24
  @forward 'breakouts/src/base/typography';
25
- @forward 'breakouts/src/layout/container';
26
- @forward 'breakouts/src/layout/full-bleed';
27
- @forward 'breakouts/src/layout/breakouts';
28
- @forward 'breakouts/src/layout/grid';
25
+ @forward 'breakouts/src/base/layout';
package/src/theme/_medical.scss CHANGED
@@ -1,10 +1,10 @@
1
1
  // src/theme/medical.scss
2
2
 
3
- $primary: #4682B4 !default; // Blu Acciaio
4
- $secondary: #9DC183 !default; // Verde Salvia
5
- $accent: #A9A9A9 !default; // Grigio scuro
6
- $muted: #D3D3D3 !default; // Grigio chiaro
7
- $background: #FFFFFF !default; // Bianco puro
3
+ $primary: #4682B4 !default;
4
+ $secondary: #9DC183 !default;
5
+ $accent: #A9A9A9 !default;
6
+ $muted: #D3D3D3 !default;
7
+ $background: #FFFFFF !default;
8
8
 
9
9
  @forward 'breakouts/src/theme/variables'with ($color-primary: $primary,
10
10
  $color-primary-dark: darken($primary, 15%),
@@ -30,7 +30,4 @@ $background: #FFFFFF !default; // Bianco puro
30
30
  @forward 'breakouts/src/theme/colors';
31
31
  @forward 'breakouts/src/base/reset';
32
32
  @forward 'breakouts/src/base/typography';
33
- @forward 'breakouts/src/layout/container';
34
- @forward 'breakouts/src/layout/full-bleed';
35
- @forward 'breakouts/src/layout/breakouts';
36
- @forward 'breakouts/src/layout/grid';
33
+ @forward 'breakouts/src/base/layout';
package/src/theme/_tootsie-pop.scss CHANGED
@@ -1,10 +1,10 @@
1
1
  // src/theme/tootsie-pop.scss
2
2
 
3
- $primary: #93329E !default; // Viola medio
4
- $secondary: #F2711C !default; // Caramello
5
- $accent: #E94057 !default; // Rosa lampone
6
- $muted: #FFE5B4 !default; // Vaniglia chiara
7
- $background: #4F2F4C !default; // Viola scuro (sfondo)
3
+ $primary: #93329E !default;
4
+ $secondary: #F2711C !default;
5
+ $accent: #E94057 !default;
6
+ $muted: #FFE5B4 !default;
7
+ $background: #4F2F4C !default;
8
8
 
9
9
  @forward 'breakouts/src/theme/variables' with (
10
10
  $color-primary: $primary,
@@ -32,7 +32,4 @@ $background: #4F2F4C !default; // Viola scuro (sfondo)
32
32
  @forward 'breakouts/src/theme/colors';
33
33
  @forward 'breakouts/src/base/reset';
34
34
  @forward 'breakouts/src/base/typography';
35
- @forward 'breakouts/src/layout/container';
36
- @forward 'breakouts/src/layout/full-bleed';
37
- @forward 'breakouts/src/layout/breakouts';
38
- @forward 'breakouts/src/layout/grid';
35
+ @forward 'breakouts/src/base/layout';
package/src/layout/_breakouts.scss DELETED
@@ -1,4 +0,0 @@
1
- .breakout {
2
- width: 100vw;
3
- margin-left: calc(-1 * (100vw - 100%) / 2);
4
- }
package/src/layout/_container.scss DELETED
@@ -1,5 +0,0 @@
1
- .container {
2
- margin-inline: auto;
3
- max-width: 72rem;
4
- padding-inline: 1rem;
5
- }
package/src/layout/_full-bleed.scss DELETED
@@ -1,5 +0,0 @@
1
- .full-bleed {
2
- width: 100vw;
3
- margin-left: 50%;
4
- transform: translateX(-50%);
5
- }