kmaterialize 2.3.3-1.0.2 → 2.3.3-1.0.4

package/README.md

@@ -15,7 +15,7 @@
 ## Getting started
 Read the [getting started guide](https://materialize.kevinzarshenas.com/getting-started.html) for more information on how to use kmaterialize.
 
-- Clone the repo: `git clone https://github.com/materializecss/materialize.git`
+- Clone the repo: `git clone https://github.com/kekefreedog/kmaterialize.git`
 - Install with [npm](https://www.npmjs.com): `npm install kmaterialize`
 
 ## Testing
@@ -31,7 +31,7 @@ This is the core project with all the components. To see how they are used we re
 See [Materialize Docs Repo](https://github.com/materializecss/materialize-docs) to see Materialize in Action.
 
 ### Releases
-Previous releases are available [here](https://github.com/materializecss/materialize/releases). You can also find the changelog under each release.
+Previous releases are available [here](https://github.com/kekefreedog/kmaterialize/releases). You can also find the changelog under each release.
 
 ## Supported Browsers:
 Materialize is compatible with:
@@ -49,7 +49,7 @@ We use Jasmine as our testing framework and we're trying to write a robust test
 For quick testing install live-server node package globally and run `npm run demo`
 
 ## Contributing
-Check out the [CONTRIBUTING document](docs/CONTRIBUTING.md) in the root of the repository to learn how you can contribute. You can also browse the [help-wanted](https://github.com/materializecss/materialize/labels/help-wanted) tag in our issue tracker to find things to do.
+Check out the [CONTRIBUTING document](docs/CONTRIBUTING.md) in the root of the repository to learn how you can contribute. You can also browse the [help-wanted](https://github.com/kekefreedog/kmaterialize/labels/help-wanted) tag in our issue tracker to find things to do.
 
 ## Copyright and license
 Code Copyright 2026 kmaterialize. Code released under the MIT license.

package/components/collapsible/_collapsible.scss

@@ -4,6 +4,7 @@
 .collapsible {
   padding-left: 0;
   list-style-type: none;
+  background-color: var(--md-sys-color-surface);
   border-top: 1px solid var(--md-sys-color-outline-variant);
   border-right: 1px solid var(--md-sys-color-outline-variant);
   border-left: 1px solid var(--md-sys-color-outline-variant);

package/components/textfield/_input-fields.scss

@@ -50,7 +50,7 @@ textarea.materialize-textarea {
 
   // Default
 
-  input, textarea {
+  input:not([type=checkbox]):not([type=radio]), textarea {
     box-sizing: border-box; /* https://stackoverflow.com/questions/1377719/padding-within-inputs-breaks-width-100*/
     padding: 0 16px;
     padding-top: 20px;
@@ -180,7 +180,7 @@ textarea.materialize-textarea {
 
   &.outlined {
 
-    input, textarea {
+    input:not([type=checkbox]):not([type=radio]), textarea {
       padding-top: 0;
       background-color: transparent; //(--md-sys-color-background);
       border: 1px solid var(--md-sys-color-on-surface-variant);
@@ -225,7 +225,7 @@ textarea.materialize-textarea {
     // border/label/text below should pick up the error color.
     background-color: transparent;
 
-    input, textarea {
+    input:not([type=checkbox]):not([type=radio]), textarea {
       border-color: var(--md-sys-color-error);
     }
     input:focus:not([readonly]), textarea:focus:not([readonly]) {

package/dist/css/materialize.colors.min.css

@@ -1,5 +1,5 @@
 /*!
-* Materialize v2.3.3-1.0.2 (https://materializeweb.com)
+* Materialize v2.3.3-1.0.4 (https://materializeweb.com)
 * Copyright 2014-2026 Materialize
 * MIT License (https://raw.githubusercontent.com/materializecss/materialize/master/LICENSE)
 */

package/dist/css/materialize.css

@@ -1,5 +1,5 @@
 /*!
-* Materialize v2.3.3-1.0.2 (https://materializeweb.com)
+* Materialize v2.3.3-1.0.4 (https://materializeweb.com)
 * Copyright 2014-2026 Materialize
 * MIT License (https://raw.githubusercontent.com/materializecss/materialize/master/LICENSE)
 */
@@ -4920,65 +4920,6 @@ body {
           transform: scale(1);
 }
 
-.pulse {
-  overflow: visible;
-  position: relative;
-  &::before {
-    content: "";
-    display: block;
-    position: absolute;
-    pointer-events: none;
-    width: 100%;
-    height: 100%;
-    top: 0;
-    left: 0;
-    background-color: inherit;
-    border-radius: inherit;
-    -webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
-    transition: opacity 0.3s, -webkit-transform 0.3s;
-    transition: opacity 0.3s, transform 0.3s;
-    transition: opacity 0.3s, transform 0.3s, -webkit-transform 0.3s;
-    -webkit-animation: pulse-animation 1s cubic-bezier(0.24, 0, 0.38, 1) infinite;
-            animation: pulse-animation 1s cubic-bezier(0.24, 0, 0.38, 1) infinite;
-    z-index: -1;
-  }
-}
-
-@-webkit-keyframes pulse-animation {
-  0% {
-    opacity: 1;
-    -webkit-transform: scale(1);
-            transform: scale(1);
-  }
-  50% {
-    opacity: 0;
-    -webkit-transform: scale(1.5);
-            transform: scale(1.5);
-  }
-  100% {
-    opacity: 0;
-    -webkit-transform: scale(1.5);
-            transform: scale(1.5);
-  }
-}
-
-@keyframes pulse-animation {
-  0% {
-    opacity: 1;
-    -webkit-transform: scale(1);
-            transform: scale(1);
-  }
-  50% {
-    opacity: 0;
-    -webkit-transform: scale(1.5);
-            transform: scale(1.5);
-  }
-  100% {
-    opacity: 0;
-    -webkit-transform: scale(1.5);
-            transform: scale(1.5);
-  }
-}
 .table-of-contents {
   list-style: none;
 }
@@ -5512,6 +5453,7 @@ button.btn-floating {
 .collapsible {
   padding-left: 0;
   list-style-type: none;
+  background-color: var(--md-sys-color-surface);
   border-top: 1px solid var(--md-sys-color-outline-variant);
   border-right: 1px solid var(--md-sys-color-outline-variant);
   border-left: 1px solid var(--md-sys-color-outline-variant);
@@ -9365,17 +9307,17 @@ textarea.materialize-textarea {
   background-color: transparent;
 }
 
-.input-field input.invalid, .input-field textarea.invalid {
+.input-field input:not([type=checkbox]):not([type=radio]).invalid, .input-field textarea.invalid {
   border-bottom: 2px solid var(--md-sys-color-error);
   -webkit-box-shadow: 0 1px 0 0 var(--md-sys-color-error);
           box-shadow: 0 1px 0 0 var(--md-sys-color-error);
 }
 
-.input-field input.invalid ~ .supporting-text[data-error] > span, .input-field textarea.invalid ~ .supporting-text[data-error] > span {
+.input-field input:not([type=checkbox]):not([type=radio]).invalid ~ .supporting-text[data-error] > span, .input-field textarea.invalid ~ .supporting-text[data-error] > span {
   display: none;
 }
 
-.input-field input.invalid ~ .supporting-text:after, .input-field textarea.invalid ~ .supporting-text:after {
+.input-field input:not([type=checkbox]):not([type=radio]).invalid ~ .supporting-text:after, .input-field textarea.invalid ~ .supporting-text:after {
   content: attr(data-error);
   color: var(--md-sys-color-error);
 }
@@ -9385,7 +9327,7 @@ textarea.materialize-textarea {
   position: relative;
   clear: both;
 }
-.input-field input, .input-field textarea {
+.input-field input:not([type=checkbox]):not([type=radio]), .input-field textarea {
   -webkit-box-sizing: border-box;
           box-sizing: border-box; /* https://stackoverflow.com/questions/1377719/padding-within-inputs-breaks-width-100*/
   padding: 0 16px;
@@ -9396,35 +9338,35 @@ textarea.materialize-textarea {
   border-bottom-left-radius: 0;
   border-bottom-right-radius: 0;
 }
-.input-field input:focus:not([readonly]), .input-field textarea:focus:not([readonly]) {
+.input-field input:not([type=checkbox]):not([type=radio]):focus:not([readonly]), .input-field textarea:focus:not([readonly]) {
   border-bottom: 2px solid var(--input-color);
   padding-top: 21px;
 }
-.input-field input:disabled, .input-field input[readonly=readonly], .input-field textarea:disabled, .input-field textarea[readonly=readonly] {
+.input-field input:not([type=checkbox]):not([type=radio]):disabled, .input-field input:not([type=checkbox]):not([type=radio])[readonly=readonly], .input-field textarea:disabled, .input-field textarea[readonly=readonly] {
   color: color-mix(in srgb, transparent, var(--md-sys-color-on-surface) 38%);
   border-color: color-mix(in srgb, transparent, var(--md-sys-color-on-surface) 12%);
   background-color: color-mix(in srgb, transparent, var(--md-sys-color-on-surface) 4%);
 }
-.input-field input:focus:not([readonly]) + label, .input-field textarea:focus:not([readonly]) + label {
+.input-field input:not([type=checkbox]):not([type=radio]):focus:not([readonly]) + label, .input-field textarea:focus:not([readonly]) + label {
   color: var(--input-color);
 }
-.input-field input:not(:-moz-placeholder) + label, .input-field textarea:not(:-moz-placeholder) + label {
+.input-field input:not([type=checkbox]):not([type=radio]):not(:-moz-placeholder) + label, .input-field textarea:not(:-moz-placeholder) + label {
   transform: scale(0.75);
   top: 8px;
 }
-.input-field input:not(:-ms-input-placeholder) + label, .input-field textarea:not(:-ms-input-placeholder) + label {
+.input-field input:not([type=checkbox]):not([type=radio]):not(:-ms-input-placeholder) + label, .input-field textarea:not(:-ms-input-placeholder) + label {
   transform: scale(0.75);
   top: 8px;
 }
-.input-field input:focus:not([readonly]) + label, .input-field input:not([placeholder=" "]) + label, .input-field input:not(:placeholder-shown) + label, .input-field textarea:focus:not([readonly]) + label, .input-field textarea:not([placeholder=" "]) + label, .input-field textarea:not(:placeholder-shown) + label {
+.input-field input:not([type=checkbox]):not([type=radio]):focus:not([readonly]) + label, .input-field input:not([type=checkbox]):not([type=radio]):not([placeholder=" "]) + label, .input-field input:not([type=checkbox]):not([type=radio]):not(:placeholder-shown) + label, .input-field textarea:focus:not([readonly]) + label, .input-field textarea:not([placeholder=" "]) + label, .input-field textarea:not(:placeholder-shown) + label {
   -webkit-transform: scale(0.75);
           transform: scale(0.75);
   top: 8px;
 }
-.input-field input:disabled + label, .input-field input[readonly=readonly] + label, .input-field textarea:disabled + label, .input-field textarea[readonly=readonly] + label {
+.input-field input:not([type=checkbox]):not([type=radio]):disabled + label, .input-field input:not([type=checkbox]):not([type=radio])[readonly=readonly] + label, .input-field textarea:disabled + label, .input-field textarea[readonly=readonly] + label {
   color: color-mix(in srgb, transparent, var(--md-sys-color-on-surface) 38%);
 }
-.input-field input.invalid ~ label, .input-field input:focus.invalid ~ label, .input-field textarea.invalid ~ label, .input-field textarea:focus.invalid ~ label {
+.input-field input:not([type=checkbox]):not([type=radio]).invalid ~ label, .input-field input:not([type=checkbox]):not([type=radio]):focus.invalid ~ label, .input-field textarea.invalid ~ label, .input-field textarea:focus.invalid ~ label {
   color: var(--md-sys-color-error);
 }
 .input-field input::-webkit-input-placeholder {
@@ -9514,49 +9456,49 @@ textarea.materialize-textarea {
 .input-field .prefix ~ label {
   left: 52px;
 }
-.input-field.outlined input, .input-field.outlined textarea {
+.input-field.outlined input:not([type=checkbox]):not([type=radio]), .input-field.outlined textarea {
   padding-top: 0;
   background-color: transparent;
   border: 1px solid var(--md-sys-color-on-surface-variant);
   border-radius: 4px;
 }
-.input-field.outlined input:focus:not([readonly]), .input-field.outlined textarea:focus:not([readonly]) {
+.input-field.outlined input:not([type=checkbox]):not([type=radio]):focus:not([readonly]), .input-field.outlined textarea:focus:not([readonly]) {
   border: 2px solid var(--input-color);
   padding-top: 0;
   margin-left: -1px;
 }
-.input-field.outlined input:focus:not([readonly]) + label, .input-field.outlined textarea:focus:not([readonly]) + label {
+.input-field.outlined input:not([type=checkbox]):not([type=radio]):focus:not([readonly]) + label, .input-field.outlined textarea:focus:not([readonly]) + label {
   color: var(--input-color);
 }
-.input-field.outlined input:not(:-moz-placeholder) + label, .input-field.outlined textarea:not(:-moz-placeholder) + label {
+.input-field.outlined input:not([type=checkbox]):not([type=radio]):not(:-moz-placeholder) + label, .input-field.outlined textarea:not(:-moz-placeholder) + label {
   top: -8px;
   left: 16px;
   margin-left: -4px;
   padding: 0 4px;
   background-color: var(--md-sys-color-surface);
 }
-.input-field.outlined input:not(:-ms-input-placeholder) + label, .input-field.outlined textarea:not(:-ms-input-placeholder) + label {
+.input-field.outlined input:not([type=checkbox]):not([type=radio]):not(:-ms-input-placeholder) + label, .input-field.outlined textarea:not(:-ms-input-placeholder) + label {
   top: -8px;
   left: 16px;
   margin-left: -4px;
   padding: 0 4px;
   background-color: var(--md-sys-color-surface);
 }
-.input-field.outlined input:focus:not([readonly]) + label, .input-field.outlined input:not([placeholder=" "]) + label, .input-field.outlined input:not(:placeholder-shown) + label, .input-field.outlined textarea:focus:not([readonly]) + label, .input-field.outlined textarea:not([placeholder=" "]) + label, .input-field.outlined textarea:not(:placeholder-shown) + label {
+.input-field.outlined input:not([type=checkbox]):not([type=radio]):focus:not([readonly]) + label, .input-field.outlined input:not([type=checkbox]):not([type=radio]):not([placeholder=" "]) + label, .input-field.outlined input:not([type=checkbox]):not([type=radio]):not(:placeholder-shown) + label, .input-field.outlined textarea:focus:not([readonly]) + label, .input-field.outlined textarea:not([placeholder=" "]) + label, .input-field.outlined textarea:not(:placeholder-shown) + label {
   top: -8px;
   left: 16px;
   margin-left: -4px;
   padding: 0 4px;
   background-color: var(--md-sys-color-surface);
 }
-.input-field.outlined input:disabled, .input-field.outlined input[readonly=readonly], .input-field.outlined textarea:disabled, .input-field.outlined textarea[readonly=readonly] {
+.input-field.outlined input:not([type=checkbox]):not([type=radio]):disabled, .input-field.outlined input:not([type=checkbox]):not([type=radio])[readonly=readonly], .input-field.outlined textarea:disabled, .input-field.outlined textarea[readonly=readonly] {
   color: color-mix(in srgb, transparent, var(--md-sys-color-on-surface) 38%);
   border-color: color-mix(in srgb, transparent, var(--md-sys-color-on-surface) 12%);
 }
 .input-field.error {
   background-color: transparent;
 }
-.input-field.error input, .input-field.error textarea {
+.input-field.error input:not([type=checkbox]):not([type=radio]), .input-field.error textarea {
   border-color: var(--md-sys-color-error);
 }
 .input-field.error input:focus:not([readonly]), .input-field.error textarea:focus:not([readonly]) {
@@ -10323,4 +10265,64 @@ fieldset.form-field:has([required]) legend::after {
 
 fieldset.form-field:has([required]) label::after {
   content: " *";
+}
+
+.pulse {
+  overflow: visible;
+  position: relative;
+  &::before {
+    content: "";
+    display: block;
+    position: absolute;
+    pointer-events: none;
+    width: 100%;
+    height: 100%;
+    top: 0;
+    left: 0;
+    background-color: inherit;
+    border-radius: inherit;
+    -webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
+    transition: opacity 0.3s, -webkit-transform 0.3s;
+    transition: opacity 0.3s, transform 0.3s;
+    transition: opacity 0.3s, transform 0.3s, -webkit-transform 0.3s;
+    -webkit-animation: pulse-animation 1s cubic-bezier(0.24, 0, 0.38, 1) infinite;
+            animation: pulse-animation 1s cubic-bezier(0.24, 0, 0.38, 1) infinite;
+    z-index: -1;
+  }
+}
+
+@-webkit-keyframes pulse-animation {
+  0% {
+    opacity: 1;
+    -webkit-transform: scale(1);
+            transform: scale(1);
+  }
+  50% {
+    opacity: 0;
+    -webkit-transform: scale(1.5);
+            transform: scale(1.5);
+  }
+  100% {
+    opacity: 0;
+    -webkit-transform: scale(1.5);
+            transform: scale(1.5);
+  }
+}
+
+@keyframes pulse-animation {
+  0% {
+    opacity: 1;
+    -webkit-transform: scale(1);
+            transform: scale(1);
+  }
+  50% {
+    opacity: 0;
+    -webkit-transform: scale(1.5);
+            transform: scale(1.5);
+  }
+  100% {
+    opacity: 0;
+    -webkit-transform: scale(1.5);
+            transform: scale(1.5);
+  }
 }