Skip to content

Commit

Permalink
Macy breakAt can now be based on container width instead, Fixes #40
Browse files Browse the repository at this point in the history
jrmd committed Apr 1, 2019
1 parent 34fd765 commit 5a2ff9b
Showing 6 changed files with 10 additions and 5 deletions.
3 changes: 3 additions & 0 deletions README.md
Original file line number Diff line number Diff line change
@@ -123,6 +123,9 @@ This would change the xMargin to 20px when screens are smaller than 760, but the

_Default: `false`_ - If enabled this will cause the script to not run on browsers that don't support native Promises and when there isn't a polyfill present.

#### **useContainerForBreakpoints**
_Default: `false`_ - When enabled the breakpoint options are based on the container elements width instead of the document width.

## Methods

#### **Macy**
2 changes: 1 addition & 1 deletion demo/index.html
Original file line number Diff line number Diff line change
@@ -120,7 +120,7 @@ <h1 class="hero__title">Macy.js is a lightweight, dependency free, 2kb (gzipped)
940: 5,
520: 3,
400: 2
}
},
});
</script>
</body>
2 changes: 1 addition & 1 deletion dist/macy.js

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion src/helpers/getResponsiveOptions.js
Original file line number Diff line number Diff line change
@@ -76,7 +76,7 @@ export function getOptionsAsDesktopFirst ({ options, responsiveOptions, keys, do
* @return {Object} - Object containing the current spacing options
*/
export function getResponsiveOptions (options) {
let docWidth = window.innerWidth;
let docWidth = options.useContainerForBreakpoints ? options.container.clientWidth : window.innerWidth;
let responsiveOptions = {
columns: options.columns,
};
1 change: 1 addition & 0 deletions src/macy.js
Original file line number Diff line number Diff line change
@@ -22,6 +22,7 @@ const defaults = {
useOwnImageLoader: false,
onInit: false,
cancelLegacy: false,
useContainerForBreakpoints: false,
};

scopeShim();
5 changes: 3 additions & 2 deletions src/modules/setup.js
Original file line number Diff line number Diff line change
@@ -26,13 +26,14 @@ const setupContainer = (ctx) => {
return ctx.options.debug ? console.error('Error: Container not found') : false;
}

// Remove container selector from the options
delete ctx.options.container;

if (ctx.container.length) {
ctx.container = ctx.container[0];
}

// Set container options selector to container element
ctx.options.container = ctx.container;

ctx.container.style.position = 'relative';
};

0 comments on commit 5a2ff9b

Please sign in to comment.