User:Fen/ContentBox: Difference between revisions

Latest revision as of 01:15, 27 July 2025

Documentation[edit | edit source]

This template creates a fixed-size styled box with a top bar and included content.

Parameters[edit | edit source]

1 (required): Page name to include and link in the title bar.
2 (optional): Override text for the link title. If empty, uses parameter 1.
4 (optional): Text and icon color. Default is 'inherit'.
5 (optional): Top bar background color. Default is '#d0d8ff'.
6 (optional): Width of the outer box (e.g., '400px'). Default is '400px'.
7 (optional): Height of the outer box (e.g., '400px'). Default is '400px'.
8 (optional): Close button link target. Defaults to 'Main Page'.
9 (optional): Border and shadow color. Default is '#4a6fa5'.

Usage[edit | edit source]

{{ContnetBox|PageName|OptionalTitle|TextColor|TopBarColor|Width|Height|CloseLink|BorderColor}}

The box will display the link title. The close button links to the specified page.

@@ Line 1: / Line 1: @@
 <includeonly>
 <!-- Outer wrapper with fixed width -->
-<div style="width: {{{6|400px}}}; height: {{{7|400px}}}; background-color: transparent; color: {{{4|inherit}}}; text-align: left; overflow: hidden; border: 1px solid {{{9|{{{4|inherit}}}}}}; box-shadow: 0 0 4px {{{9|{{{4|rgba(0,0,0,0.3)}}}}}}; border-radius: 6px; padding: 0.5em; box-sizing: border-box;">
+<div style="width: {{{6|400px}}}px; height: {{{7|400px}}}px; background-color: transparent; color: {{{4|inherit}}}; text-align: left; overflow: hidden; border: 1px solid {{{3|#4a6fa5}}}; box-shadow: 0 0 4px {{{3|#4a6fa5}}}; border-radius: 6px; box-sizing: border-box;">
-   <!-- Top bar with background -->
+   <!-- Top bar with no padding -->
-   <div style="background-color: {{{5|#d0d8ff}}}; border-radius: 4px 4px 0 0; padding: 0.3em 0.6em; display: flex; justify-content: space-between; align-items: center;">
+   <div style="background-color: {{{5|#d0d8ff}}}; border-radius: 4px 4px 0 0; display: flex; justify-content: space-between; align-items: center; padding: 0; margin: 0;">
-     <div>'''[[{{{1}}}|<span style="color:{{{4|inherit}}}">{{#if:{{{2|}}}|{{{2}}}|{{{1}}}}}</span>]]'''</div>
+     <div style="padding-left: 5px;">'''[[{{{1}}}|<span style="color: {{{4|inherit}}}">{{#if:{{{2|}}}|{{{2}}}|{{{1}}}}}</span>]]'''
-    <div style="width: 18px; height: 18px; text-align: center;">[[{{#if:{{{8|}}}|{{{8}}}|Main Page}}|<span title="Go to main page" role="button" style="color:{{{4|inherit}}}; text-decoration: none;">✖</span>]]
      </div>
+    <div style="padding-right: 5px; text-align: center;"> <span role="button" style="color: {{{4|inherit}}}; text-decoration: none;"><small>{{{8|}}}</small></span></div>
    </div>
    <!-- Inner content area fills rest of box height -->
-   <div style="background-color: transparent; padding: 10px; overflow-y: auto; border-radius: 0 0 5px 5px; box-sizing: border-box; overflow-y: scroll; height: 100%;">{{:{{{1}}}}}</div>
+   <div style="background-color: transparent; padding: 10px; overflow-y: auto; border-radius: 0 0 5px 5px; box-sizing: border-box; overflow-y: scroll; height: 97%; color: initial;">{{:{{{1}}}}}</div>
 </div>
-</includeonly><noinclude>{{documentation}}</noinclude>
+</includeonly>
+<noinclude>
+== Documentation ==
+This template creates a fixed-size styled box with a top bar and included content.
+=== Parameters ===
+# '''1''' (required): Page name to include and link in the title bar.
+# '''2''' (optional): Override text for the link title. If empty, uses parameter 1.
+# '''4''' (optional): Text and icon color. Default is 'inherit'.
+# '''5''' (optional): Top bar background color. Default is '#d0d8ff'.
+# '''6''' (optional): Width of the outer box (e.g., '400px'). Default is '400px'.
+# '''7''' (optional): Height of the outer box (e.g., '400px'). Default is '400px'.
+# '''8''' (optional): Close button link target. Defaults to 'Main Page'.
+# '''9''' (optional): Border and shadow color. Default is '#4a6fa5'.
+=== Usage ===
+<pre>
+{{ContnetBox|PageName|OptionalTitle|TextColor|TopBarColor|Width|Height|CloseLink|BorderColor}}
+</pre>
+The box will display the link title. The close button links to the specified page.
+</noinclude>