Template:Chat window - Revision history

Intheworstways: Made every color a variable. Descriptions of variables shouldn't be included in the template but let me know if something breaks.

Intheworstways — Wed, 29 Jun 2016 06:19:49 GMT

Made every color a variable. Descriptions of variables shouldn't be included in the template but let me know if something breaks.

←Older revision		Revision as of 06:19, 29 June 2016
Line 1:		Line 1:
-	<table width="100%" style="border: 1px solid #ee0000; background: #ee0000">	+	<table width="100%" style="border: 1px solid {{{bgcolor\|#ee0000}}}; background: {{{bgcolor\|#ee0000}}}">
	<tr>		<tr>
-	<td bgcolor="#ee0000" valign="middle" align="middle" width="100%" colspan="3"> <b>{{{Chatroomname}}}</b>	+	<td bgcolor="{{{bgcolor\|#ee0000}}}" valign="middle" align="middle" width="100%" colspan="3"> <font color={{{chatroomnamecolor\|black}}}><b>{{{Chatroomname}}}</b></font color>
	</td></tr>		</td></tr>
	<tr>		<tr>
-	<td bgcolor="#ee0000" valign="top" colspan="2"> <div style="height:250px;width:600px;border:5px solid #ccc;background:white;font:16px/26px Roboto, Helvetica, Sans-Serif;overflow:auto;">	+	<td bgcolor="{{{bgcolor\|#ee0000}}}" valign="top" colspan="2"> <div style="height:250px;width:600px;border:5px solid {{{textbordercolor\|#ccc}}};background:{{{textbackground\|white}}};font:16px/26px Roboto, Helvetica, Sans-Serif;overflow:auto;">
	{{{Chattext}}}		{{{Chattext}}}
	</div>		</div>
-	</td><td bgcolor="{{{color}}}" valign="top" width="84%"> '''Users:'''	+	</td><td bgcolor="{{{color\|#fff0ff}}}" valign="top" width="84%"> '''Users:'''
	{{{Users}}}		{{{Users}}}
	</td></tr>		</td></tr>
	<tr>		<tr>
-	<td bgcolor="#ee0000" valign="top" colspan="2">	+	<td bgcolor="{{{bgcolor\|#ee0000}}}" valign="top" colspan="2">
-	</td><td bgcolor="#fff0ff" valign="middle" align="middle" width="84%" rowspan=2> {{{Chaticon}}}	+	</td><td bgcolor="{{{color\|#fff0ff}}}" valign="middle" align="middle" width="84%" rowspan=2> {{{Chaticon}}}
	</td></tr>		</td></tr>
	<tr>		<tr>
-	<td bgcolor="#ee0000" valign="top"> <div style="height:100px;width:550px;border:5px solid #ccc;background:white;font:16px/26px Roboto, Helvetica, sans-Serif;overflow:auto;">	+	<td bgcolor="{{{bgcolor\|#ee0000}}}" valign="top"> <div style="height:100px;width:550px;border:5px solid {{{textbordercolor\|#ccc}}};background:{{{textbackground\|white}}};font:16px/26px Roboto, Helvetica, sans-Serif;overflow:auto;">
	{{{Chatoptions}}}</div>		{{{Chatoptions}}}</div>
-	</td><td bgcolor="#ee0000" valign="top"> <p style="display:inline-block; height: auto; background: #e5e5e5; position: relative; margin: 1px 0 1px 1px; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; text-align:center; padding-top: 45px; padding-bottom: 45px; padding-left: 10px; padding-right: 10px;">Send</p>	+	</td><td bgcolor="{{{bgcolor\|#ee0000}}}" valign="top"> <p style="display:inline-block; height: auto; background: {{{sendbuttoncolor\|#e5e5e5}}}; position: relative; margin: 1px 0 1px 1px; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; text-align:center; padding-top: 45px; padding-bottom: 45px; padding-left: 10px; padding-right: 10px;">Send</p>
	</td></tr>		</td></tr>
	</table>		</table>

-	<noinclude>[[Category:Templates]]</noinclude>	+	<noinclude>
		+
		+	Variables for use with the template.
		+
		+	'''Color''' = color for background of user list and chaticon. This and all other color variables can accept anything that would go in after color= such as "red" or "#e5e5e5”. Yes I know just naming it "color" is confusing but it was the first one I tested to see if it was possible to change colors like this, so I'm just going to leave it be.
		+
		+	'''Users''' = list of users currently in the chatroom. Should be used to identify who the player cracter is chatting with either by their username or by their name, however you feel like going about it.
		+
		+	'''Chaticon''' = ideally where the user icon of the player character would go, if you can work out how to add one that doesn't break the rest of the window.
		+
		+	'''Bgcolor''' = color for chat window background, as in the header and outlines of everything else.
		+
		+	'''Chatroomname''' = the name of the chatroom. Can be the name of the person the player character is chatting with, can be a title for the chatroom, can even just be "chatroom" if you don't want to come up with something.
		+
		+	'''Chatroomnamecolor''' = font color for the title of the chatroom.
		+
		+	'''Textbordercolor''' = color for the border of the message field and the "options" field which corresponds with where one would be typing outgoing messages.
		+
		+	'''Textbackgroundcolor''' = color for the background of the message and options fields.
		+
		+	'''Chattext''' = body of the chat. Messages between characters in the chatroom.
		+
		+	'''Chatoptions''' = options worded as responses to the messages above, though not all options necessarily have to be in this field. They could be in the body of the chat, or even outside the chat window depending on the context.
		+
		+	'''Sendbuttoncolor''' = color of the send button.
		+
		+	[[Category:Templates]]</noinclude>

Intheworstways: Testing something.

Intheworstways — Sun, 26 Jun 2016 06:24:21 GMT

Testing something.

←Older revision		Revision as of 06:24, 26 June 2016
Line 7:		Line 7:
	{{{Chattext}}}		{{{Chattext}}}
	</div>		</div>
-	</td><td bgcolor="~~#fff0ff~~" valign="top" width="84%"> '''Users:'''	+	</td><td bgcolor="{{{color}}}" valign="top" width="84%"> '''Users:'''
	{{{Users}}}		{{{Users}}}
	</td></tr>		</td></tr>

Intheworstways: Nicer looking? I still think it's missing some things but I think I'm on the right track here.

Intheworstways — Wed, 22 Jun 2016 08:23:24 GMT

Nicer looking? I still think it's missing some things but I think I'm on the right track here.

←Older revision		Revision as of 08:23, 22 June 2016
Line 1:		Line 1:
-	<table width="100%">	+	<table width="100%" style="border: 1px solid #ee0000; background: #ee0000">
	<tr>		<tr>
-	<td bgcolor="#ee0000" valign="~~top~~" width="100%" colspan="3"> <b>{{{Chatroomname}}}</b>	+	<td bgcolor="#ee0000" valign="middle" align="middle" width="100%" colspan="3"> <b>{{{Chatroomname}}}</b>
	</td></tr>		</td></tr>
	<tr>		<tr>
-	<td bgcolor="#~~ffffff~~" valign="top" colspan="2"> <div style="height:250px;width:600px;border:5px solid #ccc;font:16px/26px ~~Georgia~~, ~~Garamond~~, Serif;overflow:auto;">	+	<td bgcolor="#ee0000" valign="top" colspan="2"> <div style="height:250px;width:600px;border:5px solid #ccc;background:white;font:16px/26px Roboto, Helvetica, Sans-Serif;overflow:auto;">
	{{{Chattext}}}		{{{Chattext}}}
	</div>		</div>
Line 12:		Line 12:
	<tr>		<tr>
	<td bgcolor="#ee0000" valign="top" colspan="2">		<td bgcolor="#ee0000" valign="top" colspan="2">
-	</td><td bgcolor="#fff0ff" valign="~~top~~" width="84%" rowspan=2> {{{Chaticon}}}	+	</td><td bgcolor="#fff0ff" valign="middle" align="middle" width="84%" rowspan=2> {{{Chaticon}}}
	</td></tr>		</td></tr>
	<tr>		<tr>
-	<td bgcolor="#~~ffffff~~" valign="top"> <div style="height:100px;width:550px;border:5px solid #ccc;font:16px/26px ~~Georgia~~, ~~Garamond~~, Serif;overflow:auto;">	+	<td bgcolor="#ee0000" valign="top"> <div style="height:100px;width:550px;border:5px solid #ccc;background:white;font:16px/26px Roboto, Helvetica, sans-Serif;overflow:auto;">
	{{{Chatoptions}}}</div>		{{{Chatoptions}}}</div>
-	</td><td bgcolor="#~~ffffff~~" valign="top"> <p style="display:inline-block; height: auto; background: #e5e5e5; position: relative; margin: 1px 0 1px 1px; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; text-align:center; padding-top: 45px; padding-bottom: 45px; padding-left: 10px; padding-right: 10px;">Send</p>	+	</td><td bgcolor="#ee0000" valign="top"> <p style="display:inline-block; height: auto; background: #e5e5e5; position: relative; margin: 1px 0 1px 1px; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; text-align:center; padding-top: 45px; padding-bottom: 45px; padding-left: 10px; padding-right: 10px;">Send</p>
	</td></tr>		</td></tr>
	</table>		</table>

	<noinclude>[[Category:Templates]]</noinclude>		<noinclude>[[Category:Templates]]</noinclude>

Intheworstways at 00:24, 21 June 2016

Intheworstways — Tue, 21 Jun 2016 00:24:08 GMT

←Older revision		Revision as of 00:24, 21 June 2016
Line 20:		Line 20:
	</td></tr>		</td></tr>
	</table>		</table>
		+
		+	<noinclude>[[Category:Templates]]</noinclude>

Intheworstways: Trying this out.

Intheworstways — Tue, 21 Jun 2016 00:19:00 GMT

Trying this out.

New page

<table width="100%">
<tr>
<td bgcolor="#ee0000" valign="top" width="100%" colspan="3"> <b>{{{Chatroomname}}}</b>
</td></tr>
<tr>
<td bgcolor="#ffffff" valign="top" colspan="2"> <div style="height:250px;width:600px;border:5px solid #ccc;font:16px/26px Georgia, Garamond, Serif;overflow:auto;">
{{{Chattext}}}
</div>
</td><td bgcolor="#fff0ff" valign="top" width="84%"> '''Users:'''
{{{Users}}}
</td></tr>
<tr>
<td bgcolor="#ee0000" valign="top" colspan="2">
</td><td bgcolor="#fff0ff" valign="top" width="84%" rowspan=2> {{{Chaticon}}}
</td></tr>
<tr>
<td bgcolor="#ffffff" valign="top"> <div style="height:100px;width:550px;border:5px solid #ccc;font:16px/26px Georgia, Garamond, Serif;overflow:auto;">
{{{Chatoptions}}}</div>
</td><td bgcolor="#ffffff" valign="top"> <p style="display:inline-block; height: auto; background: #e5e5e5; position: relative; margin: 1px 0 1px 1px; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; text-align:center; padding-top: 45px; padding-bottom: 45px; padding-left: 10px; padding-right: 10px;">Send</p>
</td></tr>
</table>