feat(useBreakpoints): add breakpoints for ElementUI/ElementPlus (#4238)

a81n9 · antfu · web-flow · commit f71e51382961 · 2024-10-24T16:48:07.000Z
Co-authored-by: Anthony Fu &lt;anthonyfu117@hotmail.com&gt;
diff --git a/packages/core/useBreakpoints/breakpoints.ts b/packages/core/useBreakpoints/breakpoints.ts
@@ -128,3 +128,17 @@ export const breakpointsPrimeFlex = {
   lg: 992,
   xl: 1200,
 }
+
+/**
+ * Breakpoints from ElementUI/ElementPlus
+ *
+ * @see https://element.eleme.io/#/en-US/component/layout
+ * @see https://element-plus.org/en-US/component/layout.html
+ */
+export const breakpointsElement = {
+  xs: 0,
+  sm: 768,
+  md: 992,
+  lg: 1200,
+  xl: 1920,
+}
diff --git a/packages/core/useBreakpoints/index.md b/packages/core/useBreakpoints/index.md
@@ -55,6 +55,7 @@ const laptop = breakpoints.between('laptop', 'desktop')
 - Sematic: `breakpointsSematic`
 - Master CSS: `breakpointsMasterCss`
 - Prime Flex: `breakpointsPrimeFlex`
+- ElementUI / ElementPlus: `breakpointsElement`
 
 _Breakpoint presets are deliberately not auto-imported, as they do not start with `use` to have the scope of VueUse. They have to be explicitly imported:_
 
