not-bulma 1.2.62 → 1.2.64

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "not-bulma",
-  "version": "1.2.62",
+  "version": "1.2.64",
   "description": "not-* family UI components on Bulma CSS Framework",
   "main": "src/index.js",
   "svelte": "src/index.js",

package/src/elements/common.js

@@ -4,6 +4,7 @@ export default class UICommon {
     static DEFAULT_REDIRECT_TIMEOUT = 3000;
     static CLASS_OK = "is-success";
     static CLASS_ERR = "is-danger";
+    static SCROLL_DISABLER_CLASS = "remove-scroll";
     static FILLER = "_";
 
     static SCROLL_OPTIONS = {
@@ -11,6 +12,32 @@ export default class UICommon {
         behavior: "smooth",
     };
 
+    static MOBILE_WIDTH_BREAK_POINT = 760;
+
+    static isMobile() {
+        const testMobile = window.matchMedia || window.msMatchMedia;
+        if (testMobile) {
+            let testQuery = "(pointer:coarse)";
+            if (arguments.length) {
+                const max_width =
+                    typeof arguments[0] === "boolean"
+                        ? this.MOBILE_WIDTH_BREAK_POINT
+                        : arguments[0];
+                testQuery = `only screen and (max-width: ${max_width}px)`;
+            }
+            return testMobile(testQuery).matches;
+        }
+        return false;
+    }
+
+    static removeBodyScroll() {
+        document.body.classList.add(this.SCROLL_DISABLER_CLASS);
+    }
+
+    static restoreBodyScroll() {
+        document.body.classList.remove(this.SCROLL_DISABLER_CLASS);
+    }
+
     /**
      *  Reformats input from any string to strict phone format
      *  @param {string}    val    free style phone number

package/src/elements/modal/ui.modal.svelte

@@ -54,7 +54,7 @@
 
             {#if buttonsPosition === "bottom"}
                 <UIButtonsRow
-                    classes={buttonsClasses || "is-footer"}
+                    classes={buttonsClasses || "is-footer is-mobile"}
                     left={closeButton ? [closeButton] : []}
                     right={applyButton ? [applyButton] : []}
                 ></UIButtonsRow>

package/src/scss/_card.scss

@@ -0,0 +1,5 @@
+.card-selected {
+    border: 4px solid var(--bulma-primary);
+    margin-top: -4px;
+    margin-left: -4px;
+}

package/src/scss/_overlay.scss

@@ -10,7 +10,35 @@
     overflow: hidden;
 }
 
+.child-overflow {
+    background-color: var(--bulma-scheme-main);
+    position: fixed !important;
+    top: 0px;
+    left: 0px;
+    width: 100%;
+    height: 100%;
+    margin: 0px;
+    display: block;
+    opacity: 1;
+    overflow: hidden;
+    z-index: 100;
+}
+
 .stop-scrolling {
     height: 100%;
     overflow: hidden;
 }
+
+html:has(body.remove-scroll) {
+    overflow: hidden;
+}
+
+.remove-scroll {
+    overflow: hidden;
+    scrollbar-width: none;
+    -ms-overflow-style: none; /* for Internet Explorer, Edge */
+}
+
+.remove-scroll ::-webkit-scrollbar {
+    display: none; /* for Chrome, Safari, and Opera */
+}

package/src/scss/_pagination.scss

@@ -0,0 +1,3 @@
+.pagination .pagination-list li {
+    margin-top: 0rem;
+}

package/src/scss/style.scss

@@ -1,12 +1,14 @@
 @import "bulma/sass/utilities/_index.scss";
 
 @import "./_buttons.scss";
+@import "./_card.scss";
 @import "./_helpers.scss";
 @import "./_menu.scss";
 @import "./_position.scss";
 @import "./_forms.scss";
 @import "./_loader.scss";
 @import "./_padding.scss";
+@import "./_pagination.scss";
 @import "./_overlay.scss";
 @import "./_breadcrumbs.scss";