Difference between revisions of "Template:EventStoryHeader"

From Dragalia Lost Wiki
Jump to navigation Jump to search
>Discoomastar
>Boblers
(added missing div closer)
 
(28 intermediate revisions by 3 users not shown)
Line 9: Line 9:
 
{{{Summary|}}}
 
{{{Summary|}}}
 
{{{Dialogue|}}}
 
{{{Dialogue|}}}
--><div class="panel" style="margin:auto;min-width:250px;max-width:800px">
+
-->{{#widget:Template/EventStoryHeader/css}}<div class="panel" style="margin:auto;min-width:250px;max-width:800px">
 
<div class="panel-heading">
 
<div class="panel-heading">
 
{{#if: {{{EventType|}}} |
 
{{#if: {{{EventType|}}} |
 
<div style="font-size:small"><div>{{{EventType|}}} Event: [[{{{EventName|}}}]]</div></div>
 
<div style="font-size:small"><div>{{{EventType|}}} Event: [[{{{EventName|}}}]]</div></div>
 
}}
 
}}
<div style="position: relative; top: 0px; left: 0px; display:inline-block;">{{#css:
+
<div style="position: relative; top: 0px; left: 0px; display:inline-block;"><div class="ESH-thumbnail">[[File:{{{ThumbnailImage|}}}.png|link=]]</div>
.ESH-thumbnail {
 
position: relative;
 
top: 0px;
 
left: 0px;
 
}
 
.ESH-thumbnail img {
 
max-width:70vw;
 
height:auto;
 
}
 
}}<div class="ESH-thumbnail">[[File:{{{ThumbnailImage|}}}.png|link=]]</div>
 
 
<div style="position: absolute;width:100%;top: 50%;left: 50%;transform: translate(-50%, -50%);z-index: 99;color: #fff;text-shadow: -1px -1px 1px #000000, 1px -1px 1px #000000, -1px 1px 1px #000000, 1px 1px 1px #000000;font-size:.8em;">
 
<div style="position: absolute;width:100%;top: 50%;left: 50%;transform: translate(-50%, -50%);z-index: 99;color: #fff;text-shadow: -1px -1px 1px #000000, 1px -1px 1px #000000, -1px 1px 1px #000000, 1px 1px 1px #000000;font-size:.8em;">
 
<div style="font-size:small">{{{SectionName|}}}</div>
 
<div style="font-size:small">{{{SectionName|}}}</div>
Line 32: Line 22:
 
<div class="panel-body" style="padding:5px">
 
<div class="panel-body" style="padding:5px">
 
{{#if: {{{PreviousQuest|}}}|
 
{{#if: {{{PreviousQuest|}}}|
<div style="position:absolute;bottom:3px;font-size:smaller">
+
<div style="position:absolute;bottom:-2em;font-size:smaller">
 
<div style="font-weight:bold">Previous Quest</div>
 
<div style="font-weight:bold">Previous Quest</div>
 
<div>[[{{{PreviousQuest}}}]]</div></div>|
 
<div>[[{{{PreviousQuest}}}]]</div></div>|
<div style="position:absolute;bottom:3px;font-size:smaller">
+
<div style="position:absolute;bottom:-2em;font-size:smaller">
 
</div>
 
</div>
 
}}
 
}}
 
{{#if: {{{NextQuest|}}}|
 
{{#if: {{{NextQuest|}}}|
<div style="position:absolute;bottom:3px;right:5px;font-size:smaller;text-align:right">
+
<div style="position:absolute;bottom:-2em;right:5px;font-size:smaller;text-align:right">
 
<div style="font-weight:bold">Next Quest</div>
 
<div style="font-weight:bold">Next Quest</div>
 
<div>[[{{{NextQuest}}}]]</div></div>|
 
<div>[[{{{NextQuest}}}]]</div></div>|
<div style="position:absolute;bottom:3px;right:5px;font-size:smaller;text-align:right">
+
<div style="position:absolute;bottom:-2em;right:5px;font-size:smaller;text-align:right">
 
</div>
 
</div>
 
}}
 
}}
Line 55: Line 45:
 
<div style="padding:1em;">
 
<div style="padding:1em;">
 
<p style="margin:15px auto;border-bottom:1px solid;margin-bottom:15px;font-size:1.2em;font-variant-caps: small-caps;font-weight:bold">Dialogue</p>
 
<p style="margin:15px auto;border-bottom:1px solid;margin-bottom:15px;font-size:1.2em;font-variant-caps: small-caps;font-weight:bold">Dialogue</p>
{{#css:
+
<div class="event-dialogue"><div>{{{Dialogue|}}}
  
.event-dialogue > div > p {
+
</div><!--
    display: flex;
+
This extra div is apparently needed for stuff to work right. Just leave it. Also, the above line break is needed to make sure the last line doesn't wrap improperly.
    margin-bottom: 1em;
+
--></div>
    margin-top: 1.5em;
 
}
 
 
 
 
 
.event-dialogue > div > p > span,
 
.event-dialogue > div > p > a {
 
    margin-right: 1em;
 
    margin-top: -.5em;
 
    flex-shrink: 0;
 
}
 
 
 
}}<div class="event-dialogue">{{{Dialogue|}}}
 
 
</div>
 
</div>
 
</div>
 
</div>
 
}}[[Category:Event Story]]</includeonly><noinclude>[[Category:Templates]]</noinclude>
 
}}[[Category:Event Story]]</includeonly><noinclude>[[Category:Templates]]</noinclude>

Latest revision as of 21:29, 30 June 2020