Initial commit to github

styles/base/break-out.css

@@ -0,0 +1,24 @@
+@theme {
+  /** Break-out variables
+   * These are used for the break-out plugin and the responsive utilities.
+   * The break-out variables are set to match the default plugin settings.
+   * You can override them if you need to adjust for a particular use case.
+   */
+  --twcb-scrollbar-width: 0px;
+}
+
+@utility mx-break-out {
+  margin-left: calc(50% - 50vw);
+  margin-right: calc(50% - 50vw);
+  width: calc(100vw - var(--twcb-scrollbar-width));
+}
+
+@utility ml-break-out {
+  margin-left: calc(50% - 50vw);
+  width: 100%;
+}
+
+@utility mr-break-out {
+  margin-left: calc(-50% + 50vw);
+  width: 100%;
+}