Template:Userbox: Difference between revisions

Latest revision as of 16:27, 27 March 2024

	This user likes Hello Street Cat.

A userbox to customize your profile with. Use https://cssgradient.io/ to get a gradient on your userbox, copy only "linear-gradient(0deg, rgba(000,000,00,1) 00%, rgba(000,000,00,1) 00%)" and paste that into "Background Color"

Template parameters[Edit template data]
Parameter		Description	Type	Status
Border Thickness	`brdrthic`	How thick is the border around the userbox? Suggested values `1` `2` `3` Default 2 Example 1-3 is recommended	Number	optional
Border Color	`brdrclr`	What color is the border around the userbox? Suggested values `black` `white` `blue` `red` `yellow` Default black Example Black; #000000	String	optional
Background Color	`bgclr`	Userbox background color Suggested values `grey` `blue` `pink` `yellow` Example pink, #fd1668	String	optional
Image	`img`	What image will you have to the left? Example Freshlycat.png	File	suggested
Text colour	`txclr`	The text color Suggested values `black` `white` `blue` `pink` `yellow` Example black , #000000	String	optional
Text in the userbox	`text`	What do you want your userbox to say? Example This user is silly	String	required
Roundness	`1`	Roundness of the image and userbox Suggested values `0` `2` `4` `6` `8` `10` Example 0 is not round at all, 0-10 is recommended values	Number	optional

@@ Line 1: / Line 1: @@
-<div style="float:{{{float|left}}}; border:{{{border-width|{{{border-s|1}}}}}}px solid {{{border-color|{{{1|{{{border-c|{{{id-c|#999}}}}}}}}}}}}; margin:1px;" class="wwikiuserbox">
+{| style="margin-top:1em; margin-left: auto; margin-right: auto; border: {{{brdrthic|2}}}px solid {{{brdrclr|#815408}}}; border-radius:{{{1|10}}}px; overflow:hidden ; padding: 0px 0px; background: {{{bgclr|linear-gradient(0deg, rgba(224,113,0,1) 0%, rgba(255,229,93,1) 90%)}}}"
-{| cellspacing="0" style="width:250px; background:{{{info-background|{{{2|{{{info-c|#EEE}}}}}}}}};"
+! style="border-radius: {{{1|10}}}px; padding: 0px 0px; overflow:hidden | [[File:{{{img|AppLogo2.png}}} |none|100px]]
-| style="width:{{{logo-width|{{{id-w|45}}}}}}px; height:{{{logo-height|{{{id-h|45}}}}}}px; background:{{{logo-background|{{{1|{{{id-c|#DDD}}}}}}}}}; text-align:center; font-size:{{{logo-size|{{{5|{{{id-s|14}}}}}}}}}pt; color:{{{logo-color|{{{id-fc|black}}}}}}; padding:{{{logo-padding|{{{id-p|1pt}}}}}}; line-height:{{{logo-line-height|{{{id-lh|1.25em}}}}}}; {{{logo-other-param|{{{id-op|}}}}}}; vertical-align: middle;" |'''{{{logo|{{{3|{{{id|id}}}}}}}}}'''
+| style="color: {{{txclr|black}}}; padding: 0px 50px" |{{{text|This user likes '''Hello Street Cat'''}}}.
-| style="font-size:{{{info-size|{{{info-s|8}}}}}}pt; padding:{{{info-padding|{{{info-p|4pt}}}}}}; line-height:{{{info-line-height|{{{info-lh|1.25em}}}}}}; color:{{{info-color|{{{info-fc|black}}}}}}; {{{info-other-param|{{{info-op|}}}}}}; vertical-align: middle;text-align:center;" | {{{info|{{{4|{{{info|''info''}}}}}}}}}
+|}
-|}</div><noinclude>
+<noinclude>
-{{clear}}
+<templatedata>
+{
-==Simple Code==
+	"params": {
-<PRE>
+		"1": {
-{{userbox|#ff0000|#c0c0c0|id text/image|caption}}
+			"label": "Roundness",
-</PRE>
+			"description": "Roundness of the image and userbox",
+			"example": "0 is not round at all, 0-10 is recommended values",
-==Advanced Code==
+			"suggestedvalues": [
-<PRE>
+				"0",
-{{Userbox
+				"2",
-  |id       = id text or image
+				"4",
-  |id-c     = id background color
+				"6",
-  |id-fc    = id font color
+				"8",
-  |id-s     = id text size
+				"10"
-  |id-p     = id cell padding space
+			],
-  |id-lh    = id line height
+			"type": "number"
-  |id-op    = id other parameter (CSS)
+		},
-  |id-w     = id box width
+		"brdrthic": {
-  |id-h     = id box height
+			"label": "Border Thickness",
-  |info     = info text
+			"description": "How thick is the border around the userbox?",
-  |info-c   = info background color
+			"example": "1-3 is recommended",
-  |info-fc  = info font color
+			"suggestedvalues": [
-  |info-s   = info text size
+				"1",
-  |info-p   = info padding (distance between cell contents & cell border)
+				"2",
-  |info-lh  = info line height (or distance in between text lines)
+				"3"
-  |info-op  = info other (CSS) parameter(s)
+			],
-  |border-c = box color
+			"default": "2",
-  |border-s = border width in pixels
+			"type": "number"
-}}
+		},
-</PRE>
+		"brdrclr": {
+			"label": "Border Color",
-[[Category:Templates]]
+			"description": "What color is the border around the userbox?",
-[[Category:Userboxes]]
+			"example": "Black; #000000",
+			"suggestedvalues": [
+				"black",
+				"white",
+				"blue",
+				"red",
+				"yellow"
+			],
+			"default": "black",
+			"type": "string"
+		},
+		"bgclr": {
+			"label": "Background Color",
+			"description": "Userbox background color",
+			"example": "pink, #fd1668",
+			"type": "string",
+			"suggestedvalues": [
+				"grey",
+				"blue",
+				"pink",
+				"yellow"
+			]
+		},
+		"img": {
+			"label": "Image",
+			"description": "What image will you have to the left?",
+			"example": "Freshlycat.png",
+			"type": "wiki-file-name",
+			"suggested": true
+		},
+		"txclr": {
+			"label": "Text colour",
+			"description": "The text color",
+			"example": "black , #000000",
+			"type": "string",
+			"suggestedvalues": [
+				"black",
+				"white",
+				"blue",
+				"pink",
+				"yellow"
+			]
+		},
+		"text": {
+			"label": "Text in the userbox",
+			"description": "What do you want your userbox to say?",
+			"example": "This user is silly",
+			"type": "string",
+			"required": true
+		}
+	},
+	"paramOrder": [
+		"brdrthic",
+		"brdrclr",
+		"bgclr",
+		"img",
+		"txclr",
+		"text",
+		"1"
+	],
+	"description": "A userbox to customize your profile with. Use https://cssgradient.io/ to get a gradient on your userbox, copy only \"linear-gradient(0deg, rgba(000,000,00,1) 00%, rgba(000,000,00,1) 00%)\" and paste that into \"Background Color\""
+}
+</templatedata>
 </noinclude>