Anonymous user
Forum:New Metabox development: Difference between revisions
m
Modifying slightly to add in old metabox code, so template will display as originally intended
imported>LostInRiverview No edit summary |
imported>LostInRiverview m (Modifying slightly to add in old metabox code, so template will display as originally intended) |
||
| (29 intermediate revisions by 5 users not shown) | |||
Line 1:
{{Forumheader|Community discussions|archive}}
{{Closed|res|New Metabox design has been implemented and bug-fixed. If there are any additional issues with the template, please post them on the [[The Sims Wiki talk:Development Portal|dev portal talk page]].}}
''The following text has been relocated from [[Forum:New theme proposal]]:''
On the subject of updating {{t|Metabox}}, I accidentally worked up this as a new style of message box. What do you think?
{|class="roundborder" style="border: 1px solid #{{#if:|{{{bordercolor}}}|{{MetaboxBorder|info}}}}; background: #{{#if:|{{{backgroundcolor}}}|{{MetaboxBG|info}}}}; -moz-border-radius:5px; border-radius:5px; border-left: 10px solid #{{#if:|{{{bordercolor}}}|{{MetaboxBorder|info}}}}; border-right: 1px solid #{{#if:|{{{bordercolor}}}|{{MetaboxBorder|info}}}}; {{#ifeq:{{{size}}}|small|font-size: 90%; margin-right:5px; line-height:120%;" width={{#if:|"{{{width}}}%"|"45%"}} align="left"|font-size: 100%; line-height:120%;" width={{#if:|"{{{width}}}%"|"85%"}} align="center"}}
{{#if:Feeling_Green_smiley.png|{{!}}width={{#if:|"{{{imagewidth}}}"|"{{#ifeq:{{{size}}}|small|50px|60px}}"}} align="center"{{!}}[[File:Feeling_Green_smiley.png|{{#if:|{{{imagesize}}}px|40px}}|{{#if:|link={{{imagelink}}}|}}]] }}
|'''This is Metabox
Hi, I'm Metabox! I'm sure I look familiar to you, don't I?
|}
<br/>
<center>
Line 103 ⟶ 108:
|type=cleanup
|image=TS4_duster_icon.png
|text = This {{#if:{{{2|}}}|{{{2}}}|article}} requires a '''cleanup''' to meet The Sims Wiki's [[The Sims Wiki:Manual of Style|quality standards]].
|size=small
}}{{clr}}
Line 171 ⟶ 176:
{{clrl}}</div></center>
}}{{#if:|{{#ifeq:{{NAMESPACE}}| | [[Category:{{{cat}}}|{{#if:|{{{catsort}}}|{{{PAGENAME}}}}}]]|}}|}}{{#if: | | {{#ifeq:{{NAMESPACE}}|Template|[[Category:Templates using Metabox2|{{PAGENAME}}]]|}}}}
::Additionally, I've fixed yet another problem, having to do with the margins not being set correctly on small versions when an image is not specified. And I've removed the resizing right margin for text, meaning that no matter what size is used, the right margin for the text will remain 5px. This is to prevent a situation where the image size would cause the text to be squeezed together, since the margins of both the left and right sides were set by the imagesize parameter. -- '''[[User:LostInRiverview|<font color="navy">LostInRiverview</font>]]<sup> [[User_talk:LostInRiverview|<font color="green">talk</font>]] • [[User_blog:LostInRiverview|<font color="green">blog</font>]] • [[Special:Contributions/LostInRiverview|<font color="green">contribs</font>]]</sup>''' 07:03, April 3, 2015 (UTC)
:::I was thinking of the same thing about taking the height of the largest element, but thought that it would take a complicated process. I also did notice the squeezed text problem, since the right padding depends on the width of the image. Making the right padding have a fixed length is a better solution. It seems that you've resolved both issues. [[User:Nikel23|'''<span style="color:#007FFF; text-shadow: #ACE5EE 0 4px 4px;">Nikel</span>''']] [[User talk:Nikel23|<span style="color: #30D5C8 ; text-shadow: #00FFEF 0 4px 4px;"><sub>''Talk''</sub></span>]] <sub>–</sub> [[The Sims Wiki:Featured Media/Voting|<span style="color:red ; text-shadow:#E97451 0 4px 4px;"><sub>''Vote!''</sub></span>]] 07:13, April 3, 2015 (UTC)
::::Can you think of anything else that needs to be fixed or that should be adjusted? I'm pretty satisfied with the appearance of it and I think that we've likely worked most of the bugs out of it (one can hope, at least). I'd say we're ready to implement the new design in place of {{t|Metabox}}. Of course I don't want to rush to that point, if you or anyone else has any particular issues. -- '''[[User:LostInRiverview|<font color="navy">LostInRiverview</font>]]<sup> [[User_talk:LostInRiverview|<font color="green">talk</font>]] • [[User_blog:LostInRiverview|<font color="green">blog</font>]] • [[Special:Contributions/LostInRiverview|<font color="green">contribs</font>]]</sup>''' 07:23, April 3, 2015 (UTC)
:::::None at the moment. It's difficult to produce a bug intentionally. It's easier for a bug to surface when we use the template along the way so we can fix it. It might not be a safe path, but if we keep waiting until the template is 100% bug-free, it will never be finished. The template is good enough to use, IMO. After all, I'm not the one who extensively tested it, so I might not have encountered as many bugs as you have. [[User:Nikel23|'''<span style="color:#007FFF; text-shadow: #ACE5EE 0 4px 4px;">Nikel</span>''']] [[User talk:Nikel23|<span style="color: #30D5C8 ; text-shadow: #00FFEF 0 4px 4px;"><sub>''Talk''</sub></span>]] <sub>–</sub> [[The Sims Wiki:Featured Media/Voting|<span style="color:red ; text-shadow:#E97451 0 4px 4px;"><sub>''Vote!''</sub></span>]] 07:30, April 3, 2015 (UTC)
==Merging into Metabox==
Based on the work that we've done above, I think we're nearing the point where we can move the code from Metabox2 into Metabox itself, thus completing the template redesign. Of course, copy/pasting the code from Metabox2 to Metabox would be a simple matter, but I think it would be useful to preserve the edit history on Metabox2, especially as multiple people have worked on it and there were numerous bugfixes included in the diffs and edit summaries. That being said, page history merges are somewhat complicated even on small-scale pages. Metabox, however, is a ''major'' template on the wiki. Even if the merge isn't botched in some way, deleting then re-creating a template used by dozens of other templates and on tens of thousands of pages seems like it would cause lots of problems. Is there some way that we can merge the page histories without major headaches? Perhaps Staff assistance? -- '''[[User:LostInRiverview|<font color="navy">LostInRiverview</font>]]<sup> [[User_talk:LostInRiverview|<font color="green">talk</font>]] • [[User_blog:LostInRiverview|<font color="green">blog</font>]] • [[Special:Contributions/LostInRiverview|<font color="green">contribs</font>]]</sup>''' 00:32, April 4, 2015 (UTC)
:Just a thought, maybe you could just copypaste the code over from metabox2 to metabox and add a note of some sort, either through the template documentation, edit summaries or both to check the history of metabox2 to see how it was implemented. Obviously not ideal but there's no risk of anything going wrong here. {{WHsig|00:37, April 4, 2015 (UTC)}}
::That would work, on the condition that we don't delete Metabox2. We could set Metabox2 to redirect to Metabox, which would preserve its history. -- '''[[User:LostInRiverview|<font color="navy">LostInRiverview</font>]]<sup> [[User_talk:LostInRiverview|<font color="green">talk</font>]] • [[User_blog:LostInRiverview|<font color="green">blog</font>]] • [[Special:Contributions/LostInRiverview|<font color="green">contribs</font>]]</sup>''' 00:40, April 4, 2015 (UTC)
:::Wogan's idea was also my idea. Deleting Metabox to move Metabox2 over and then undeleting everything makes for an unfun ride. Especially considering that Metabox is used on tens of thousands of pages, and it may cause issues on lots of pages while we're at it. --I am [[User:K6ka|'''<span style="color:#0040FF">k6ka</span>''']] [[User talk:K6ka|<span style="color:#0080FF"><sup>Talk to me!</sup></span>]] [[Special:Contributions/K6ka|<span style="color:#0B4C5F"><sub>See what I have done</sub></span>]] 01:06, April 4, 2015 (UTC)
==Bug reports==
As the merge is now complete, we are now using the newest version of {{t|Metabox}}! However, there may still be some snakes in the grass, so bugs and glitches with the template may be present.
'''Please leave any bug reports or issues with the template below.''' --I am [[User:K6ka|'''<span style="color:#0040FF">k6ka</span>''']] [[User talk:K6ka|<span style="color:#0080FF"><sup>Talk to me!</sup></span>]] [[Special:Contributions/K6ka|<span style="color:#0B4C5F"><sub>See what I have done</sub></span>]] 13:28, April 4, 2015 (UTC)
:I believe I have found a bug related to the {{t|Metabox}}, although I don't know exactly what it is. If you look [[Spells_(The_Sims_2:_Apartment_Life)|here]], you will see something odd with the move metabox. -- [[User:Icemandeaf|Icemandeaf]] ([[User talk:Icemandeaf|talk]]) 17:03, April 4, 2015 (UTC)
::{{VoteFor}} '''Fixed''' by [[User:LostInRiverview|LostInRiverview]]. --I am [[User:K6ka|'''<span style="color:#0040FF">k6ka</span>''']] [[User talk:K6ka|<span style="color:#0080FF"><sup>Talk to me!</sup></span>]] [[Special:Contributions/K6ka|<span style="color:#0B4C5F"><sub>See what I have done</sub></span>]] 17:12, April 4, 2015 (UTC)
:::{{ec}} Fixed. The {{t|Move}} template was missing a closing tag on an element on the template, which goofed up Metabox. I fixed the code on {{t|Move}} so it should be okay now. -- '''[[User:LostInRiverview|<font color="navy">LostInRiverview</font>]]<sup> [[User_talk:LostInRiverview|<font color="green">talk</font>]] • [[User_blog:LostInRiverview|<font color="green">blog</font>]] • [[Special:Contributions/LostInRiverview|<font color="green">contribs</font>]]</sup>''' 17:12, April 4, 2015 (UTC)
[[File:Metabox_redesign_2015_clipping_error.jpg|500px|right]]
::::Here's another error. As you can see, Metabox clips into and "falls behind" the image posted on the right of [[Small pet]]. I'd be curious to see whether the same issue occurred with the old Metabox template... I'll do some testing. -- '''[[User:LostInRiverview|<font color="navy">LostInRiverview</font>]]<sup> [[User_talk:LostInRiverview|<font color="green">talk</font>]] • [[User_blog:LostInRiverview|<font color="green">blog</font>]] • [[Special:Contributions/LostInRiverview|<font color="green">contribs</font>]]</sup>''' 15:07, April 6, 2015 (UTC)
:::::Okay, it has been a couple days, and to be honest I haven't been able to fix a couple problems with the template. There is the matter that I pointed out above, but a more serious problem has also presented itself. On a number of articles where Metabox is used alongside an infobox, the box itself "falls behind" the infobox, especially on lower resolution displays. By some stroke of luck, the text on the metabox does not fall behind the infobox but actually wraps as necessary, but the box-behind-infobox still looks bad. If anyone wants to experiment with possible fixes, I've created a [[Template:Metabox/test|test template]] for Metabox; the first version of that page in the page history is identical to the current Metabox design, so you can use that as a base to make changes. I'll keep looking at it but this might be beyond my level of knowledge to fix. Worst-case scenario, we do have a few drastic options. First, I can hard-code a maximum width to the template and force the template to always display as left-aligned, so that the template will never interfere with an infobox. Alternatively, we can roll back to the old Metabox design, which I've tested and does not display the same problem (that trait in itself might also lend itself to a solution to the problem). Obviously, these are last-ditch ideas. -- '''[[User:LostInRiverview|<font color="navy">LostInRiverview</font>]]<sup> [[User_talk:LostInRiverview|<font color="green">talk</font>]] • [[User_blog:LostInRiverview|<font color="green">blog</font>]] • [[Special:Contributions/LostInRiverview|<font color="green">contribs</font>]]</sup>''' 05:50, April 9, 2015 (UTC)
{{od|:::::}}Right now, I have a ''somewhat fix'' to this problem, on [[Template:Metabox/test]]. The test version of the template will no longer overlap with or be overlapped by infobox templates. However, the template has a default width and it will not display in the correct location if that default width exceeds what is available to it; instead, the template will be pushed down the page until a suitable space is found to display at specified width. What we need is a template that will base its width on the space available to it, not on the size of the page itself. On top of this, the new code doesn't display the template in the same way that the current code does. This doesn't affect it functionally, but it would be nice to get the fixed Metabox and current Metabox to look the same. -- '''[[User:LostInRiverview|<font color="navy">LostInRiverview</font>]]<sup> [[User_talk:LostInRiverview|<font color="green">talk</font>]] • [[User_blog:LostInRiverview|<font color="green">blog</font>]] • [[Special:Contributions/LostInRiverview|<font color="green">contribs</font>]]</sup>''' 16:28, April 9, 2015 (UTC)
:This is probably not much different than the fix you just mentioned (although I haven't been able to look at it more closely), but what about adding the style "display:table-cell;" to the main DIV? -- [[User:Icemandeaf|Icemandeaf]] ([[User talk:Icemandeaf|talk]]) 19:17, April 9, 2015 (UTC)
::There's a few things to consider when looking at this. For ease of reference, I've constructed a simple table comparing and contrasting the four Metabox designs we have - the old Metabox design which was recently replaced, the current Metabox, the revamped form of Metabox on the test page, and a form of Metabox based on Icemandeaf's suggested fix.
{| class="wikitable heading-blue" width="90%"
!Items
![http://sims.wikia.com/wiki/Template:Metabox?oldid=641015 Old Metabox]
![[Template:Metabox|Current Metabox]]
![[Template:Metabox/test|Current Test design]]
![http://sims.wikia.com/wiki/User:LostInRiverview/Test4?oldid=664860 Icemandeaf's suggestion]
|-
|Collides with/overlaps floating elements
|bgcolor="lightgreen"|No
|bgcolor="pink"|Yes
|bgcolor="lightgreen"|No
|bgcolor="lightgreen"|No
|-
|Fits alongside floating elements
|bgcolor="lightgreen"|Yes
|bgcolor="lightyellow"|Partially
|bgcolor="pink"|No
|bgcolor="lightgreen"|Yes
|-
|Re-sizable
|bgcolor="lightgreen"|Yes
|bgcolor="lightgreen"|Yes
|bgcolor="lightgreen"|Yes
|bgcolor="pink"|No
|}
::Icemandeaf's design is the best of the three "new" designs, in that it actually works. However, it doesn't have an adjustable width. The width of the template is completely dependent on the width of the content within it, bound only by the size of the space that it can occupy. Is there a way around that issue? -- '''[[User:LostInRiverview|<font color="navy">LostInRiverview</font>]]<sup> [[User_talk:LostInRiverview|<font color="green">talk</font>]] • [[User_blog:LostInRiverview|<font color="green">blog</font>]] • [[Special:Contributions/LostInRiverview|<font color="green">contribs</font>]]</sup>''' 20:20, April 9, 2015 (UTC)
:::At first I didn't understand what you meant, but now I do. How about placing the style in the center tag instead. Does that help? -- [[User:Icemandeaf|Icemandeaf]] ([[User talk:Icemandeaf|talk]]) 22:27, April 9, 2015 (UTC)
::::I don't understand what you mean. -- '''[[User:LostInRiverview|<font color="navy">LostInRiverview</font>]]<sup> [[User_talk:LostInRiverview|<font color="green">talk</font>]] • [[User_blog:LostInRiverview|<font color="green">blog</font>]] • [[Special:Contributions/LostInRiverview|<font color="green">contribs</font>]]</sup>''' 23:20, April 9, 2015 (UTC)
:::::I could be wrong, but I see a <nowiki><center></nowiki> just above the DIV. Since placing "display:table-cell;" within the same DIV that has the width adjustable counteracts the ability to adjust the width, placing it in the element just above it should make it so the resizing is still possible. So that is why I was saying to place the styling in the center tag like this: <nowiki><center style="display:table-cell;"></nowiki> -- [[User:Icemandeaf|Icemandeaf]] ([[User talk:Icemandeaf|talk]]) 23:33, April 9, 2015 (UTC)
::::::It appears to work as intended. Looking on the Sandbox, the design does not collide with floating elements (infoboxes and images), fits alongside instead of wrapping down, and is re-sizable. -- '''[[User:LostInRiverview|<font color="navy">LostInRiverview</font>]]<sup> [[User_talk:LostInRiverview|<font color="green">talk</font>]] • [[User_blog:LostInRiverview|<font color="green">blog</font>]] • [[Special:Contributions/LostInRiverview|<font color="green">contribs</font>]]</sup>''' 23:59, April 9, 2015 (UTC)
:::::::Everything I said above is true, however there is a problem - the template still defaults to the width of the content inside it. Observe:
{{#ifeq:{{{size}}}|small|
<div style="background: #{{#if:|{{{backgroundcolor}}}|{{MetaboxBG|official }} }}; border: 1px solid #E0E0E0; text-align: left; width: {{#if:|{{{width}}}%|40%}}; box-shadow: 1px 1px 3px #777; min-height: 45px; margin-bottom: 1px;">{{#if:Moodlet_no_frame_ask_sim_to_take_a_test.png|<div style="float: left; width: {{#expr: 45 + 5}}px; margin-left: 3px; position: absolute;">[[File:Moodlet_no_frame_ask_sim_to_take_a_test.png|center|{{#if:|{{{imagesize}}}px|45px}}]]</div>|}}<div style="background: #{{#if:|{{{headercolor}}}|{{#if:|{{{bordercolor}}}|{{MetaboxHeader|official }} }} }}; width: auto; margin: 3px;{{#if:Moodlet_no_frame_ask_sim_to_take_a_test.png| padding-left:{{#expr: 45 + 5}}px;| padding-left: 5px;}} font-side: 95%; font-weight: bold; text-shadow: 1px 1px 2px #333; color: white; box-shadow: 1px 1px 3px #777;">{{#if: Metabox "current design"|Metabox "current design"| }}</div><div style="padding-bottom: 3px; {{#if:Moodlet_no_frame_ask_sim_to_take_a_test.png|margin-left: {{#expr: 45 + 5}}px;|margin-left: 5px;}} margin-right: 5px; font-size: 90%;">
Text</div>
</div>
|<center>
<div style="background: #{{#if:|{{{backgroundcolor}}}|{{MetaboxBG|official }} }}; border: 1px solid #E0E0E0; text-align: left; width: {{#if: |{{{width}}}%|85%}}; box-shadow: 1px 1px 3px #777; min-height: 60px; margin-bottom: 1px;">{{#if:Moodlet_no_frame_ask_sim_to_take_a_test.png|<div style="float: left; width: {{#expr: 60 + 5}}px; margin-left: 5px; position: absolute;">[[File:Moodlet_no_frame_ask_sim_to_take_a_test.png|center|{{#if:|{{{imagesize}}}px|60px}}]]</div>|}}<div style="background: #{{#if:|{{{headercolor}}}|{{#if:|{{{bordercolor}}}|{{MetaboxHeader|official }} }} }}; width: auto; margin: 5px;{{#if:Moodlet_no_frame_ask_sim_to_take_a_test.png| padding-left:{{#expr: 60 + 5}}px;| padding-left: 5px;}} font-side: 110%; font-weight: bold; text-shadow: 1px 1px 2px #333; color: white; box-shadow: 1px 1px 3px #777;">{{#if: Metabox "current design"|Metabox "current design"| }}</div><div style="padding-bottom: 5px;{{#if:Moodlet_no_frame_ask_sim_to_take_a_test.png|margin-left: {{#expr: 60 + 10}}px;|margin-left: 5px;}} margin-right: 5px;">
Text</div>
{{clrl}}</div></center>
}}{{#if:|{{#ifeq:{{NAMESPACE}}| | [[Category:{{{cat}}}|{{#if:|{{{catsort}}}|{{{PAGENAME}}}}}]]|}}|}}{{#if: | | {{#ifeq:{{NAMESPACE}}|Template|[[Category:Templates using Metabox|{{PAGENAME}}]]|}}}}
{{#ifeq:{{{size}}}|small|
<div style="background: #{{#if:|{{{backgroundcolor}}}|{{MetaboxBG|official }} }}; display:table-cell; border: 1px solid #E0E0E0; text-align: left; width: {{#if:|{{{width}}}%|40%}}; box-shadow: 1px 1px 3px #777; min-height: 45px; margin-bottom: 1px;">{{#if:Moodlet_no_frame_ask_sim_to_take_a_test.png|<div style="float: left; width: {{#expr: 45 + 5}}px; margin-left: 3px; position: absolute;">[[File:Moodlet_no_frame_ask_sim_to_take_a_test.png|center|{{#if:|{{{imagesize}}}px|45px}}]]</div>|}}<div style="background: #{{#if:|{{{headercolor}}}|{{#if:|{{{bordercolor}}}|{{MetaboxHeader|official }} }} }}; width: auto; margin: 3px;{{#if:Moodlet_no_frame_ask_sim_to_take_a_test.png| padding-left:{{#expr: 45 + 5}}px;| padding-left: 5px;}} font-side: 95%; font-weight: bold; text-shadow: 1px 1px 2px #333; color: white; box-shadow: 1px 1px 3px #777;">{{#if: Metabox "fixed design"|Metabox "fixed design"| }}</div><div style="padding-bottom: 3px; {{#if:Moodlet_no_frame_ask_sim_to_take_a_test.png|margin-left: {{#expr: 45 + 5}}px;|margin-left: 5px;}} margin-right: 5px; font-size: 90%;">
Text</div>
</div>
|<center><div style="display: table-cell;">
<div style="background: #{{#if:|{{{backgroundcolor}}}|{{MetaboxBG|official }} }}; border: 1px solid #E0E0E0; text-align: left; width: {{#if: |{{{width}}}%|85%}}; box-shadow: 1px 1px 3px #777; min-height: 60px; margin-bottom: 1px;">{{#if:Moodlet_no_frame_ask_sim_to_take_a_test.png|<div style="float: left; width: {{#expr: 60 + 5}}px; margin-left: 5px; position: absolute;">[[File:Moodlet_no_frame_ask_sim_to_take_a_test.png|center|{{#if:|{{{imagesize}}}px|60px}}]]</div>|}}<div style="background: #{{#if:|{{{headercolor}}}|{{#if:|{{{bordercolor}}}|{{MetaboxHeader|official }} }} }}; width: auto; margin: 5px;{{#if:Moodlet_no_frame_ask_sim_to_take_a_test.png| padding-left:{{#expr: 60 + 5}}px;| padding-left: 5px;}} font-side: 110%; font-weight: bold; text-shadow: 1px 1px 2px #333; color: white; box-shadow: 1px 1px 3px #777;">{{#if: Metabox "fixed design"|Metabox "fixed design"| }}</div><div style="padding-bottom: 5px;{{#if:Moodlet_no_frame_ask_sim_to_take_a_test.png|margin-left: {{#expr: 60 + 10}}px;|margin-left: 5px;}} margin-right: 5px;">
Text</div>
{{clrl}}</div></div></center>
}}
{{#ifeq:{{{size}}}|small|
<div style="background: #{{#if:|{{{backgroundcolor}}}|{{MetaboxBG|official }} }}; display:table-cell; border: 1px solid #E0E0E0; text-align: left; width: {{#if:50|50%|40%}}; box-shadow: 1px 1px 3px #777; min-height: 45px; margin-bottom: 1px;">{{#if:Moodlet_no_frame_ask_sim_to_take_a_test.png|<div style="float: left; width: {{#expr: 45 + 5}}px; margin-left: 3px; position: absolute;">[[File:Moodlet_no_frame_ask_sim_to_take_a_test.png|center|{{#if:|{{{imagesize}}}px|45px}}]]</div>|}}<div style="background: #{{#if:|{{{headercolor}}}|{{#if:|{{{bordercolor}}}|{{MetaboxHeader|official }} }} }}; width: auto; margin: 3px;{{#if:Moodlet_no_frame_ask_sim_to_take_a_test.png| padding-left:{{#expr: 45 + 5}}px;| padding-left: 5px;}} font-side: 95%; font-weight: bold; text-shadow: 1px 1px 2px #333; color: white; box-shadow: 1px 1px 3px #777;">{{#if: Metabox "fixed design" with set width 50% and text|Metabox "fixed design" with set width 50% and text| }}</div><div style="padding-bottom: 3px; {{#if:Moodlet_no_frame_ask_sim_to_take_a_test.png|margin-left: {{#expr: 45 + 5}}px;|margin-left: 5px;}} margin-right: 5px; font-size: 90%;">
{{Lorem Ipsum}}</div>
</div>
|<center><div style="display: table-cell;">
<div style="background: #{{#if:|{{{backgroundcolor}}}|{{MetaboxBG|official }} }}; border: 1px solid #E0E0E0; text-align: left; width: {{#if: 50|50%|85%}}; box-shadow: 1px 1px 3px #777; min-height: 60px; margin-bottom: 1px;">{{#if:Moodlet_no_frame_ask_sim_to_take_a_test.png|<div style="float: left; width: {{#expr: 60 + 5}}px; margin-left: 5px; position: absolute;">[[File:Moodlet_no_frame_ask_sim_to_take_a_test.png|center|{{#if:|{{{imagesize}}}px|60px}}]]</div>|}}<div style="background: #{{#if:|{{{headercolor}}}|{{#if:|{{{bordercolor}}}|{{MetaboxHeader|official }} }} }}; width: auto; margin: 5px;{{#if:Moodlet_no_frame_ask_sim_to_take_a_test.png| padding-left:{{#expr: 60 + 5}}px;| padding-left: 5px;}} font-side: 110%; font-weight: bold; text-shadow: 1px 1px 2px #333; color: white; box-shadow: 1px 1px 3px #777;">{{#if: Metabox "fixed design" with set width 50% and text|Metabox "fixed design" with set width 50% and text| }}</div><div style="padding-bottom: 5px;{{#if:Moodlet_no_frame_ask_sim_to_take_a_test.png|margin-left: {{#expr: 60 + 10}}px;|margin-left: 5px;}} margin-right: 5px;">
{{Lorem Ipsum}}</div>
{{clrl}}</div></div></center>
}}
{{#ifeq:{{{size}}}|small|
<div style="background: #{{#if:|{{{backgroundcolor}}}|{{MetaboxBG|official }} }}; display:table-cell; border: 1px solid #E0E0E0; text-align: left; width: {{#if:50|50%|40%}}; box-shadow: 1px 1px 3px #777; min-height: 45px; margin-bottom: 1px;">{{#if:Moodlet_no_frame_ask_sim_to_take_a_test.png|<div style="float: left; width: {{#expr: 45 + 5}}px; margin-left: 3px; position: absolute;">[[File:Moodlet_no_frame_ask_sim_to_take_a_test.png|center|{{#if:|{{{imagesize}}}px|45px}}]]</div>|}}<div style="background: #{{#if:|{{{headercolor}}}|{{#if:|{{{bordercolor}}}|{{MetaboxHeader|official }} }} }}; width: auto; margin: 3px;{{#if:Moodlet_no_frame_ask_sim_to_take_a_test.png| padding-left:{{#expr: 45 + 5}}px;| padding-left: 5px;}} font-side: 95%; font-weight: bold; text-shadow: 1px 1px 2px #333; color: white; box-shadow: 1px 1px 3px #777;">{{#if: Metabox "fixed design" with set width 50%|Metabox "fixed design" with set width 50%| }}</div><div style="padding-bottom: 3px; {{#if:Moodlet_no_frame_ask_sim_to_take_a_test.png|margin-left: {{#expr: 45 + 5}}px;|margin-left: 5px;}} margin-right: 5px; font-size: 90%;">
No text</div>
</div>
|<center><div style="display: table-cell;">
<div style="background: #{{#if:|{{{backgroundcolor}}}|{{MetaboxBG|official }} }}; border: 1px solid #E0E0E0; text-align: left; width: {{#if: 50|50%|85%}}; box-shadow: 1px 1px 3px #777; min-height: 60px; margin-bottom: 1px;">{{#if:Moodlet_no_frame_ask_sim_to_take_a_test.png|<div style="float: left; width: {{#expr: 60 + 5}}px; margin-left: 5px; position: absolute;">[[File:Moodlet_no_frame_ask_sim_to_take_a_test.png|center|{{#if:|{{{imagesize}}}px|60px}}]]</div>|}}<div style="background: #{{#if:|{{{headercolor}}}|{{#if:|{{{bordercolor}}}|{{MetaboxHeader|official }} }} }}; width: auto; margin: 5px;{{#if:Moodlet_no_frame_ask_sim_to_take_a_test.png| padding-left:{{#expr: 60 + 5}}px;| padding-left: 5px;}} font-side: 110%; font-weight: bold; text-shadow: 1px 1px 2px #333; color: white; box-shadow: 1px 1px 3px #777;">{{#if: Metabox "fixed design" with set width 50%|Metabox "fixed design" with set width 50%| }}</div><div style="padding-bottom: 5px;{{#if:Moodlet_no_frame_ask_sim_to_take_a_test.png|margin-left: {{#expr: 60 + 10}}px;|margin-left: 5px;}} margin-right: 5px;">
No text</div>
{{clrl}}</div></div></center>
}}
:::::::Now, the template is set to have a default width of 85%, but it's being ignored unless there's enough text to fill the template. The same goes for a customized width - the width is only used if the text inside goes from end to end. -- '''[[User:LostInRiverview|<font color="navy">LostInRiverview</font>]]<sup> [[User_talk:LostInRiverview|<font color="green">talk</font>]] • [[User_blog:LostInRiverview|<font color="green">blog</font>]] • [[Special:Contributions/LostInRiverview|<font color="green">contribs</font>]]</sup>''' 00:53, April 10, 2015 (UTC)
::::::::Hmm... that's odd. That is completely not the behavior that I was expecting. How about using an overflow style instead of the display style. I think "overflow: auto;" or "overflow: hidden;" should get the behavior I was expecting. -- [[User:Icemandeaf|Icemandeaf]] ([[User talk:Icemandeaf|talk]]) 03:30, April 10, 2015 (UTC)
{{od|::::::::}}Okay, it looks like ''that'' fixed it (knock on wood). Let's run down the checklist.
*Re-sizeable - '''check'''
*No collision - '''check'''
*Displays alongside floated elements - '''check'''
*Defaults to specified size - '''check'''
Alright. Who wants to test it some more? -- '''[[User:LostInRiverview|<font color="navy">LostInRiverview</font>]]<sup> [[User_talk:LostInRiverview|<font color="green">talk</font>]] • [[User_blog:LostInRiverview|<font color="green">blog</font>]] • [[Special:Contributions/LostInRiverview|<font color="green">contribs</font>]]</sup>''' 03:52, April 10, 2015 (UTC)
:I tested it out on some problem pages, and have noticed that the problems are fixed. As such, I've implemented the code to the main template, since the bug that exited was pretty significant. If there are additional issues we can resolve them in due course. Hopefully there are not. -- '''[[User:LostInRiverview|<font color="navy">LostInRiverview</font>]]<sup> [[User_talk:LostInRiverview|<font color="green">talk</font>]] • [[User_blog:LostInRiverview|<font color="green">blog</font>]] • [[Special:Contributions/LostInRiverview|<font color="green">contribs</font>]]</sup>''' 04:15, April 10, 2015 (UTC)
----
I came across a minor bug with {{t|Fanon-premade}} where the image extends well below the metabox. -- [[User:Icemandeaf|Icemandeaf]] ([[User talk:Icemandeaf|talk]]) 04:50, April 13, 2015 (UTC)
:Okay, I've looked into it. The issue lies in how the image is displayed. We were forced to set the image to <code>display: absolute</code> in order to prevent other problems. This unfortunately means that {{t|clr}} or setting <code>clear: left</code> or <code>clear: both</code> in the code simply won't work. If we could clear, it would force the box to re-size to match image size. The workaround that was implemented involves setting the height of the box (the outermost div tags containing the main box style) to be determined by the image size as specified by default (60px) or by the parameter imagesize. However, the size changes ''horizontal'', not ''vertical'' size of the image. Most of the images that we tend to use are icons and are generally square-ish or wider than they are tall. So my recommendation in this case is to make edits to the templates on an individual basis, to re-size the image to fit appropriately.
:'''Tl:dr''' Bug won't affect most uses of the template, and fixing it would cause other more significant problems. Unless of course there's a way to have our cake and eat it too, as it were. - '''[[User:LostInRiverview|<font color="navy">LostInRiverview</font>]]<sup> [[User_talk:LostInRiverview|<font color="green">talk</font>]] • [[User_blog:LostInRiverview|<font color="green">blog</font>]] • [[Special:Contributions/LostInRiverview|<font color="green">contribs</font>]]</sup>''' 06:21, April 13, 2015 (UTC)
| |||