shieldsio-elements

Custom HTML Elements and helpers for Shields.io Badges.

Shield IO Badges

All Shield.io badges have the following attributes:

• label: the left-hand-side text if overwritten; otherwise null.
• logo: the logo to use.
• color: the color of the right-hand-side background.
• logocolor: the color of the logo.
• labelcolor: the color of the left-hand-side background.
• logowidth: the horizontal space for the logo.
• badgestyle: the style of the badge. Can be:
  • plastic
  • flat
  • flat-square
  • for-the-badge
  • social

shieldio-badge element

Used to show a static badge.

In addition to the common attributes, the static also supports:

• message the right-hand-side text.

<shieldio-badge label="Label" message="message" color="green"></shieldio-badge>

shieldio-badge-dynamic element

Used to show a dynamic badge.

In addition to the common attributes, the dynamic also supports:

• dataurl: the URL of the data to base the badge on.
• dataquery: the query for the dynamic content.
• prefix: the text to prefix the dynamic content.
• suffix: the text to suffix the dynamic content.
• datatype: the type of data to process. Can be:
  • xml
  • json
  • yaml

<shieldio-badge-dynamic datatype="xml" dataurl="https://raw.githubusercontent.com/PH16-Productions/tv.ph16.paperplugin/main/pom.xml" label="Java Version" dataquery="//*[local-name() = 'java.version']"></shieldio-badge-dynamic>

Other Badges

simpleicon-badge element

Shows a badge for a simple icon.

Supports the following attributes:

• logo: the simple icon logo to display.
• badgestyle: the style of the badge. Can be:
  • plastic
  • flat
  • flat-square
  • for-the-badge
  • social

<simpleicon-badge logo="GitHub"></simpleicon-badge>