Help:Coloring text - Revision history

Eric Martz: /* =Highlighting */

2024-12-21T19:33:44Z

=Highlighting

← Older revision		Revision as of 19:33, 21 December 2024
Line 42:		Line 42:
	which displays as '''{{Font color\|#00A0A0\|Cyan}}'''.		which displays as '''{{Font color\|#00A0A0\|Cyan}}'''.

	===Highlighting==		===Highlighting===
	A special template highlights text in yellow.		A special template highlights text in yellow.
	<pre>{{Yelspan\|highlighted}}</pre>		<pre>{{Yelspan\|highlighted}}</pre>

2024-12-21T19:33:27Z

Single Font Color Templates

← Older revision		Revision as of 19:33, 21 December 2024
Line 41:		Line 41:
	<pre>'''{{Font color\|#00A0A0\|Cyan}}'''</pre>		<pre>'''{{Font color\|#00A0A0\|Cyan}}'''</pre>
	which displays as '''{{Font color\|#00A0A0\|Cyan}}'''.		which displays as '''{{Font color\|#00A0A0\|Cyan}}'''.

			===Highlighting==
			A special template highlights text in yellow.
			<pre>{{Yelspan\|highlighted}}</pre>
			displays as {{Yelspan\|highlighted}}.

	==Class Color Spans==		==Class Color Spans==

2020-12-30T16:51:01Z

Class Color Spans

← Older revision		Revision as of 16:51, 30 December 2020
Line 94:		Line 94:
	* <span class="bg-lightgray">bg-lightgray</span>		* <span class="bg-lightgray">bg-lightgray</span>
	* <span class="text-gray">'''text-gray'''</span>		* <span class="text-gray">'''text-gray'''</span>
	* <span class="text-black">text-black</span>		* <span class="text-black">text-black</span> <span class="bg-black text-white">bg-black text-white</span>

	</td></tr></table>		</td></tr></table>

2020-12-28T21:18:15Z

Style Color Spans

← Older revision		Revision as of 21:18, 28 December 2020
Line 111:		Line 111:

	==Style Color Spans==		==Style Color Spans==
			This method works for page text, but '''does not work''' in captions for molecular scenes (green links).

	You can color using CSS spans: <span style="color:red;font-weight:bold;">Red</span>, which looks like this: <span style="color:red;font-weight:bold;">Red</span>. In addition to color names, you can use Red-Green-Blue [https://www.rapidtables.com/web/color/RGB_Color.html (RGB) hexadecimal codes] following "#", for example <span style="color:#8000ff;font-weight:bold;">Purple</span> which looks like this: <span style="color:#8000ff;font-weight:bold;">'''Purple'''</span>.		You can color using CSS spans: <span style="color:red;font-weight:bold;">Red</span>, which looks like this: <span style="color:red;font-weight:bold;">Red</span>. In addition to color names, you can use Red-Green-Blue [https://www.rapidtables.com/web/color/RGB_Color.html (RGB) hexadecimal codes] following "#", for example <span style="color:#8000ff;font-weight:bold;">Purple</span> which looks like this: <span style="color:#8000ff;font-weight:bold;">'''Purple'''</span>.

2020-12-28T20:59:04Z

Class Color Spans

← Older revision		Revision as of 20:59, 28 December 2020
Line 43:		Line 43:

	==Class Color Spans==		==Class Color Spans==
	Class colors work for both dark and light colors. Use <b><span class="text-purple"> like this </span></b> that displays <b><span class="text-purple">like this</span></b>, or <span class="bg-yellowgreen"> like this </span> that displays <span class="bg-yellowgreen">like this</span>. This method works in all contexts but is limited to the pre-set colors below.		Class colors work for both dark and light colors. Use '''<b><span class="text-purple">like this</span></b>''' that displays <b><span class="text-purple">like this</span></b>, or '''<span class="bg-yellowgreen">like this</span>''' that displays <span class="bg-yellowgreen">like this</span>. This method works in all contexts but is limited to the pre-set colors below.

	Here is the main set of class colors available in Proteopedia. You will use each class combined with '''text-''' to color text, or '''bg-''' to color the background.		Here is the main set of class colors available in Proteopedia. You will use each class combined with '''text-''' to color text, or '''bg-''' to color the background.

2020-12-28T20:01:56Z

Class Color Spans

← Older revision		Revision as of 20:01, 28 December 2020
Line 73:		Line 73:

	</td><td style="border-left:1px solid gray;">		</td><td style="border-left:1px solid gray;">
	Spectral order		Spectral order
	* <span class="bg-pink">bg-pink</span>		* <span class="bg-pink">bg-pink</span>
	* <span class="text-red">'''text-red'''</span>		* <span class="text-red">'''text-red'''</span>

2020-12-28T20:01:40Z

Class Color Spans

← Older revision		Revision as of 20:01, 28 December 2020
Line 92:		Line 92:
	* <span class="bg-violet">bg-violet</span>		* <span class="bg-violet">bg-violet</span>
	* <span class="bg-white">bg-white</span>		* <span class="bg-white">bg-white</span>
	* <span class="bg-lightgray">bg-~~lighgray~~</span>		* <span class="bg-lightgray">bg-lightgray</span>
	* <span class="text-gray">'''text-gray'''</span>		* <span class="text-gray">'''text-gray'''</span>
	* <span class="text-black">text-black</span>		* <span class="text-black">text-black</span>

2020-12-28T18:06:35Z

Class Color Spans

← Older revision		Revision as of 18:06, 28 December 2020
Line 71:		Line 71:
	* <span class="bg-white">         </span>   white		* <span class="bg-white">         </span>   white
	</td><td>		</td><td>

	</td><td style="border-left:1px solid gray;">		</td><td style="border-left:1px solid gray;">
	Spectral order		Spectral order

2020-12-28T18:05:49Z

Class Color Spans

← Older revision		Revision as of 18:05, 28 December 2020
Line 71:		Line 71:
	* <span class="bg-white">         </span>   white		* <span class="bg-white">         </span>   white
	</td><td>		</td><td>

	</td><td style="border-left:1px solid gray;">		</td><td style="border-left:1px solid gray;">
	Spectral order		Spectral order

2020-12-28T18:05:25Z

Class Color Spans

← Older revision		Revision as of 18:05, 28 December 2020
Line 71:		Line 71:
	* <span class="bg-white">         </span>   white		* <span class="bg-white">         </span>   white
	</td><td>		</td><td>

			</td><td style="border-left:1px solid gray;">
	Spectral order		Spectral order
	* <span class="bg-pink">bg-pink</span>		* <span class="bg-pink">bg-pink</span>