valtech-components 2.0.746 → 2.0.748

package/lib/components/organisms/article/article.component.d.ts

@@ -90,7 +90,7 @@ export declare class ArticleComponent implements OnInit {
         contentInterpolation?: Record<string, string | number>;
         icon?: import("valtech-components").IconMetada;
         shape?: "round";
-        size?: "default" | "small" | "large";
+        size?: "small" | "large" | "default";
         fill?: "default" | "clear" | "outline" | "solid";
         type: "button" | "submit" | "reset";
         token?: string;

package/lib/components/organisms/toolbar/toolbar.component.d.ts

@@ -72,7 +72,7 @@ export declare class ToolbarComponent implements OnInit {
         };
         showFlags?: boolean;
         color: import("@ionic/core").Color;
-        size?: "default" | "small" | "large";
+        size?: "small" | "large" | "default";
         fill?: "default" | "clear" | "outline" | "solid";
         shape?: "round";
         expand?: "full" | "block";

package/lib/version.d.ts

@@ -2,4 +2,4 @@
  * Current version of valtech-components.
  * This is automatically updated during the publish process.
  */
-export declare const VERSION = "2.0.746";
+export declare const VERSION = "2.0.748";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "valtech-components",
-  "version": "2.0.746",
+  "version": "2.0.748",
   "private": false,
   "bin": {
     "valtech-firebase-config": "./src/lib/services/firebase/scripts/generate-sw-config.js"

package/src/lib/components/styles/_docs-page.scss

@@ -54,7 +54,9 @@
     color: #555;
     margin-bottom: 0.75rem;
 
-    @media (prefers-color-scheme: dark) {
+    body.dark &,
+    html.ion-palette-dark &,
+    body[data-theme='dark'] & {
       background: rgba(255, 255, 255, 0.1);
       color: #aaa;
     }
@@ -147,7 +149,9 @@
     font-family: 'SF Mono', 'Fira Code', Consolas, monospace;
     font-size: 0.875em;
 
-    @media (prefers-color-scheme: dark) {
+    body.dark &,
+    html.ion-palette-dark &,
+    body[data-theme='dark'] & {
       background: rgba(255, 255, 255, 0.1);
     }
   }
@@ -160,7 +164,9 @@
     overflow-x: auto;
     margin: 0 0 1rem 0;
 
-    @media (prefers-color-scheme: dark) {
+    body.dark &,
+    html.ion-palette-dark &,
+    body[data-theme='dark'] & {
       background: rgba(255, 255, 255, 0.06);
     }
 
@@ -184,7 +190,9 @@
     text-align: left;
     border-bottom: 1px solid rgba(0, 0, 0, 0.1);
 
-    @media (prefers-color-scheme: dark) {
+    body.dark &,
+    html.ion-palette-dark &,
+    body[data-theme='dark'] & {
       border-color: rgba(255, 255, 255, 0.1);
     }
   }
@@ -193,7 +201,9 @@
     font-weight: 600;
     background: rgba(0, 0, 0, 0.02);
 
-    @media (prefers-color-scheme: dark) {
+    body.dark &,
+    html.ion-palette-dark &,
+    body[data-theme='dark'] & {
       background: rgba(255, 255, 255, 0.04);
     }
   }
@@ -206,7 +216,9 @@
     background: rgba(0, 0, 0, 0.02);
     border-radius: 0 8px 8px 0;
 
-    @media (prefers-color-scheme: dark) {
+    body.dark &,
+    html.ion-palette-dark &,
+    body[data-theme='dark'] & {
       background: rgba(255, 255, 255, 0.04);
     }
 
@@ -228,7 +240,9 @@
     border-top: 1px solid rgba(0, 0, 0, 0.1);
     margin: 2rem 0;
 
-    @media (prefers-color-scheme: dark) {
+    body.dark &,
+    html.ion-palette-dark &,
+    body[data-theme='dark'] & {
       border-color: rgba(255, 255, 255, 0.1);
     }
   }
@@ -303,7 +317,9 @@
     font-family: 'SF Mono', 'Fira Code', Consolas, monospace;
     font-size: 0.875em;
 
-    @media (prefers-color-scheme: dark) {
+    body.dark &,
+    html.ion-palette-dark &,
+    body[data-theme='dark'] & {
       background: rgba(255, 255, 255, 0.1);
     }
   }

package/src/lib/components/styles/alert.scss

@@ -118,7 +118,7 @@ ion-alert.val-alert {
 }
 
 /* Dark mode — class-based (ThemeService toggle `body.dark`/`html.ion-palette-dark`).
-   No usar `@media (prefers-color-scheme: dark)` porque pisaba el manual toggle. */
+   No usar `@include dark-global` porque pisaba el manual toggle. */
 body.dark ion-alert.val-alert,
 html.ion-palette-dark ion-alert.val-alert,
 body[data-theme='dark'] ion-alert.val-alert {

package/src/lib/components/styles/prism.scss

@@ -402,14 +402,16 @@ pre > code.diff-highlight .token.token.inserted:not(.prefix) *::selection {
   fill: transparent;
 }
 
-// dark media query
-@media (prefers-color-scheme: dark) {
-  /**
-   * GitHub Dark theme for Prism.js
-   * Based on GitHub: https://github.com
-   * @author Katorly
-   * Modified: Brighter text for better readability
-   */
+// dark mode — class-based selectors
+/**
+ * GitHub Dark theme for Prism.js
+ * Based on GitHub: https://github.com
+ * @author Katorly
+ * Modified: Brighter text for better readability
+ */
+body.dark,
+html.ion-palette-dark,
+body[data-theme='dark'] {
   /* General */
   pre[class*='language-'],
   code[class*='language-'] {