@fluent-windows/core/styles/createBreakpoint.js

React components that inspired by Microsoft's Fluent Design System.

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports["default"] = exports.defaultBreakpoints = void 0;

var _utils = require("../utils");

var defaultBreakpoints = ['600px', '960px', '1280px', '1920px'];
exports.defaultBreakpoints = defaultBreakpoints;

function createBreakpoint(breakpoints) {
  var _breakpoints = (0, _utils.deepMerge)(defaultBreakpoints, breakpoints);

  _breakpoints.sm = "@media screen and (min-width: ".concat(defaultBreakpoints[0], ")");
  _breakpoints.md = "@media screen and (min-width: ".concat(defaultBreakpoints[1], ")");
  _breakpoints.lg = "@media screen and (min-width: ".concat(defaultBreakpoints[2], ")");
  _breakpoints.xl = "@media screen and (min-width: ".concat(defaultBreakpoints[3], ")");
  return _breakpoints;
}

var _default = createBreakpoint;
exports["default"] = _default;