Financial-Times / o-grid

Responsive grid system
http://registry.origami.ft.com/components/o-grid
94 stars 17 forks source link

Simplify configuration to a single map? #65

Closed kaelig closed 9 years ago

kaelig commented 9 years ago
$o-grid-default-config: (
    columns: 12,
    gutter: 10px,
    min-width: 240px,
    max-width: 1330px,
    layouts: (
        S:  370px,  // ≥20px columns
        M:  610px,  // ≥40px columns
        L:  850px,  // ≥60px columns
        XL: 1090px  // ≥80px columns
    ),
    fluid: true,
    debug: false,
    fixed-layout: M,
    enhanced-experience: true
);

// User configuration
$o-grid-user-config: () !default;

// Set a configuration setting
@mixin oGridSet($settings) {
    $o-grid-default-config: map-merge($o-grid-default-config, $settings) !global;
}

// Get a setting from the configuration
@function oGridGet($setting) {
    @return map-get($o-grid-default-config, $setting);
}

// Set user configuration
@include oGridSet($o-grid-user-config);

User sets their own configuration through $o-grid-user-config.

Large Sass frameworks do that and I think that's a pretty good way of simplifying configuration compared to the amount of scrolling required to go through all of _variables.scss.

Any thoughts?

Thanks to @HugoGiraudel for the inspiration.

KittyGiraudel commented 9 years ago

Two things:

kaelig commented 9 years ago

oGridSet((columns: 16)) should override the columns only, no?

And for now I think we could get away with a "oGridAddLayout" mixin instead of having a fully fledged map-deep-merge function.

KittyGiraudel commented 9 years ago

oGridSet((columns: 16)) should override the columns only, no?

True, my bad. Although you could have something like this:

@mixin oGridSetContext($settings) {
  $tmp: $o-grid-default-config;
  @include oGridSet($settings);
  @content;
  @include oGridSet($tmp);
}

And for now I think we could get away with a "oGridAddLayout" mixin instead of having a fully fledged map-deep-merge function.

Might work.

kaelig commented 9 years ago

Good point, having a grid inside a grid isn't a use case yet but I'll keep that in mind.

And thanks for your (always) valuable comments!

AlbertoElias commented 9 years ago

@kaelig Don't we have grids inside other grids in a lot of places or do you mean something else?

kaelig commented 9 years ago

@AlbertoElias: as far as I know we don't have a 8 or a 16 col grid inside the default 12 col grid, do we?

AlbertoElias commented 9 years ago

@kaelig Oh no, I meant a 12 col grid inside another 12 col grid

kaelig commented 9 years ago

Yes one can nest columns / rows as needed. But nesting a grid system inside a different grid system hasn't been a use case.

kaelig commented 9 years ago

Thanks for your feedback.

The current configuration (using many variables) is more widely spread and didn't come in the way of development when building the v3.0 of o-grid. Closing this.