svg - Revision history

Tantek: move article to Examples in the wild, SA XML

2025-06-18T20:25:16Z

move article to Examples in the wild, SA XML

← Older revision		Revision as of 20:25, 18 June 2025
Line 2:		Line 2:

	The [https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/class class attribute is allowed on SVG elements]. As such, there are rich possibilities for embedding microformats with or in them.		The [https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/class class attribute is allowed on SVG elements]. As such, there are rich possibilities for embedding microformats with or in them.


	== Examples ==		== Examples ==
Line 110:		Line 109:
	}		}
	</syntaxhighlight>		</syntaxhighlight>

			== Examples in the wild ==
			* https://btrem.com/2021/04-svg-microformats — also a great how to with code examples!

	== See also ==		== See also ==
			* [[XML]]
	* ~~https://btrem.com/2021/04-svg-microformats~~

2022-12-01T15:55:38Z

Examples: Removes unneeded rect element

← Older revision		Revision as of 15:55, 1 December 2022
Line 45:		Line 45:
	<syntaxhighlight lang=xml>		<syntaxhighlight lang=xml>
	<svg class="h-card" viewBox="0 0 300 300" height="300" width="300">		<svg class="h-card" viewBox="0 0 300 300" height="300" width="300">
	~~<rect width="100%" height="100%" fill="none" stroke="red" />~~
	<circle cx="100" cy="100" r="100" fill="gold"/>		<circle cx="100" cy="100" r="100" fill="gold"/>
	<text class="p-name" x="25" y="110" font-size="30">		<text class="p-name" x="25" y="110" font-size="30">

2022-12-01T01:12:53Z

Example: Adds second example of svg with h-card markup

@@ Line 4: / Line 4: @@
-== Example ==
+== Examples ==
-Here is a simple example:
+Here are a couple of examples.
 <syntaxhighlight lang=xml>
@@ Line 36: / Line 38: @@
   "rel-urls": {}
+  }
+}
 </syntaxhighlight>

2022-12-01T00:29:25Z

Adds parsed json resulting from simple example

@@ Line 15: / Line 15: @@
      </text>
 </svg>
 </syntaxhighlight>

2022-12-01T00:26:05Z

Changes simple example to use implied name property of h-card

← Older revision		Revision as of 00:26, 1 December 2022
Line 11:		Line 11:
	<svg class="h-card" viewBox="0 0 200 200" height="200" width="200">		<svg class="h-card" viewBox="0 0 200 200" height="200" width="200">
	<circle cx="50%" cy="50%" r="100" fill="gold"/>		<circle cx="50%" cy="50%" r="100" fill="gold"/>
	<text ~~class="p-name"~~ x="25" y="110" font-size="30">		<text x="25" y="110" font-size="30">
	Example Co.		Example Co.
	</text>		</text>

2022-11-30T23:59:25Z

Fix: corrects syntaxhightlight lang attribute

← Older revision		Revision as of 23:59, 30 November 2022
Line 8:		Line 8:
	Here is a simple example:		Here is a simple example:

	<syntaxhighlight lang=~~html~~>		<syntaxhighlight lang=xml>
	<svg class="h-card" viewBox="0 0 200 200" height="200" width="200">		<svg class="h-card" viewBox="0 0 200 200" height="200" width="200">
	<circle cx="50%" cy="50%" r="100" fill="gold"/>		<circle cx="50%" cy="50%" r="100" fill="gold"/>

2022-11-30T23:34:53Z

Fix: replaces deprecated <source> tag with <syntaxhighlight>

← Older revision		Revision as of 23:34, 30 November 2022
Line 8:		Line 8:
	Here is a simple example:		Here is a simple example:

	<~~source~~ lang=html>		<syntaxhighlight lang=html>
	<svg class="h-card" viewBox="0 0 200 200" height="200" width="200">		<svg class="h-card" viewBox="0 0 200 200" height="200" width="200">
	<circle cx="50%" cy="50%" r="100" fill="gold"/>		<circle cx="50%" cy="50%" r="100" fill="gold"/>
Line 15:		Line 15:
	</text>		</text>
	</svg>		</svg>
	</~~source~~>		</syntaxhighlight>

	== See also ==		== See also ==

	* https://btrem.com/2021/04-svg-microformats		* https://btrem.com/2021/04-svg-microformats

2022-11-30T22:40:03Z

Adds simple example of microformats in svg.

@@ Line 1: / Line 1: @@
 {{stub}}
-SVG, having a standard class attribute can also be marked up with microformats.
+The [https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/class class attribute is allowed on SVG elements]. As such, there are rich possibilities for embedding microformats with or in them.
 * https://btrem.com/2021/04-svg-microformats

2022-11-30T21:27:00Z

stub with btrem's post & example!

New page

{{stub}}

SVG, having a standard class attribute can also be marked up with microformats.

Examples:
* https://btrem.com/2021/04-svg-microformats