User:Levi_OP/Header/doc

This is a documentation subpage for User:Levi OP/Header.
It may contain usage information, categories and other content that is not part of the original user template page.

This is a template you can use to get the same rainbow (or any color you want) header on your page. I've seen that other people are trying to use it, so I'm making this template to make it easier. This template can be used in tandem with {{User:Levi OP/Header button}} for buttons underneath the header.

Usage

Basic Usage

To use the template in its raw state how I originally made it, you can use no parameters, with just the text you want.

{{User:Levi_OP/Header|Welcome to my page!}}

Customizing the header

To customize the different aspects of the template, you can use the various css parameters included. All parameters expect CSS units, not including a semicolon (;). If you don't know what this means, or don't know how to use something, you could google the parameters, or ask me on my talk page.

{{User:Levi_OP/Header| <!-- Text that will be displayed -->
| background    = <!-- Background color / gradient of the header -->
| color         = <!-- Color of the text -->
| font-size     = <!-- Font size of the text -->
| border-radius = <!-- How curved the borders will be -->
| padding       = <!-- Amount of padding on the text --> 
| border        = <!-- CSS property for the width and color of the border -->
| text-shadow   = <!-- CSS property for the border of the text, as well as the shadow of the text -->
| display       = <!-- CSS property for the display type of the header element -->
| text-align    = <!-- Alignment of the text in the header --> 
| custom-style  = <!-- Any extra CSS styling that you might need to add to make it look how you want --> 
}}

Here is what the template defaults to, so that you can fiddle with the values individually:

{{User:Levi_OP/Header|Welcome to my page!
| background    = linear-gradient(to left, violet, indigo, blue, green, yellow, orange, red)
| color         = white
| font-size     = 5vw
| border-radius = 10px
| padding       = 3px
| border        = 3px solid black
| text-shadow   = -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black, -4px 2px 1px black
| display       = block
| text-align    = center
}}