matcha-core 1.1.3 → 1.1.5

package/core.scss

@@ -1054,90 +1054,71 @@ $helper-breakpoints: (
 }
 @include generate-border-size-classes($helper-breakpoints);
 
+
 // -----------------------------------------------------------------------------------------------------
-// @ Border Radius Helpers
+// @ Border Size Helpers
 // -----------------------------------------------------------------------------------------------------
-@mixin generate-border-radius-classes($helper-breakpoints) {
-    // Aplicar os mixins para cada breakpoint
-    @for $i from 0 through 8 {
-        $radius-value: $i * 2;
-        $radius-suffix: "-#{$radius-value}";
-
-        .radius#{$radius-suffix} {
-            border-radius: #{$radius-value}px; // Sem !important
-        }
-
-        .radius#{$radius-suffix}--force {
-            border-radius: #{$radius-value}px !important; // Com !important
-        }
-    }
-    // Classes para todos os cantos e para formatos especiais
-    .radius-circle,
-    .radius-full,
-    .radius-round {
-        border-radius: 999px !important;
-    }
+@mixin generate-radius-classes($helper-breakpoints){
+    $radius-directions: (bottom: b, top: t, left: l, right: r);
 
     @each $breakpoint, $materialBreakpoint in $helper-breakpoints {
         @include media-breakpoint($materialBreakpoint) {
-            // Define o sufixo do breakpoint
-            $infix: if($breakpoint == null, "", "-#{$breakpoint}");
+            $infix: if($materialBreakpoint == null, "", "-#{$breakpoint}");
 
-            @each $direction in (bottom, top, left, right) {
-                // Seletores para as classes de borda
-                $direction-selector: unquote(".radius#{$infix}-#{$direction}");
+            @for $i from 0 through 8 {
+                $radius-value: $i * 2;
+                $radius-suffix: "-#{$radius-value}";
 
-                // Aplica o raio dependendo da direção
-                @for $i from 0 through 8 {
-                    $radius-value: $i * 2;
-                    $radius-suffix: "-#{$radius-value}";
+                // Classes para borda geral
+                .radius#{$infix}#{$radius-suffix} {
+                    border-radius: #{$radius-value}px; // Sem !important
+                }
 
+                // Classes para bordas individuais
+                @each $direction, $abbrev in $radius-directions {
                     @if $direction == bottom {
-                        #{$direction-selector}#{$radius-suffix} {
+                        .radius#{$infix}-#{$direction}#{$radius-suffix} {
                             border-radius: 0 0 #{$radius-value}px #{$radius-value}px; // Sem !important
                         }
 
-                        #{$direction-selector}#{$radius-suffix}--force {
+                        .radius#{$infix}-#{$direction}#{$radius-suffix}--force {
                             border-radius: 0 0 #{$radius-value}px #{$radius-value}px !important; // Com !important
                         }
                     } @else if $direction == top {
-                        #{$direction-selector}#{$radius-suffix} {
+                        .radius#{$infix}-#{$direction}#{$radius-suffix} {
                             border-radius: #{$radius-value}px #{$radius-value}px 0 0; // Sem !important
                         }
 
-                        #{$direction-selector}#{$radius-suffix}--force {
+                        .radius#{$infix}-#{$direction}#{$radius-suffix}--force {
                             border-radius: #{$radius-value}px #{$radius-value}px 0 0 !important; // Com !important
                         }
                     } @else if $direction == left {
-                        #{$direction-selector}#{$radius-suffix} {
+                        .radius#{$infix}-#{$direction}#{$radius-suffix} {
                             border-radius: #{$radius-value}px 0 0 #{$radius-value}px; // Sem !important
                         }
 
-                        #{$direction-selector}#{$radius-suffix}--force {
+                        .radius#{$infix}-#{$direction}#{$radius-suffix}--force {
                             border-radius: #{$radius-value}px 0 0 #{$radius-value}px !important; // Com !important
                         }
                     } @else if $direction == right {
-                        #{$direction-selector}#{$radius-suffix} {
+                        .radius#{$infix}-#{$direction}#{$radius-suffix} {
                             border-radius: 0 #{$radius-value}px #{$radius-value}px 0; // Sem !important
                         }
 
-                        #{$direction-selector}#{$radius-suffix}--force {
+                        .radius#{$infix}-#{$direction}#{$radius-suffix}--force {
                             border-radius: 0 #{$radius-value}px #{$radius-value}px 0 !important; // Com !important
                         }
                     }
                 }
             }
-
-            // Classes para todos os cantos e para formatos especiais
-            .radius#{$infix}-circle,
-            .radius#{$infix}-full,
-            .radius#{$infix}-round {
-                border-radius: 999px !important;
-            }
         }
     }
+    // Classe para borda nula
+    .border-none {
+        border: none !important;
+    }
 }
-@include generate-border-radius-classes($helper-breakpoints);
+@include generate-radius-classes($helper-breakpoints);
 
 // -----------------------------------------------------------------------------------------------------
 // @ Hover - Show/Hide