Bbcode Infoboxes

Dev
2

Use this code in posts for bgcolor boxes:

[Wrap="redboxbg"]
> Infobox

Testing boxed
[/wrap]

New background color Options Substitute “red” with:

  • “green”, “blue”, “yellow”, “brown”, “orange”, “purple”, “pink”, “cyan”., “grey”.
  • Added blank box
    Color background. Grey border.
Screenshot Mobile

There is a colorful display with text boxes that likely represent different categories or purposes. (Captioned by AI)
There is a colorful display with text boxes that likely represent different categories or purposes. (Captioned by AI)864×1700 147 KB

Screenshot Mobile 2

The image displays a mobile phone interface with a list of test boxes, including information and testing text boxes, with a blue and white color scheme. (Captioned by AI)
The image displays a mobile phone interface with a list of test boxes, including information and testing text boxes, with a blue and white color scheme. (Captioned by AI)864×1631 144 KB

The image displays a futuristic robot head, accompanied by the text "Testing text boxes" and a prompt for the user to "Testing text below. (Captioned by AI)
The image displays a futuristic robot head, accompanied by the text "Testing text boxes" and a prompt for the user to "Testing text below. (Captioned by AI)864×876 437 KB

  • “grey”, “grey#” #=0-9.
    *All grey backgrounds, grey border,
    Border colour
    1 red , 2 green , 3 blue, 4 yellow , 5 Brown, 6 Orange, 7 Purple, 8 Magenta, 9 Pink, 0 Cyan (Op Code updated)
Screenshot Mobile

This is a screenshot of a user interface showing a testing box labeled "Picture" with a mechanical robot head as the image underneath. (Captioned by AI)
This is a screenshot of a user interface showing a testing box labeled "Picture" with a mechanical robot head as the image underneath. (Captioned by AI)864×1050 353 KB

This image displays a dropdown menu with four different boxes, each representing a different type of test. (Captioned by AI)
This image displays a dropdown menu with four different boxes, each representing a different type of test. (Captioned by AI)863×1287 105 KB

Screenshot Mobile 2

The image shows a list of six different testing box options, each with its own color code and a label for its function. (Captioned by AI)
The image shows a list of six different testing box options, each with its own color code and a label for its function. (Captioned by AI)864×1676 127 KB

This is a screenshot of an information box with a placeholder text for the content. (Captioned by AI)
This is a screenshot of an information box with a placeholder text for the content. (Captioned by AI)864×445 33.4 KB

This could be both a standalone component or maybe also added to Coloured Text TC.

  • Restricting what colours can be used helps keep these clean.

TODO:

  • Add options for Orange, Brown, Purple, & Pink, Magenta, Cyan Complete code updated Op post
  • Maybe make code prettier with feedback.
  • Create GitHub account. Learn adding settings for customizing border &?.. Publish eventually as a TC.
3 Likes