User:Fen/ContentBox: Difference between revisions

(11 intermediate revisions by the same user not shown)

Line 1:

<div>

'''[[{{{1}}}|<span style="color:{{{4}}}">{{#if:{{{2|}}}|{{{2}}}|{{{1}}}}}</span>]]'''

~~</div>~~

~~<div style="width: 18px; height: 18px; text-align: center;">~~

<div style="padding-left: 5px;">'''[[{{{1}}}|<span style="color: {{{4|inherit}}}">{{#if:{{{2|}}}|{{{2}}}|{{{1}}}}}</span>]]'''

~~[[{{#if:{{{7|}}}|{{{7}}}|Main Page}}|<span title="Go to main page" role="button" style="color:{{{4}}}; text-decoration: none;">✖</span>]]~~

</div>

</div>

{{:{{{1}}}}}

</div>

</includeonly><noinclude>{{~~documentation~~}}</noinclude>

</includeonly>

== 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>

@@ Line 1: / Line 1: @@
 <includeonly>
-<div style="background: {{{5|#ababff}}}; color: {{{4|black}}}; text-align: left; overflow: hidden; box-shadow: 0 0 4px rgba(0,0,0,0.2); border-radius: 6px; padding: 0.5em;">
+<!-- Outer wrapper with fixed width -->
-   <div style="display: flex; justify-content: space-between; align-items: center;">
+<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;">
-     <div>
-      '''[[{{{1}}}|<span style="color:{{{4}}}">{{#if:{{{2|}}}|{{{2}}}|{{{1}}}}}</span>]]'''
+  <!-- Top bar with no padding -->
-    </div>
+   <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 style="width: 18px; height: 18px; text-align: center;">
+     <div style="padding-left: 5px;">'''[[{{{1}}}|<span style="color: {{{4|inherit}}}">{{#if:{{{2|}}}|{{{2}}}|{{{1}}}}}</span>]]'''
-      [[{{#if:{{{7|}}}|{{{7}}}|Main Page}}|<span title="Go to main page" role="button" style="color:{{{4}}}; 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>
-   <div style="margin-top: 0.5em; max-height: {{#if:{{{3|}}}|{{{3}}}|450}}px; overflow-y: auto; background-color: white; color: black; padding: 10px; border-radius: 4px;">
+  <!-- Inner content area fills rest of box height -->
-    {{:{{{1}}}}}
+   <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>
 </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>