🚚 [bootsier] Extiende Bootstrap sin cambiar core

packages/pagetop-bootsier/build.rs

@@ -4,7 +4,7 @@ use std::env;
 use std::path::Path;
 
 fn main() -> std::io::Result<()> {
-    StaticFilesBundle::from_scss("./static/scss/bootstrap.scss", "bootstrap.min.css")
+    StaticFilesBundle::from_scss("./static/scss/bootsier.scss", "bootstrap.min.css")
         .with_name("bootsier_bs")
         .build()?;
     StaticFilesBundle::from_dir("./static/js", Some(bootstrap_js_files))

packages/pagetop-bootsier/static/scss/_custom.scss

@@ -0,0 +1,101 @@
+// Enable CSS Grid
+$enable-grid-classes: false;
+$enable-cssgrid: true;
+
+// Text opacity
+.text-opacity-10 {
+  --bs-text-opacity: 0.1;
+}
+
+
+
+
+
+// Extending utilities
+$utilities: map-merge(
+  $utilities,
+  (
+    // Individual border widths
+    "border-top": (
+      property: border-top-width,
+      class: border-top,
+      values: $border-widths
+    ),
+    "border-end": (
+      property: border-right-width,
+      class: border-end,
+      values: $border-widths
+    ),
+    "border-bottom": (
+      property: border-bottom-width,
+      class: border-bottom,
+      values: $border-widths
+    ),
+    "border-start": (
+      property: border-left-width,
+      class: border-start,
+      values: $border-widths
+    ),
+    // Individual rounded values
+    "rounded-top-start": (
+      property: border-top-left-radius,
+      class: rounded-top-start,
+      values: (
+        null: var(--#{$prefix}border-radius),
+        0: 0,
+        1: var(--#{$prefix}border-radius-sm),
+        2: var(--#{$prefix}border-radius),
+        3: var(--#{$prefix}border-radius-lg),
+        4: var(--#{$prefix}border-radius-xl),
+        5: var(--#{$prefix}border-radius-xxl),
+        circle: 50%,
+        pill: var(--#{$prefix}border-radius-pill)
+      )
+    ),
+    "rounded-top-end": (
+      property: border-top-right-radius,
+      class: rounded-top-end,
+      values: (
+        null: var(--#{$prefix}border-radius),
+        0: 0,
+        1: var(--#{$prefix}border-radius-sm),
+        2: var(--#{$prefix}border-radius),
+        3: var(--#{$prefix}border-radius-lg),
+        4: var(--#{$prefix}border-radius-xl),
+        5: var(--#{$prefix}border-radius-xxl),
+        circle: 50%,
+        pill: var(--#{$prefix}border-radius-pill)
+      )
+    ),
+    "rounded-bottom-start": (
+      property: border-bottom-left-radius,
+      class: rounded-bottom-start,
+      values: (
+        null: var(--#{$prefix}border-radius),
+        0: 0,
+        1: var(--#{$prefix}border-radius-sm),
+        2: var(--#{$prefix}border-radius),
+        3: var(--#{$prefix}border-radius-lg),
+        4: var(--#{$prefix}border-radius-xl),
+        5: var(--#{$prefix}border-radius-xxl),
+        circle: 50%,
+        pill: var(--#{$prefix}border-radius-pill)
+      )
+    ),
+    "rounded-bottom-end": (
+      property: border-bottom-right-radius,
+      class: rounded-bottom-end,
+      values: (
+        null: var(--#{$prefix}border-radius),
+        0: 0,
+        1: var(--#{$prefix}border-radius-sm),
+        2: var(--#{$prefix}border-radius),
+        3: var(--#{$prefix}border-radius-lg),
+        4: var(--#{$prefix}border-radius-xl),
+        5: var(--#{$prefix}border-radius-xxl),
+        circle: 50%,
+        pill: var(--#{$prefix}border-radius-pill)
+      )
+    ),
+  )
+);

packages/pagetop-bootsier/static/scss/bootsier.scss

@@ -0,0 +1,54 @@
+@import "bootstrap-5.3.3/mixins/banner";
+@include bsBanner("");
+
+
+// scss-docs-start import-stack
+// Configuration
+@import "bootstrap-5.3.3/functions";
+@import "bootstrap-5.3.3/variables";
+@import "bootstrap-5.3.3/variables-dark";
+@import "bootstrap-5.3.3/maps";
+@import "bootstrap-5.3.3/mixins";
+@import "bootstrap-5.3.3/utilities";
+
+@import "custom";
+
+// Layout & components
+@import "bootstrap-5.3.3/root";
+@import "bootstrap-5.3.3/reboot";
+@import "bootstrap-5.3.3/type";
+@import "bootstrap-5.3.3/images";
+@import "bootstrap-5.3.3/containers";
+@import "bootstrap-5.3.3/grid";
+@import "bootstrap-5.3.3/tables";
+@import "bootstrap-5.3.3/forms";
+@import "bootstrap-5.3.3/buttons";
+@import "bootstrap-5.3.3/transitions";
+@import "bootstrap-5.3.3/dropdown";
+@import "bootstrap-5.3.3/button-group";
+@import "bootstrap-5.3.3/nav";
+@import "bootstrap-5.3.3/navbar";
+@import "bootstrap-5.3.3/card";
+@import "bootstrap-5.3.3/accordion";
+@import "bootstrap-5.3.3/breadcrumb";
+@import "bootstrap-5.3.3/pagination";
+@import "bootstrap-5.3.3/badge";
+@import "bootstrap-5.3.3/alert";
+@import "bootstrap-5.3.3/progress";
+@import "bootstrap-5.3.3/list-group";
+@import "bootstrap-5.3.3/close";
+@import "bootstrap-5.3.3/toasts";
+@import "bootstrap-5.3.3/modal";
+@import "bootstrap-5.3.3/tooltip";
+@import "bootstrap-5.3.3/popover";
+@import "bootstrap-5.3.3/carousel";
+@import "bootstrap-5.3.3/spinners";
+@import "bootstrap-5.3.3/offcanvas";
+@import "bootstrap-5.3.3/placeholders";
+
+// Helpers
+@import "bootstrap-5.3.3/helpers";
+
+// Utilities
+@import "bootstrap-5.3.3/utilities/api";
+// scss-docs-end import-stack

packages/pagetop-bootsier/static/scss/bootstrap-5.3.3/_variables.scss

@@ -374,9 +374,9 @@ $enable-gradients:            false !default;
 $enable-transitions:          true !default;
 $enable-reduced-motion:       true !default;
 $enable-smooth-scroll:        true !default;
-$enable-grid-classes:         false !default;
+$enable-grid-classes:         true !default;
 $enable-container-classes:    true !default;
-$enable-cssgrid:              true !default;
+$enable-cssgrid:              false !default;
 $enable-button-pointers:      true !default;
 $enable-rfs:                  true !default;
 $enable-validation-icons:     true !default;