docs: minor fixes in notification showcases

leape · web-flow · commit 9fce145d84ef · 2025-10-22T19:09:19.000+02:00
- removed closeable button from all examples except the one for the closeable property/section
- removed the timestamp from the example of the variant property/section
- fixed the typo "Closable" to "Closeable" in all three examples sections at the end
- added closeable property for all "Closeable" examples in all three examples sections at the end
diff --git a/showcases/shared/notification.json b/showcases/shared/notification.json
@@ -8,8 +8,7 @@
 				"style": { "width": "300px" },
 				"props": {
 					"headline": "Headline",
-					"icon": "information_circle",
-					"closeable": true
+					"icon": "information_circle"
 				}
 			},
 			{
@@ -18,8 +17,7 @@
 				"style": { "width": "300px" },
 				"props": {
 					"headline": "Headline",
-					"icon": "information_circle",
-					"closeable": true
+					"icon": "information_circle"
 				}
 			},
 			{
@@ -28,8 +26,7 @@
 				"style": { "width": "300px" },
 				"props": {
 					"headline": "Headline",
-					"icon": "information_circle",
-					"closeable": true
+					"icon": "information_circle"
 				}
 			}
 		]
@@ -43,8 +40,7 @@
 				"props": {
 					"variant": "docked",
 					"headline": "Headline",
-					"icon": "information_circle",
-					"closeable": true
+					"icon": "information_circle"
 				}
 			},
 			{
@@ -53,8 +49,7 @@
 				"props": {
 					"variant": "standalone",
 					"headline": "Headline",
-					"icon": "information_circle",
-					"closeable": true
+					"icon": "information_circle"
 				}
 			},
 			{
@@ -63,9 +58,7 @@
 				"props": {
 					"variant": "overlay",
 					"headline": "Headline",
-					"icon": "information_circle",
-					"closeable": true,
-					"timestamp": "10 min ago"
+					"icon": "information_circle"
 				}
 			}
 		]
@@ -77,53 +70,47 @@
 				"name": "(Default) Adaptive",
 				"style": { "width": "300px" },
 				"props": {
-					"headline": "Headline",
-					"closeable": true
+					"headline": "Headline"
 				}
 			},
 			{
 				"name": "Neutral",
 				"style": { "width": "300px" },
 				"props": {
 					"semantic": "neutral",
-					"headline": "Headline",
-					"closeable": true
+					"headline": "Headline"
 				}
 			},
 			{
 				"name": "Critical",
 				"style": { "width": "300px" },
 				"props": {
 					"semantic": "critical",
-					"headline": "Headline",
-					"closeable": true
+					"headline": "Headline"
 				}
 			},
 			{
 				"name": "Informational",
 				"style": { "width": "300px" },
 				"props": {
 					"semantic": "informational",
-					"headline": "Headline",
-					"closeable": true
+					"headline": "Headline"
 				}
 			},
 			{
 				"name": "Successful",
 				"style": { "width": "300px" },
 				"props": {
 					"semantic": "successful",
-					"headline": "Headline",
-					"closeable": true
+					"headline": "Headline"
 				}
 			},
 			{
 				"name": "Warning",
 				"style": { "width": "300px" },
 				"props": {
 					"semantic": "warning",
-					"headline": "Headline",
-					"closeable": true
+					"headline": "Headline"
 				}
 			}
 		]
@@ -337,12 +324,13 @@
 				]
 			},
 			{
-				"name": "Text & Headline & Textlink Inline & Closable",
+				"name": "Text & Headline & Textlink Inline & Closeable",
 				"style": { "width": "300px" },
 				"props": {
 					"headline": "Headline",
 					"link": true,
-					"linkVariant": "inline"
+					"linkVariant": "inline",
+					"closeable": true
 				},
 				"children": [
 					{
@@ -356,13 +344,14 @@
 				]
 			},
 			{
-				"name": "Text & Icon & Headline & Textlink Inline & Closable",
+				"name": "Text & Icon & Headline & Textlink Inline & Closeable",
 				"style": { "width": "300px" },
 				"props": {
 					"icon": "information_circle",
 					"headline": "Headline",
 					"link": true,
-					"linkVariant": "inline"
+					"linkVariant": "inline",
+					"closeable": true
 				},
 				"children": [
 					{
@@ -468,13 +457,14 @@
 				]
 			},
 			{
-				"name": "Text & Headline & Textlink Inline & Closable",
+				"name": "Text & Headline & Textlink Inline & Closeable",
 				"style": { "width": "300px" },
 				"props": {
 					"headline": "Headline",
 					"link": true,
 					"linkVariant": "inline",
-					"variant": "standalone"
+					"variant": "standalone",
+					"closeable": true
 				},
 				"children": [
 					{
@@ -488,14 +478,15 @@
 				]
 			},
 			{
-				"name": "Text & Icon & Headline & Textlink Inline & Closable",
+				"name": "Text & Icon & Headline & Textlink Inline & Closeable",
 				"style": { "width": "300px" },
 				"props": {
 					"icon": "information_circle",
 					"headline": "Headline",
 					"link": true,
 					"linkVariant": "inline",
-					"variant": "standalone"
+					"variant": "standalone",
+					"closeable": true
 				},
 				"children": [
 					{
@@ -591,22 +582,24 @@
 				]
 			},
 			{
-				"name": "Text & Headline & Textlink Inline & Closable",
+				"name": "Text & Headline & Textlink Inline & Closeable",
 				"style": { "width": "300px" },
 				"props": {
 					"headline": "Headline",
 					"link": true,
-					"variant": "overlay"
+					"variant": "overlay",
+					"closeable": true
 				}
 			},
 			{
-				"name": "Text & Icon & Headline & Textlink Inline & Closable",
+				"name": "Text & Icon & Headline & Textlink Inline & Closeable",
 				"style": { "width": "300px" },
 				"props": {
 					"icon": "information_circle",
 					"headline": "Headline",
 					"link": true,
-					"variant": "overlay"
+					"variant": "overlay",
+					"closeable": true
 				}
 			},
 			{
@@ -619,30 +612,33 @@
 				}
 			},
 			{
-				"name": "Text & Timed & Closable",
+				"name": "Text & Timed & Closeable",
 				"style": { "width": "300px" },
 				"props": {
 					"timestamp": "10 min ago",
-					"variant": "overlay"
+					"variant": "overlay",
+					"closeable": true
 				}
 			},
 			{
-				"name": "Text & Headline & Timed & Closable",
+				"name": "Text & Headline & Timed & Closeable",
 				"style": { "width": "300px" },
 				"props": {
 					"headline": "Headline",
 					"timestamp": "10 min ago",
-					"variant": "overlay"
+					"variant": "overlay",
+					"closeable": true
 				}
 			},
 			{
-				"name": "Text & Icon & Headline & Timed & Closable",
+				"name": "Text & Icon & Headline & Timed & Closeable",
 				"style": { "width": "300px" },
 				"props": {
 					"icon": "information_circle",
 					"headline": "Headline",
 					"timestamp": "10 min ago",
-					"variant": "overlay"
+					"variant": "overlay",
+					"closeable": true
 				}
 			}
 		]

Original file line number	Diff line number	Diff line change
`@@ -8,8 +8,7 @@`
`8`	`8`	`"style": { "width": "300px" },`
`9`	`9`	`"props": {`
`10`	`10`	`"headline": "Headline",`
`11`		`- "icon": "information_circle",`
`12`		`- "closeable": true`
	`11`	`+ "icon": "information_circle"`
`13`	`12`	`}`
`14`	`13`	`},`
`15`	`14`	`{`
`@@ -18,8 +17,7 @@`
`18`	`17`	`"style": { "width": "300px" },`
`19`	`18`	`"props": {`
`20`	`19`	`"headline": "Headline",`
`21`		`- "icon": "information_circle",`
`22`		`- "closeable": true`
	`20`	`+ "icon": "information_circle"`
`23`	`21`	`}`
`24`	`22`	`},`
`25`	`23`	`{`
`@@ -28,8 +26,7 @@`
`28`	`26`	`"style": { "width": "300px" },`
`29`	`27`	`"props": {`
`30`	`28`	`"headline": "Headline",`
`31`		`- "icon": "information_circle",`
`32`		`- "closeable": true`
	`29`	`+ "icon": "information_circle"`
`33`	`30`	`}`
`34`	`31`	`}`
`35`	`32`	`]`
`@@ -43,8 +40,7 @@`
`43`	`40`	`"props": {`
`44`	`41`	`"variant": "docked",`
`45`	`42`	`"headline": "Headline",`
`46`		`- "icon": "information_circle",`
`47`		`- "closeable": true`
	`43`	`+ "icon": "information_circle"`
`48`	`44`	`}`
`49`	`45`	`},`
`50`	`46`	`{`
`@@ -53,8 +49,7 @@`
`53`	`49`	`"props": {`
`54`	`50`	`"variant": "standalone",`
`55`	`51`	`"headline": "Headline",`
`56`		`- "icon": "information_circle",`
`57`		`- "closeable": true`
	`52`	`+ "icon": "information_circle"`
`58`	`53`	`}`
`59`	`54`	`},`
`60`	`55`	`{`
`@@ -63,9 +58,7 @@`
`63`	`58`	`"props": {`
`64`	`59`	`"variant": "overlay",`
`65`	`60`	`"headline": "Headline",`
`66`		`- "icon": "information_circle",`
`67`		`- "closeable": true,`
`68`		`- "timestamp": "10 min ago"`
	`61`	`+ "icon": "information_circle"`
`69`	`62`	`}`
`70`	`63`	`}`
`71`	`64`	`]`
`@@ -77,53 +70,47 @@`
`77`	`70`	`"name": "(Default) Adaptive",`
`78`	`71`	`"style": { "width": "300px" },`
`79`	`72`	`"props": {`
`80`		`- "headline": "Headline",`
`81`		`- "closeable": true`
	`73`	`+ "headline": "Headline"`
`82`	`74`	`}`
`83`	`75`	`},`
`84`	`76`	`{`
`85`	`77`	`"name": "Neutral",`
`86`	`78`	`"style": { "width": "300px" },`
`87`	`79`	`"props": {`
`88`	`80`	`"semantic": "neutral",`
`89`		`- "headline": "Headline",`
`90`		`- "closeable": true`
	`81`	`+ "headline": "Headline"`
`91`	`82`	`}`
`92`	`83`	`},`
`93`	`84`	`{`
`94`	`85`	`"name": "Critical",`
`95`	`86`	`"style": { "width": "300px" },`
`96`	`87`	`"props": {`
`97`	`88`	`"semantic": "critical",`
`98`		`- "headline": "Headline",`
`99`		`- "closeable": true`
	`89`	`+ "headline": "Headline"`
`100`	`90`	`}`
`101`	`91`	`},`
`102`	`92`	`{`
`103`	`93`	`"name": "Informational",`
`104`	`94`	`"style": { "width": "300px" },`
`105`	`95`	`"props": {`
`106`	`96`	`"semantic": "informational",`
`107`		`- "headline": "Headline",`
`108`		`- "closeable": true`
	`97`	`+ "headline": "Headline"`
`109`	`98`	`}`
`110`	`99`	`},`
`111`	`100`	`{`
`112`	`101`	`"name": "Successful",`
`113`	`102`	`"style": { "width": "300px" },`
`114`	`103`	`"props": {`
`115`	`104`	`"semantic": "successful",`
`116`		`- "headline": "Headline",`
`117`		`- "closeable": true`
	`105`	`+ "headline": "Headline"`
`118`	`106`	`}`
`119`	`107`	`},`
`120`	`108`	`{`
`121`	`109`	`"name": "Warning",`
`122`	`110`	`"style": { "width": "300px" },`
`123`	`111`	`"props": {`
`124`	`112`	`"semantic": "warning",`
`125`		`- "headline": "Headline",`
`126`		`- "closeable": true`
	`113`	`+ "headline": "Headline"`
`127`	`114`	`}`
`128`	`115`	`}`
`129`	`116`	`]`
`@@ -337,12 +324,13 @@`
`337`	`324`	`]`
`338`	`325`	`},`
`339`	`326`	`{`
`340`		`- "name": "Text & Headline & Textlink Inline & Closable",`
	`327`	`+ "name": "Text & Headline & Textlink Inline & Closeable",`
`341`	`328`	`"style": { "width": "300px" },`
`342`	`329`	`"props": {`
`343`	`330`	`"headline": "Headline",`
`344`	`331`	`"link": true,`
`345`		`- "linkVariant": "inline"`
	`332`	`+ "linkVariant": "inline",`
	`333`	`+ "closeable": true`
`346`	`334`	`},`
`347`	`335`	`"children": [`
`348`	`336`	`{`
`@@ -356,13 +344,14 @@`
`356`	`344`	`]`
`357`	`345`	`},`
`358`	`346`	`{`
`359`		`- "name": "Text & Icon & Headline & Textlink Inline & Closable",`
	`347`	`+ "name": "Text & Icon & Headline & Textlink Inline & Closeable",`
`360`	`348`	`"style": { "width": "300px" },`
`361`	`349`	`"props": {`
`362`	`350`	`"icon": "information_circle",`
`363`	`351`	`"headline": "Headline",`
`364`	`352`	`"link": true,`
`365`		`- "linkVariant": "inline"`
	`353`	`+ "linkVariant": "inline",`
	`354`	`+ "closeable": true`
`366`	`355`	`},`
`367`	`356`	`"children": [`
`368`	`357`	`{`
`@@ -468,13 +457,14 @@`
`468`	`457`	`]`
`469`	`458`	`},`
`470`	`459`	`{`
`471`		`- "name": "Text & Headline & Textlink Inline & Closable",`
	`460`	`+ "name": "Text & Headline & Textlink Inline & Closeable",`
`472`	`461`	`"style": { "width": "300px" },`
`473`	`462`	`"props": {`
`474`	`463`	`"headline": "Headline",`
`475`	`464`	`"link": true,`
`476`	`465`	`"linkVariant": "inline",`
`477`		`- "variant": "standalone"`
	`466`	`+ "variant": "standalone",`
	`467`	`+ "closeable": true`
`478`	`468`	`},`
`479`	`469`	`"children": [`
`480`	`470`	`{`
`@@ -488,14 +478,15 @@`
`488`	`478`	`]`
`489`	`479`	`},`
`490`	`480`	`{`
`491`		`- "name": "Text & Icon & Headline & Textlink Inline & Closable",`
	`481`	`+ "name": "Text & Icon & Headline & Textlink Inline & Closeable",`
`492`	`482`	`"style": { "width": "300px" },`
`493`	`483`	`"props": {`
`494`	`484`	`"icon": "information_circle",`
`495`	`485`	`"headline": "Headline",`
`496`	`486`	`"link": true,`
`497`	`487`	`"linkVariant": "inline",`
`498`		`- "variant": "standalone"`
	`488`	`+ "variant": "standalone",`
	`489`	`+ "closeable": true`
`499`	`490`	`},`
`500`	`491`	`"children": [`
`501`	`492`	`{`
`@@ -591,22 +582,24 @@`
`591`	`582`	`]`
`592`	`583`	`},`
`593`	`584`	`{`
`594`		`- "name": "Text & Headline & Textlink Inline & Closable",`
	`585`	`+ "name": "Text & Headline & Textlink Inline & Closeable",`
`595`	`586`	`"style": { "width": "300px" },`
`596`	`587`	`"props": {`
`597`	`588`	`"headline": "Headline",`
`598`	`589`	`"link": true,`
`599`		`- "variant": "overlay"`
	`590`	`+ "variant": "overlay",`
	`591`	`+ "closeable": true`
`600`	`592`	`}`
`601`	`593`	`},`
`602`	`594`	`{`
`603`		`- "name": "Text & Icon & Headline & Textlink Inline & Closable",`
	`595`	`+ "name": "Text & Icon & Headline & Textlink Inline & Closeable",`
`604`	`596`	`"style": { "width": "300px" },`
`605`	`597`	`"props": {`
`606`	`598`	`"icon": "information_circle",`
`607`	`599`	`"headline": "Headline",`
`608`	`600`	`"link": true,`
`609`		`- "variant": "overlay"`
	`601`	`+ "variant": "overlay",`
	`602`	`+ "closeable": true`
`610`	`603`	`}`
`611`	`604`	`},`
`612`	`605`	`{`
`@@ -619,30 +612,33 @@`
`619`	`612`	`}`
`620`	`613`	`},`
`621`	`614`	`{`
`622`		`- "name": "Text & Timed & Closable",`
	`615`	`+ "name": "Text & Timed & Closeable",`
`623`	`616`	`"style": { "width": "300px" },`
`624`	`617`	`"props": {`
`625`	`618`	`"timestamp": "10 min ago",`
`626`		`- "variant": "overlay"`
	`619`	`+ "variant": "overlay",`
	`620`	`+ "closeable": true`
`627`	`621`	`}`
`628`	`622`	`},`
`629`	`623`	`{`
`630`		`- "name": "Text & Headline & Timed & Closable",`
	`624`	`+ "name": "Text & Headline & Timed & Closeable",`
`631`	`625`	`"style": { "width": "300px" },`
`632`	`626`	`"props": {`
`633`	`627`	`"headline": "Headline",`
`634`	`628`	`"timestamp": "10 min ago",`
`635`		`- "variant": "overlay"`
	`629`	`+ "variant": "overlay",`
	`630`	`+ "closeable": true`
`636`	`631`	`}`
`637`	`632`	`},`
`638`	`633`	`{`
`639`		`- "name": "Text & Icon & Headline & Timed & Closable",`
	`634`	`+ "name": "Text & Icon & Headline & Timed & Closeable",`
`640`	`635`	`"style": { "width": "300px" },`
`641`	`636`	`"props": {`
`642`	`637`	`"icon": "information_circle",`
`643`	`638`	`"headline": "Headline",`
`644`	`639`	`"timestamp": "10 min ago",`
`645`		`- "variant": "overlay"`
	`640`	`+ "variant": "overlay",`
	`641`	`+ "closeable": true`
`646`	`642`	`}`
`647`	`643`	`}`
`648`	`644`	`]`