From 34d780b0b7376139ea749ddbd5035d8bf7765a73 Mon Sep 17 00:00:00 2001 From: Younes ENNAJI Date: Fri, 16 Jan 2026 00:52:20 +0100 Subject: [PATCH] Fix SCSS syntax errors and TypeScript build error - Fix 15 theme SCSS files with orphaned comment closing markers - Add type assertion to notyf.ts for private property access - Regenerate build artifacts after fixes The SCSS files had broken syntax from previous comment removal where orphaned '*/' markers were left behind, causing SCSS parsing errors. --- src/Notyf/Prime/Resources/assets/notyf.ts | 5 +++-- .../Prime/Resources/dist/flasher-notyf.esm.js | 5 +++-- .../Prime/Resources/dist/flasher-notyf.js | 5 +++-- .../Prime/Resources/dist/flasher-notyf.min.js | 2 +- .../Resources/public/flasher-notyf.min.js | 2 +- .../Resources/assets/themes/amber/amber.scss | 14 ------------- .../assets/themes/aurora/aurora.scss | 14 ------------- .../assets/themes/crystal/crystal.scss | 20 ------------------- .../assets/themes/emerald/emerald.scss | 17 ---------------- .../assets/themes/facebook/facebook.scss | 14 ------------- .../assets/themes/google/google.scss | 17 ---------------- .../Resources/assets/themes/ios/ios.scss | 17 ---------------- .../Resources/assets/themes/jade/jade.scss | 14 ------------- .../assets/themes/material/material.scss | 17 ---------------- .../assets/themes/minimal/minimal.scss | 14 ------------- .../Resources/assets/themes/neon/neon.scss | 17 ---------------- .../Resources/assets/themes/onyx/onyx.scss | 14 ------------- .../Resources/assets/themes/ruby/ruby.scss | 14 ------------- .../assets/themes/sapphire/sapphire.scss | 11 ---------- .../Resources/assets/themes/slack/slack.scss | 14 ------------- .../dist/themes/facebook/facebook.esm.js | 2 +- .../dist/themes/facebook/facebook.js | 2 +- .../dist/themes/facebook/facebook.min.js | 2 +- .../public/themes/facebook/facebook.min.js | 2 +- 24 files changed, 15 insertions(+), 240 deletions(-) diff --git a/src/Notyf/Prime/Resources/assets/notyf.ts b/src/Notyf/Prime/Resources/assets/notyf.ts index b609f630..373d2482 100644 --- a/src/Notyf/Prime/Resources/assets/notyf.ts +++ b/src/Notyf/Prime/Resources/assets/notyf.ts @@ -24,8 +24,9 @@ export default class NotyfPlugin extends AbstractPlugin { try { if (this.notyf) { - const container = this.notyf.view.container - const a11yContainer = this.notyf.view.a11yContainer + const view = (this.notyf as unknown as { view: { container: { dataset?: DOMStringMap }; a11yContainer: { dataset?: DOMStringMap } } }).view + const container = view.container + const a11yContainer = view.a11yContainer if (container && container.dataset) { container.dataset.turboTemporary = '' diff --git a/src/Notyf/Prime/Resources/dist/flasher-notyf.esm.js b/src/Notyf/Prime/Resources/dist/flasher-notyf.esm.js index ff370b86..bf7e61d1 100644 --- a/src/Notyf/Prime/Resources/dist/flasher-notyf.esm.js +++ b/src/Notyf/Prime/Resources/dist/flasher-notyf.esm.js @@ -523,8 +523,9 @@ class NotyfPlugin extends AbstractPlugin { }); try { if (this.notyf) { - const container = this.notyf.view.container; - const a11yContainer = this.notyf.view.a11yContainer; + const view = this.notyf.view; + const container = view.container; + const a11yContainer = view.a11yContainer; if (container && container.dataset) { container.dataset.turboTemporary = ''; } diff --git a/src/Notyf/Prime/Resources/dist/flasher-notyf.js b/src/Notyf/Prime/Resources/dist/flasher-notyf.js index 31a4300d..9d5f3109 100644 --- a/src/Notyf/Prime/Resources/dist/flasher-notyf.js +++ b/src/Notyf/Prime/Resources/dist/flasher-notyf.js @@ -527,8 +527,9 @@ }); try { if (this.notyf) { - const container = this.notyf.view.container; - const a11yContainer = this.notyf.view.a11yContainer; + const view = this.notyf.view; + const container = view.container; + const a11yContainer = view.a11yContainer; if (container && container.dataset) { container.dataset.turboTemporary = ''; } diff --git a/src/Notyf/Prime/Resources/dist/flasher-notyf.min.js b/src/Notyf/Prime/Resources/dist/flasher-notyf.min.js index 3ae85b9f..8528c86d 100644 --- a/src/Notyf/Prime/Resources/dist/flasher-notyf.min.js +++ b/src/Notyf/Prime/Resources/dist/flasher-notyf.min.js @@ -1 +1 @@ -!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e(require("@flasher/flasher")):"function"==typeof define&&define.amd?define(["@flasher/flasher"],e):(t="undefined"!=typeof globalThis?globalThis:t||self).notyf=e(t.flasher)}(this,(function(t){"use strict";class e{success(t,e,i){this.flash("success",t,e,i)}error(t,e,i){this.flash("error",t,e,i)}info(t,e,i){this.flash("info",t,e,i)}warning(t,e,i){this.flash("warning",t,e,i)}flash(t,e,i,n){let o,s,a,r={};if("object"==typeof t?(r=Object.assign({},t),o=r.type,s=r.message,a=r.title,delete r.type,delete r.message,delete r.title):"object"==typeof e?(r=Object.assign({},e),o=t,s=r.message,a=r.title,delete r.message,delete r.title):(o=t,s=e,null==i?(a=void 0,r=n||{}):"string"==typeof i?(a=i,r=n||{}):"object"==typeof i&&(r=Object.assign({},i),"title"in r?(a=r.title,delete r.title):a=void 0,n&&"object"==typeof n&&(r=Object.assign(Object.assign({},r),n)))),!o)throw new Error("Type is required for notifications");if(null==s)throw new Error("Message is required for notifications");null==a&&(a=o.charAt(0).toUpperCase()+o.slice(1));const c={type:o,message:s,title:a,options:r,metadata:{plugin:""}};this.renderOptions({}),this.renderEnvelopes([c])}}var i,n=function(){return n=Object.assign||function(t){for(var e,i=1,n=arguments.length;i{var e;try{const i=Object.assign(Object.assign({},t),t.options);null===(e=this.notyf)||void 0===e||e.open(i)}catch(e){console.error("PHPFlasher Notyf: Error rendering notification",e,t)}}));try{if(this.notyf){const t=this.notyf.view.container,e=this.notyf.view.a11yContainer;t&&t.dataset&&(t.dataset.turboTemporary=""),e&&e.dataset&&(e.dataset.turboTemporary="")}}catch(t){console.error("PHPFlasher Notyf: Error setting Turbo compatibility",t)}}renderOptions(t){if(!t)return;const e=Object.assign({duration:t.duration||1e4},t);e.types=e.types||[],this.addTypeIfNotExists(e.types,{type:"info",className:"notyf__toast--info",background:"#5784E5",icon:{className:"notyf__icon--info",tagName:"i"}}),this.addTypeIfNotExists(e.types,{type:"warning",className:"notyf__toast--warning",background:"#E3A008",icon:{className:"notyf__icon--warning",tagName:"i"}}),this.notyf=this.notyf||new p(e)}initializeNotyf(){this.notyf||this.renderOptions({duration:1e4,position:{x:"right",y:"top"},dismissible:!0})}addTypeIfNotExists(t,e){t.some((t=>t.type===e.type))||t.push(e)}};return t.addPlugin("notyf",f),f})); +!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e(require("@flasher/flasher")):"function"==typeof define&&define.amd?define(["@flasher/flasher"],e):(t="undefined"!=typeof globalThis?globalThis:t||self).notyf=e(t.flasher)}(this,(function(t){"use strict";class e{success(t,e,i){this.flash("success",t,e,i)}error(t,e,i){this.flash("error",t,e,i)}info(t,e,i){this.flash("info",t,e,i)}warning(t,e,i){this.flash("warning",t,e,i)}flash(t,e,i,n){let o,s,a,r={};if("object"==typeof t?(r=Object.assign({},t),o=r.type,s=r.message,a=r.title,delete r.type,delete r.message,delete r.title):"object"==typeof e?(r=Object.assign({},e),o=t,s=r.message,a=r.title,delete r.message,delete r.title):(o=t,s=e,null==i?(a=void 0,r=n||{}):"string"==typeof i?(a=i,r=n||{}):"object"==typeof i&&(r=Object.assign({},i),"title"in r?(a=r.title,delete r.title):a=void 0,n&&"object"==typeof n&&(r=Object.assign(Object.assign({},r),n)))),!o)throw new Error("Type is required for notifications");if(null==s)throw new Error("Message is required for notifications");null==a&&(a=o.charAt(0).toUpperCase()+o.slice(1));const c={type:o,message:s,title:a,options:r,metadata:{plugin:""}};this.renderOptions({}),this.renderEnvelopes([c])}}var i,n=function(){return n=Object.assign||function(t){for(var e,i=1,n=arguments.length;i{var e;try{const i=Object.assign(Object.assign({},t),t.options);null===(e=this.notyf)||void 0===e||e.open(i)}catch(e){console.error("PHPFlasher Notyf: Error rendering notification",e,t)}}));try{if(this.notyf){const t=this.notyf.view,e=t.container,i=t.a11yContainer;e&&e.dataset&&(e.dataset.turboTemporary=""),i&&i.dataset&&(i.dataset.turboTemporary="")}}catch(t){console.error("PHPFlasher Notyf: Error setting Turbo compatibility",t)}}renderOptions(t){if(!t)return;const e=Object.assign({duration:t.duration||1e4},t);e.types=e.types||[],this.addTypeIfNotExists(e.types,{type:"info",className:"notyf__toast--info",background:"#5784E5",icon:{className:"notyf__icon--info",tagName:"i"}}),this.addTypeIfNotExists(e.types,{type:"warning",className:"notyf__toast--warning",background:"#E3A008",icon:{className:"notyf__icon--warning",tagName:"i"}}),this.notyf=this.notyf||new p(e)}initializeNotyf(){this.notyf||this.renderOptions({duration:1e4,position:{x:"right",y:"top"},dismissible:!0})}addTypeIfNotExists(t,e){t.some((t=>t.type===e.type))||t.push(e)}};return t.addPlugin("notyf",l),l})); diff --git a/src/Notyf/Prime/Resources/public/flasher-notyf.min.js b/src/Notyf/Prime/Resources/public/flasher-notyf.min.js index 3ae85b9f..8528c86d 100644 --- a/src/Notyf/Prime/Resources/public/flasher-notyf.min.js +++ b/src/Notyf/Prime/Resources/public/flasher-notyf.min.js @@ -1 +1 @@ -!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e(require("@flasher/flasher")):"function"==typeof define&&define.amd?define(["@flasher/flasher"],e):(t="undefined"!=typeof globalThis?globalThis:t||self).notyf=e(t.flasher)}(this,(function(t){"use strict";class e{success(t,e,i){this.flash("success",t,e,i)}error(t,e,i){this.flash("error",t,e,i)}info(t,e,i){this.flash("info",t,e,i)}warning(t,e,i){this.flash("warning",t,e,i)}flash(t,e,i,n){let o,s,a,r={};if("object"==typeof t?(r=Object.assign({},t),o=r.type,s=r.message,a=r.title,delete r.type,delete r.message,delete r.title):"object"==typeof e?(r=Object.assign({},e),o=t,s=r.message,a=r.title,delete r.message,delete r.title):(o=t,s=e,null==i?(a=void 0,r=n||{}):"string"==typeof i?(a=i,r=n||{}):"object"==typeof i&&(r=Object.assign({},i),"title"in r?(a=r.title,delete r.title):a=void 0,n&&"object"==typeof n&&(r=Object.assign(Object.assign({},r),n)))),!o)throw new Error("Type is required for notifications");if(null==s)throw new Error("Message is required for notifications");null==a&&(a=o.charAt(0).toUpperCase()+o.slice(1));const c={type:o,message:s,title:a,options:r,metadata:{plugin:""}};this.renderOptions({}),this.renderEnvelopes([c])}}var i,n=function(){return n=Object.assign||function(t){for(var e,i=1,n=arguments.length;i{var e;try{const i=Object.assign(Object.assign({},t),t.options);null===(e=this.notyf)||void 0===e||e.open(i)}catch(e){console.error("PHPFlasher Notyf: Error rendering notification",e,t)}}));try{if(this.notyf){const t=this.notyf.view.container,e=this.notyf.view.a11yContainer;t&&t.dataset&&(t.dataset.turboTemporary=""),e&&e.dataset&&(e.dataset.turboTemporary="")}}catch(t){console.error("PHPFlasher Notyf: Error setting Turbo compatibility",t)}}renderOptions(t){if(!t)return;const e=Object.assign({duration:t.duration||1e4},t);e.types=e.types||[],this.addTypeIfNotExists(e.types,{type:"info",className:"notyf__toast--info",background:"#5784E5",icon:{className:"notyf__icon--info",tagName:"i"}}),this.addTypeIfNotExists(e.types,{type:"warning",className:"notyf__toast--warning",background:"#E3A008",icon:{className:"notyf__icon--warning",tagName:"i"}}),this.notyf=this.notyf||new p(e)}initializeNotyf(){this.notyf||this.renderOptions({duration:1e4,position:{x:"right",y:"top"},dismissible:!0})}addTypeIfNotExists(t,e){t.some((t=>t.type===e.type))||t.push(e)}};return t.addPlugin("notyf",f),f})); +!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e(require("@flasher/flasher")):"function"==typeof define&&define.amd?define(["@flasher/flasher"],e):(t="undefined"!=typeof globalThis?globalThis:t||self).notyf=e(t.flasher)}(this,(function(t){"use strict";class e{success(t,e,i){this.flash("success",t,e,i)}error(t,e,i){this.flash("error",t,e,i)}info(t,e,i){this.flash("info",t,e,i)}warning(t,e,i){this.flash("warning",t,e,i)}flash(t,e,i,n){let o,s,a,r={};if("object"==typeof t?(r=Object.assign({},t),o=r.type,s=r.message,a=r.title,delete r.type,delete r.message,delete r.title):"object"==typeof e?(r=Object.assign({},e),o=t,s=r.message,a=r.title,delete r.message,delete r.title):(o=t,s=e,null==i?(a=void 0,r=n||{}):"string"==typeof i?(a=i,r=n||{}):"object"==typeof i&&(r=Object.assign({},i),"title"in r?(a=r.title,delete r.title):a=void 0,n&&"object"==typeof n&&(r=Object.assign(Object.assign({},r),n)))),!o)throw new Error("Type is required for notifications");if(null==s)throw new Error("Message is required for notifications");null==a&&(a=o.charAt(0).toUpperCase()+o.slice(1));const c={type:o,message:s,title:a,options:r,metadata:{plugin:""}};this.renderOptions({}),this.renderEnvelopes([c])}}var i,n=function(){return n=Object.assign||function(t){for(var e,i=1,n=arguments.length;i{var e;try{const i=Object.assign(Object.assign({},t),t.options);null===(e=this.notyf)||void 0===e||e.open(i)}catch(e){console.error("PHPFlasher Notyf: Error rendering notification",e,t)}}));try{if(this.notyf){const t=this.notyf.view,e=t.container,i=t.a11yContainer;e&&e.dataset&&(e.dataset.turboTemporary=""),i&&i.dataset&&(i.dataset.turboTemporary="")}}catch(t){console.error("PHPFlasher Notyf: Error setting Turbo compatibility",t)}}renderOptions(t){if(!t)return;const e=Object.assign({duration:t.duration||1e4},t);e.types=e.types||[],this.addTypeIfNotExists(e.types,{type:"info",className:"notyf__toast--info",background:"#5784E5",icon:{className:"notyf__icon--info",tagName:"i"}}),this.addTypeIfNotExists(e.types,{type:"warning",className:"notyf__toast--warning",background:"#E3A008",icon:{className:"notyf__icon--warning",tagName:"i"}}),this.notyf=this.notyf||new p(e)}initializeNotyf(){this.notyf||this.renderOptions({duration:1e4,position:{x:"right",y:"top"},dismissible:!0})}addTypeIfNotExists(t,e){t.some((t=>t.type===e.type))||t.push(e)}};return t.addPlugin("notyf",l),l})); diff --git a/src/Prime/Resources/assets/themes/amber/amber.scss b/src/Prime/Resources/assets/themes/amber/amber.scss index c88bec22..a1e58a8e 100644 --- a/src/Prime/Resources/assets/themes/amber/amber.scss +++ b/src/Prime/Resources/assets/themes/amber/amber.scss @@ -1,8 +1,3 @@ - */ - * Amber Theme Variables - * - * Custom properties that define the appearance of Amber theme notifications. - */ .fl-amber { /* Base colors and appearance */ --amber-bg-light: #ffffff; /* Light mode background */ @@ -18,9 +13,6 @@ --amber-warning: #f59e0b; /* Warning color (orange) */ --amber-error: #ef4444; /* Error color (red) */ } - * Entrance animation for Amber theme - * Slides in from the top with a subtle fade effect - */ @keyframes amberIn { from { opacity: 0; @@ -31,9 +23,6 @@ transform: translateY(0); } } - * Base Amber theme styling - * Defines the core appearance and behavior of notifications - */ .fl-amber { background-color: var(--amber-bg-light); color: var(--amber-text-light); @@ -166,9 +155,6 @@ animation: none; } } - * Dark mode support - * Applies dark theme colors when in dark mode - */ body.fl-dark .fl-amber, html.fl-dark .fl-amber, .fl-amber.fl-auto-dark { diff --git a/src/Prime/Resources/assets/themes/aurora/aurora.scss b/src/Prime/Resources/assets/themes/aurora/aurora.scss index e956321c..8fba1c0d 100644 --- a/src/Prime/Resources/assets/themes/aurora/aurora.scss +++ b/src/Prime/Resources/assets/themes/aurora/aurora.scss @@ -1,9 +1,3 @@ - */ - * PHPFlasher - Aurora Theme - * - * Elegant notifications with subtle gradients, backdrop blur, and soft edges. - * Features a modern "glass morphism" style with translucent backgrounds. - */ .fl-aurora { /* Theme variables - Defines the visual appearance of Aurora notifications */ /* Base colors and appearance */ @@ -26,9 +20,6 @@ --aurora-warning: #f59e0b; /* Warning color (orange) */ --aurora-error: #ef4444; /* Error color (red) */ } - * Entrance animation for Aurora theme - * Combines fade-in with a subtle scale effect - */ @keyframes auroraFadeIn { from { opacity: 0; @@ -39,8 +30,6 @@ transform: translateY(0) scale(1); /* End at full size */ } } - * Base Aurora theme styling - */ .fl-aurora { /* Core appearance */ background-color: var(--aurora-bg-light); @@ -179,9 +168,6 @@ animation: none; /* Disable animation */ } } - * Dark mode support - * Different styling when in dark mode - */ body.fl-dark .fl-aurora, html.fl-dark .fl-aurora, .fl-aurora.fl-auto-dark { diff --git a/src/Prime/Resources/assets/themes/crystal/crystal.scss b/src/Prime/Resources/assets/themes/crystal/crystal.scss index f5aeab37..a929ddda 100644 --- a/src/Prime/Resources/assets/themes/crystal/crystal.scss +++ b/src/Prime/Resources/assets/themes/crystal/crystal.scss @@ -1,12 +1,3 @@ - */ - * PHPFlasher - Crystal Theme - * - * A clean, elegant notification theme with subtle animations - * and a focus on simplicity and readability. - */ - * Theme-specific variables - * Define the color palette and styling attributes for Crystal theme - */ .fl-crystal { /* Base colors for light and dark modes */ --crystal-bg-light: #ffffff; /* Pure white background in light mode */ @@ -17,9 +8,6 @@ --crystal-shadow: rgba(0, 0, 0, 0.08); /* Subtle shadow for light mode */ --crystal-shadow-dark: rgba(0, 0, 0, 0.25); /* Stronger shadow for dark mode */ } - * Entrance animation - * Slides in from the top with a fade effect - */ @keyframes crystalIn { from { opacity: 0; @@ -30,9 +18,6 @@ transform: translateY(0); /* End at natural position */ } } - * Hover animation - * Creates a subtle pulsing shadow effect - */ @keyframes crystalPulse { 0% { box-shadow: 0 2px 8px var(--crystal-shadow); /* Start with normal shadow */ @@ -44,8 +29,6 @@ box-shadow: 0 2px 8px var(--crystal-shadow); /* Return to normal shadow */ } } - * Base Crystal theme styling - */ .fl-crystal { position: relative; background: var(--crystal-bg-light, var(--fl-bg-light)); @@ -184,9 +167,6 @@ } } } - * Dark mode support - * Different styling when in dark mode - */ body.fl-dark .fl-crystal, html.fl-dark .fl-crystal, .fl-crystal.fl-auto-dark { diff --git a/src/Prime/Resources/assets/themes/emerald/emerald.scss b/src/Prime/Resources/assets/themes/emerald/emerald.scss index c4e5cf6f..deb5d68d 100644 --- a/src/Prime/Resources/assets/themes/emerald/emerald.scss +++ b/src/Prime/Resources/assets/themes/emerald/emerald.scss @@ -1,12 +1,3 @@ - */ - * PHPFlasher - Emerald Theme - * - * An elegant, minimalist theme with glass-like appearance and bounce animation. - * Features translucent backgrounds with blur effects and colored text. - */ - * Theme-specific variables - * Define the color palette and styling attributes for Emerald theme - */ .fl-emerald { /* Base colors and appearance */ --emerald-bg-light: rgba(255, 255, 255); /* Semi-transparent white background */ @@ -21,9 +12,6 @@ --emerald-warning: var(--warning-color, #f39c12); /* Orange for warnings */ --emerald-info: var(--info-color, #3498db); /* Blue for information */ } - * Entrance animation with bounce effect - * Combines scaling and vertical movement for a dynamic entrance - */ @keyframes emeraldIn { 0% { opacity: 0; @@ -38,8 +26,6 @@ transform: scale(1) translateY(0); /* Settle at final size and position */ } } - * Base Emerald theme styling - */ .fl-emerald { position: relative; background: var(--emerald-bg-light); /* Semi-transparent background */ @@ -127,9 +113,6 @@ animation: none; /* Disable animation */ } } - * Dark mode support - * Different styling when in dark mode - */ body.fl-dark .fl-emerald, html.fl-dark .fl-emerald, .fl-emerald.fl-auto-dark { diff --git a/src/Prime/Resources/assets/themes/facebook/facebook.scss b/src/Prime/Resources/assets/themes/facebook/facebook.scss index e78b264c..f129d532 100644 --- a/src/Prime/Resources/assets/themes/facebook/facebook.scss +++ b/src/Prime/Resources/assets/themes/facebook/facebook.scss @@ -1,9 +1,3 @@ - */ - * PHPFlasher - Facebook Theme - * - * Classic notifications inspired by Facebook's instantly recognizable interface. - * Familiar to billions of users worldwide. - */ .fl-facebook { /* Theme variables - Define the visual appearance of Facebook notifications */ /* Base colors for light and dark modes */ @@ -38,9 +32,6 @@ /* Animation timing */ --fb-animation-duration: 0.2s; /* Duration for entrance animation */ } - * Entrance animation for Facebook theme - * Slides in from above with a fade effect - */ @keyframes fbFadeIn { from { opacity: 0; @@ -51,8 +42,6 @@ transform: translateY(0); /* End at natural position */ } } - * Base Facebook theme styling - */ .fl-facebook { position: relative; margin: 8px 0; /* Spacing between notifications */ @@ -226,9 +215,6 @@ animation: none; /* Disable animation */ } } - * Dark mode support - * Different styling when in dark mode - */ body.fl-dark .fl-facebook, html.fl-dark .fl-facebook, .fl-facebook.fl-auto-dark { diff --git a/src/Prime/Resources/assets/themes/google/google.scss b/src/Prime/Resources/assets/themes/google/google.scss index da2dd956..c1f210a0 100644 --- a/src/Prime/Resources/assets/themes/google/google.scss +++ b/src/Prime/Resources/assets/themes/google/google.scss @@ -1,9 +1,3 @@ - */ - * PHPFlasher - Google Theme - * - * Google's Material Design-inspired notifications. - * One of the most recognized design systems worldwide. - */ .fl-google { /* Theme variables - Define the visual appearance of Material Design notifications */ /* Base colors and appearance for light and dark modes */ @@ -30,9 +24,6 @@ --md-animation-duration: 0.3s; /* Standard Material motion duration */ --md-ripple-duration: 0.6s; /* Ripple effect duration */ } - * Entrance animation for Google theme - * Material Design-style slide up with easing - */ @keyframes mdSlideUp { 0% { opacity: 0; @@ -43,17 +34,12 @@ transform: translateY(0); /* End at final position */ } } - * Material Design ripple effect animation - * Creates expanding circle from point of interaction - */ @keyframes mdRipple { to { transform: scale(4); /* Expand to 4x original size */ opacity: 0; /* Fade out completely */ } } - * Base Google Material Design theme styling - */ .fl-google { position: relative; margin: 8px 0; /* Spacing between notifications */ @@ -264,9 +250,6 @@ } } } - * Dark mode support - * Material Design dark theme implementation - */ body.fl-dark .fl-google, html.fl-dark .fl-google, .fl-google.fl-auto-dark { diff --git a/src/Prime/Resources/assets/themes/ios/ios.scss b/src/Prime/Resources/assets/themes/ios/ios.scss index c162823d..82ce03da 100644 --- a/src/Prime/Resources/assets/themes/ios/ios.scss +++ b/src/Prime/Resources/assets/themes/ios/ios.scss @@ -1,9 +1,3 @@ - */ - * PHPFlasher - iOS Theme - * - * Clean, sleek notifications inspired by Apple's iOS design language. - * Mimics the native notifications seen on iPhone and iPad devices. - */ .fl-ios { /* Theme variables - Define the visual appearance of iOS notifications */ /* Base colors and appearance */ @@ -26,9 +20,6 @@ /* Animation timing */ --ios-animation-duration: 0.4s; /* Duration for entrance animation */ } - * Slide-in entrance animation for iOS theme - * Combines movement, scaling, and fade for realistic iOS appearance - */ @keyframes iosSlideIn { 0% { opacity: 0; @@ -39,9 +30,6 @@ transform: translateY(0) scale(1); /* End at normal size and position */ } } - * Content expansion animation - * Creates a subtle unfold effect for the notification content - */ @keyframes iosExpand { 0% { max-height: 0; /* Start collapsed */ @@ -52,8 +40,6 @@ opacity: 1; /* Fade in */ } } - * Base iOS theme styling - */ .fl-ios { position: relative; margin: 10px 0; /* Space between notifications */ @@ -254,9 +240,6 @@ width: 100%; /* Full width on mobile */ } } - * Dark mode support - * iOS-style dark appearance - */ body.fl-dark .fl-ios, html.fl-dark .fl-ios, .fl-ios.fl-auto-dark { diff --git a/src/Prime/Resources/assets/themes/jade/jade.scss b/src/Prime/Resources/assets/themes/jade/jade.scss index e0173459..79aea7c3 100644 --- a/src/Prime/Resources/assets/themes/jade/jade.scss +++ b/src/Prime/Resources/assets/themes/jade/jade.scss @@ -1,9 +1,3 @@ - */ - * PHPFlasher - Jade Theme - * - * Calm, soothing notification style with elegant minimalism. - * Features soft colors, generous rounded corners, and subtle animations. - */ .fl-jade { /* Theme variables - Define the visual appearance of Jade notifications */ /* Base colors and appearance */ @@ -28,9 +22,6 @@ --jade-warning-bg-dark: rgba(245, 158, 11, 0.15); /* Semi-transparent orange */ --jade-error-bg-dark: rgba(220, 38, 38, 0.15); /* Semi-transparent red */ } - * Entrance animation for Jade theme - * Combines subtle upward movement with scaling for a refined appearance - */ @keyframes jadeIn { 0% { opacity: 0; @@ -41,8 +32,6 @@ transform: translateY(0) scale(1); /* End at normal size and position */ } } - * Base Jade theme styling - */ .fl-jade { padding: 1rem 1.25rem; /* Comfortable padding */ margin: 0.5rem 0; /* Vertical spacing */ @@ -214,9 +203,6 @@ animation: none; /* Disable animation */ } } - * Dark mode support - * Different styling when in dark mode - */ body.fl-dark .fl-jade, html.fl-dark .fl-jade, .fl-jade.fl-auto-dark { diff --git a/src/Prime/Resources/assets/themes/material/material.scss b/src/Prime/Resources/assets/themes/material/material.scss index 0fb8a9c5..041436ad 100644 --- a/src/Prime/Resources/assets/themes/material/material.scss +++ b/src/Prime/Resources/assets/themes/material/material.scss @@ -1,9 +1,3 @@ - */ - * PHPFlasher - Material Design Theme - * - * Google's Material Design-inspired notifications with a minimalist approach. - * Clean and focused implementation of the widely recognized design system. - */ .fl-material { /* Theme variables - Define the visual appearance of Material Design notifications */ /* Base colors and appearance for light and dark modes */ @@ -30,9 +24,6 @@ --md-animation-duration: 0.3s; /* Standard Material motion duration */ --md-ripple-duration: 0.6s; /* Ripple effect duration */ } - * Entrance animation for Material theme - * Material Design-style slide up with easing - */ @keyframes mdSlideUp { 0% { opacity: 0; @@ -43,17 +34,12 @@ transform: translateY(0); /* End at final position */ } } - * Material Design ripple effect animation - * Creates expanding circle from point of interaction - */ @keyframes mdRipple { to { transform: scale(4); /* Expand to 4x original size */ opacity: 0; /* Fade out completely */ } } - * Base Material Design theme styling - */ .fl-material { position: relative; margin: 8px 0; /* Spacing between notifications */ @@ -246,9 +232,6 @@ } } } - * Dark mode support - * Material Design dark theme implementation - */ body.fl-dark .fl-material, html.fl-dark .fl-material, .fl-material.fl-auto-dark { diff --git a/src/Prime/Resources/assets/themes/minimal/minimal.scss b/src/Prime/Resources/assets/themes/minimal/minimal.scss index c7cb5073..4b24d3a1 100644 --- a/src/Prime/Resources/assets/themes/minimal/minimal.scss +++ b/src/Prime/Resources/assets/themes/minimal/minimal.scss @@ -1,9 +1,3 @@ - */ - * PHPFlasher - Minimal Theme - * - * Ultra-clean and minimal notifications that stay out of the way. - * Features semi-transparent backgrounds, subtle blur effects, and compact design. - */ .fl-minimal { /* Theme variables - Define the visual appearance of Minimal notifications */ /* Base colors and appearance */ @@ -22,9 +16,6 @@ --minimal-warning: rgba(245, 158, 11, 0.9); /* Orange with slight transparency */ --minimal-error: rgba(239, 68, 68, 0.9); /* Red with slight transparency */ } - * Entrance animation for Minimal theme - * Quick, subtle slide-in from above - */ @keyframes minimalIn { from { opacity: 0; @@ -35,8 +26,6 @@ transform: translateY(0); /* End at natural position */ } } - * Base Minimal theme styling - */ .fl-minimal { background-color: var(--minimal-bg-light); color: var(--minimal-text-light); @@ -164,9 +153,6 @@ animation: none; /* Disable animation */ } } - * Dark mode support - * Different styling when in dark mode - */ body.fl-dark .fl-minimal, html.fl-dark .fl-minimal, .fl-minimal.fl-auto-dark { diff --git a/src/Prime/Resources/assets/themes/neon/neon.scss b/src/Prime/Resources/assets/themes/neon/neon.scss index e3bf8ad9..4e7ecc1c 100644 --- a/src/Prime/Resources/assets/themes/neon/neon.scss +++ b/src/Prime/Resources/assets/themes/neon/neon.scss @@ -1,9 +1,3 @@ - */ - * PHPFlasher - Neon Theme - * - * Notifications with subtle glowing accents and elegant typography. - * Features frosted glass backgrounds and gentle illumination effects. - */ .fl-neon { /* Theme variables - Define the visual appearance of Neon notifications */ /* Base colors and appearance */ @@ -23,9 +17,6 @@ --neon-glow-strength: 10px; /* How far the glow extends */ --neon-animation-duration: 0.35s; /* Duration for entrance animation */ } - * Entrance animation for Neon theme - * Combines movement, fade, and blur transitions - */ @keyframes neonEntrance { 0% { opacity: 0; @@ -38,9 +29,6 @@ filter: blur(0); /* End with clear focus */ } } - * Pulsing glow animation for the indicator - * Creates a gentle breathing effect for the glow - */ @keyframes neonGlow { 0%, 100% { filter: drop-shadow(0 0 var(--neon-glow-strength) currentColor); /* Full glow */ @@ -49,8 +37,6 @@ filter: drop-shadow(0 0 calc(var(--neon-glow-strength) * 0.7) currentColor); /* Reduced glow */ } } - * Base Neon theme styling - */ .fl-neon { background-color: var(--neon-bg-light); color: var(--neon-text-light); @@ -230,9 +216,6 @@ } } } - * Dark mode support - * Different styling when in dark mode - */ body.fl-dark .fl-neon, html.fl-dark .fl-neon, .fl-neon.fl-auto-dark { diff --git a/src/Prime/Resources/assets/themes/onyx/onyx.scss b/src/Prime/Resources/assets/themes/onyx/onyx.scss index b6078fc6..5f73fc7f 100644 --- a/src/Prime/Resources/assets/themes/onyx/onyx.scss +++ b/src/Prime/Resources/assets/themes/onyx/onyx.scss @@ -1,9 +1,3 @@ - */ - * PHPFlasher - Onyx Theme - * - * Modern notification style with floating appearance and subtle accents. - * Features elegant shadows, accent dots, and smooth animations. - */ .fl-onyx { /* Theme variables - Define the visual appearance of Onyx notifications */ /* Base colors and appearance */ @@ -20,9 +14,6 @@ --onyx-warning: #f59e0b; /* Amber for warning */ --onyx-error: #ef4444; /* Red for error */ } - * Entrance animation for Onyx theme - * Combines upward movement, fade, and blur transitions - */ @keyframes onyxIn { 0% { opacity: 0; @@ -35,8 +26,6 @@ filter: blur(0); /* End with clear focus */ } } - * Base Onyx theme styling - */ .fl-onyx { background-color: var(--onyx-bg-light); color: var(--onyx-text-light); @@ -208,9 +197,6 @@ animation: none; /* Disable animation */ } } - * Dark mode support - * Different styling when in dark mode - */ body.fl-dark .fl-onyx, html.fl-dark .fl-onyx, .fl-onyx.fl-auto-dark { diff --git a/src/Prime/Resources/assets/themes/ruby/ruby.scss b/src/Prime/Resources/assets/themes/ruby/ruby.scss index ff120013..264b351d 100644 --- a/src/Prime/Resources/assets/themes/ruby/ruby.scss +++ b/src/Prime/Resources/assets/themes/ruby/ruby.scss @@ -1,9 +1,3 @@ - */ - * PHPFlasher - Ruby Theme - * - * Vibrant notification style with gradient backgrounds and gemstone effects. - * Features animated shine effect, circular icon container, and smooth animations. - */ .fl-ruby { /* Theme variables - Define the visual appearance of Ruby notifications */ /* Base colors and appearance */ @@ -17,9 +11,6 @@ --ruby-warning-gradient: linear-gradient(135deg, #d97706 0%, #f59e0b 100%); /* Amber gradient */ --ruby-error-gradient: linear-gradient(135deg, #b91c1c 0%, #ef4444 100%); /* Red gradient */ } - * Shine animation for Ruby theme - * Creates a moving highlight effect like light reflecting off a gemstone - */ @keyframes rubyShine { 0% { left: -100%; /* Start off-screen left */ @@ -34,9 +25,6 @@ opacity: 0; /* Fade out at the end */ } } - * Entrance animation for Ruby theme - * Smooth scale-in effect - */ @keyframes rubyIn { 0% { opacity: 0; /* Start invisible */ @@ -47,8 +35,6 @@ transform: scale(1); /* End at normal size */ } } - * Base Ruby theme styling - */ .fl-ruby { color: var(--ruby-text); /* White text for readability on gradients */ padding: 0; /* No padding at the container level */ diff --git a/src/Prime/Resources/assets/themes/sapphire/sapphire.scss b/src/Prime/Resources/assets/themes/sapphire/sapphire.scss index ef3403ac..4d285eae 100644 --- a/src/Prime/Resources/assets/themes/sapphire/sapphire.scss +++ b/src/Prime/Resources/assets/themes/sapphire/sapphire.scss @@ -1,9 +1,3 @@ - */ - * PHPFlasher - Sapphire Theme - * - * Modern glassmorphic notifications with blurred backdrop effect. - * Features clean, minimal design and subtle animations. - */ /* Theme-specific variables - override these to customize the sapphire theme */ .fl-sapphire { /* Base appearance */ @@ -21,9 +15,6 @@ /* Animation timing */ --sapphire-animation: 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94); /* Smooth bounce easing */ } - * Entrance animation keyframes - * Includes a subtle bounce effect for a more dynamic appearance - */ @keyframes sapphireIn { 0% { opacity: 0; /* Start invisible */ @@ -37,8 +28,6 @@ transform: translateY(0); /* End at natural position */ } } - * Main theme styling - */ .fl-sapphire { /* Base appearance */ background-color: var(--sapphire-bg-base); /* Semi-transparent background */ diff --git a/src/Prime/Resources/assets/themes/slack/slack.scss b/src/Prime/Resources/assets/themes/slack/slack.scss index c2749c86..c392662e 100644 --- a/src/Prime/Resources/assets/themes/slack/slack.scss +++ b/src/Prime/Resources/assets/themes/slack/slack.scss @@ -1,9 +1,3 @@ - */ - * PHPFlasher - Slack Theme - * - * Familiar notifications inspired by Slack's popular messaging platform. - * Used by millions of professionals worldwide. - */ .fl-slack { /* Theme variables - Define the visual appearance of Slack notifications */ /* Base colors and appearance */ @@ -28,9 +22,6 @@ /* Animation timing */ --slack-animation-duration: 150ms; /* Quick animation for responsive feel */ } - * Simple fade in animation - * Quick and subtle to match Slack's responsive feel - */ @keyframes slackFadeIn { from { opacity: 0; /* Start invisible */ @@ -39,8 +30,6 @@ opacity: 1; /* End fully visible */ } } - * Base Slack theme styling - */ .fl-slack { position: relative; margin: 4px 0; /* Minimal spacing between messages */ @@ -198,9 +187,6 @@ animation: none; /* Disable animation */ } } - * Dark mode support - * Slack-like dark theme - */ body.fl-dark .fl-slack, html.fl-dark .fl-slack, .fl-slack.fl-auto-dark { diff --git a/src/Prime/Resources/dist/themes/facebook/facebook.esm.js b/src/Prime/Resources/dist/themes/facebook/facebook.esm.js index 6e3fe353..a8220e09 100644 --- a/src/Prime/Resources/dist/themes/facebook/facebook.esm.js +++ b/src/Prime/Resources/dist/themes/facebook/facebook.esm.js @@ -60,7 +60,7 @@ const facebookTheme = { diff --git a/src/Prime/Resources/dist/themes/facebook/facebook.js b/src/Prime/Resources/dist/themes/facebook/facebook.js index 0008d977..ee18103b 100644 --- a/src/Prime/Resources/dist/themes/facebook/facebook.js +++ b/src/Prime/Resources/dist/themes/facebook/facebook.js @@ -64,7 +64,7 @@ diff --git a/src/Prime/Resources/dist/themes/facebook/facebook.min.js b/src/Prime/Resources/dist/themes/facebook/facebook.min.js index 3e1b35ca..9d106bd9 100644 --- a/src/Prime/Resources/dist/themes/facebook/facebook.min.js +++ b/src/Prime/Resources/dist/themes/facebook/facebook.min.js @@ -1 +1 @@ -!function(n,i){"object"==typeof exports&&"undefined"!=typeof module?i(require("@flasher/flasher")):"function"==typeof define&&define.amd?define(["@flasher/flasher"],i):i((n="undefined"!=typeof globalThis?globalThis:n||self).flasher)}(this,(function(n){"use strict";const i={render:n=>{const{type:i,message:e}=n,s="error"===i||"warning"===i,t=s?"alert":"status",l=s?"assertive":"polite",o=(new Date).toLocaleTimeString([],{hour:"numeric",minute:"2-digit"});return`\n `}};n.addTheme("facebook",i)})); +!function(n,i){"object"==typeof exports&&"undefined"!=typeof module?i(require("@flasher/flasher")):"function"==typeof define&&define.amd?define(["@flasher/flasher"],i):i((n="undefined"!=typeof globalThis?globalThis:n||self).flasher)}(this,(function(n){"use strict";const i={render:n=>{const{type:i,message:e}=n,s="error"===i||"warning"===i,t=s?"alert":"status",l=s?"assertive":"polite",o=(new Date).toLocaleTimeString([],{hour:"numeric",minute:"2-digit"});return`\n `}};n.addTheme("facebook",i)})); diff --git a/src/Prime/Resources/public/themes/facebook/facebook.min.js b/src/Prime/Resources/public/themes/facebook/facebook.min.js index 3e1b35ca..9d106bd9 100644 --- a/src/Prime/Resources/public/themes/facebook/facebook.min.js +++ b/src/Prime/Resources/public/themes/facebook/facebook.min.js @@ -1 +1 @@ -!function(n,i){"object"==typeof exports&&"undefined"!=typeof module?i(require("@flasher/flasher")):"function"==typeof define&&define.amd?define(["@flasher/flasher"],i):i((n="undefined"!=typeof globalThis?globalThis:n||self).flasher)}(this,(function(n){"use strict";const i={render:n=>{const{type:i,message:e}=n,s="error"===i||"warning"===i,t=s?"alert":"status",l=s?"assertive":"polite",o=(new Date).toLocaleTimeString([],{hour:"numeric",minute:"2-digit"});return`\n `}};n.addTheme("facebook",i)})); +!function(n,i){"object"==typeof exports&&"undefined"!=typeof module?i(require("@flasher/flasher")):"function"==typeof define&&define.amd?define(["@flasher/flasher"],i):i((n="undefined"!=typeof globalThis?globalThis:n||self).flasher)}(this,(function(n){"use strict";const i={render:n=>{const{type:i,message:e}=n,s="error"===i||"warning"===i,t=s?"alert":"status",l=s?"assertive":"polite",o=(new Date).toLocaleTimeString([],{hour:"numeric",minute:"2-digit"});return`\n `}};n.addTheme("facebook",i)}));