User:Fen/ContentBox: Difference between revisions

Line 1:

<div>

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

</div>

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

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

</div>

</includeonly><noinclude>{{documentation}}</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}}}; 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>
-      '''[[{{{1}}}|<span style="color:{{{4}}}">{{#if:{{{2|}}}|{{{2}}}|{{{1}}}}}</span>]]'''
+  <!-- Top bar with background -->
-    </div>
+   <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="width: 18px; height: 18px; text-align: center;">
+     <div>'''[[{{{1}}}|<span style="color:{{{4|inherit}}}">{{#if:{{{2|}}}|{{{2}}}|{{{1}}}}}</span>]]'''</div>
-      [[{{#if:{{{7|}}}|{{{7}}}|Main Page}}|<span title="Go to main page" role="button" style="color:{{{4}}}; text-decoration: none;">✖</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>
-   <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: 100%;">{{:{{{1}}}}}</div>
-  </div>
 </div>
 </includeonly><noinclude>{{documentation}}</noinclude>