feat(utils): add helper function to access global css breakpoint values

Author: gratestas

src/stylesheets/variables/_breakpoints.scss

@@ -1,2 +1,7 @@
 $small: 600px;
 $large: 1200px;
+
+:root {
+  --small: #{$small};
+  --large: #{$large};
+}

src/utils/breakpoints.js

@@ -0,0 +1,8 @@
+export function getBreakpointValue(breakpointName) {
+  const breakpoints = {
+    small: parseInt(getComputedStyle(document.documentElement).getPropertyValue("--small"), 10),
+    large: parseInt(getComputedStyle(document.documentElement).getPropertyValue("--large"), 10),
+  };
+
+  return breakpoints[breakpointName] || null;
+}