Template:Quote fancy: Difference between revisions
m (NtCarlson moved page Template:ImageQuote to Template:Quote fancy) |
(Completed move) |
||
Line 1: | Line 1: | ||
<includeonly> | <includeonly> | ||
<!-- Import template-specific CSS --> | <!-- Import template-specific CSS --> | ||
<templatestyles src=" | <templatestyles src="Quote fancy/style.css" /> | ||
<div class="bg3wiki- | <div class="bg3wiki-fancy-quote" style="justify-content:{{{align|left}}}"> | ||
<!-- The template uses a 3x3 grid layout with the quote and author attribution fixed in the | <!-- The template uses a 3x3 grid layout with the quote and author attribution fixed in the | ||
center and center bottom positions respectively. Depending on the image-position param | center and center bottom positions respectively. Depending on the image-position param | ||
Line 17: | Line 17: | ||
| border-color = {{{image-border-color|}}} | | border-color = {{{image-border-color|}}} | ||
| style = grid-column:{{#ifeq:{{{image-position|}}}|right|3|1}} | | style = grid-column:{{#ifeq:{{{image-position|}}}|right|3|1}} | ||
| class = bg3wiki- | | class = bg3wiki-fancy-quote-image | ||
}}}} | }}}} | ||
<!-- Formatted quote --> | <!-- Formatted quote --> | ||
<blockquote style="font-size:{{{font-size|130%}}};" class="bg3wiki- | <blockquote style="font-size:{{{font-size|130%}}};" class="bg3wiki-fancy-quote-blockquote-{{{image-position|left}}}" > | ||
<div style="display:flex;align-items:center> | <div style="display:flex;align-items:center> | ||
<!-- Starting quotation mark. Aligned with the top-left corner of the quote text --> | <!-- Starting quotation mark. Aligned with the top-left corner of the quote text --> | ||
<div class="bg3wiki- | <div class="bg3wiki-fancy-quote-begin">“</div> | ||
<!-- Actual text of the quote --> | <!-- Actual text of the quote --> | ||
<div style="font-style:italic">{{{quote}}}</div> | <div style="font-style:italic">{{{quote}}}</div> | ||
<!-- Ending quotation mark. Aligned with the bottom-right corner of the quote text --> | <!-- Ending quotation mark. Aligned with the bottom-right corner of the quote text --> | ||
<div class="bg3wiki- | <div class="bg3wiki-fancy-quote-end">„</div> | ||
</div> | </div> | ||
</blockquote> | </blockquote> | ||
<!--- Optional author or attribution for the quote. Aligned with the bottom-right of the quote --> | <!--- Optional author or attribution for the quote. Aligned with the bottom-right of the quote --> | ||
{{#if:{{{author|}}}|<div class="bg3wiki- | {{#if:{{{author|}}}|<div class="bg3wiki-fancy-quote-author>— {{{author|}}}</div>}} | ||
</div> | </div> | ||
</div></includeonly><noinclude>{{documentation|content= | </div></includeonly><noinclude>{{documentation|content= | ||
Display a quote with an accompanying image | Display a fancily formatted quote with an (optional) accompanying image. | ||
Refer to [[Template:Image frame]] for the template used to render the image. | Refer to [[Template:Image frame]] for the template used to render the image. | ||
This template has an associated stylesheet at [[Template: | This template has an associated stylesheet at [[Template:Quote fancy/style.css]]. | ||
== Examples == | == Examples == | ||
Line 44: | Line 44: | ||
| style = list | | style = list | ||
| <nowiki> | | <nowiki> | ||
{{ | {{Quote fancy | ||
| quote = The operations of these huge steel juggernauts are powered by engines of churning hellfire. | | quote = The operations of these huge steel juggernauts are powered by engines of churning hellfire. | ||
| image = Portrait Steel Watcher.png | | image = Portrait Steel Watcher.png | ||
Line 51: | Line 51: | ||
</nowiki> | </nowiki> | ||
| <nowiki> | | <nowiki> | ||
{{ | {{Quote fancy | ||
| quote = These levitating eyes transmit all that they see to the one who created them. | | quote = These levitating eyes transmit all that they see to the one who created them. | ||
| image = Portrait Scrying Eye.png | | image = Portrait Scrying Eye.png | ||
Line 62: | Line 62: | ||
</nowiki> | </nowiki> | ||
| <nowiki> | | <nowiki> | ||
{{ | {{Quote fancy | ||
| quote = The strong embrace the wild that hides inside - keen instincts, primal physicality, and most of all, an unbridled, unquenchable rage. | | quote = The strong embrace the wild that hides inside - keen instincts, primal physicality, and most of all, an unbridled, unquenchable rage. | ||
| image = Class Barbarian Badge Icon.png | | image = Class Barbarian Badge Icon.png | ||
Line 73: | Line 73: | ||
</nowiki> | </nowiki> | ||
| <nowiki> | | <nowiki> | ||
{{ | {{Quote fancy | ||
| quote = Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. | | quote = Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. | ||
| image = Portrait Gale.png | | image = Portrait Gale.png |
Revision as of 00:11, 21 July 2024
Display a fancily formatted quote with an (optional) accompanying image.
Refer to Template:Image frame for the template used to render the image.
This template has an associated stylesheet at Template:Quote fancy/style.css.
Examples
{{Quote fancy | quote = The operations of these huge steel juggernauts are powered by engines of churning hellfire. | image = Portrait Steel Watcher.png | link = Adamantine Golem }}Renders as
{{Quote fancy | quote = These levitating eyes transmit all that they see to the one who created them. | image = Portrait Scrying Eye.png | author = In-game racial description of [[Scrying Eye]]s | link = Scrying Eye | height = 60 | font-size = 120% | align = center }}Renders as
{{Quote fancy | quote = The strong embrace the wild that hides inside - keen instincts, primal physicality, and most of all, an unbridled, unquenchable rage. | image = Class Barbarian Badge Icon.png | image-position = right | height = 160 | font-size = 120% | link = Barbarian | align = center }}Renders as
{{Quote fancy | quote = Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. | image = Portrait Gale.png | link = Gale | author = [[Gale]], casting Knuth's Magnificent Kerning | height = 60 | font-size = 100% | align = center | image-border-shape = diamond | image-border-width = 4 | image-border-color = black }}Renders as
Template data
Display a quote with an accompanying image which are aligned with each other
Parameter | Description | Type | Status | |
---|---|---|---|---|
Quote | quote | The quote | String | required |
Image | image | Add an image to go along with the quote.
| File | suggested |
Link | link | Clicking the image will link to the specified page instead of the image file.
| Page name | suggested |
Author | author | The author or context of the quote | String | optional |
Font size | font-size | Size of the font used for the quote.
| String | optional |
Alignment | align | Horizontal alignment of the quote.
| String | optional |
Image position | image-position | Position of the image relative to the quote.
| String | optional |
Image border width | image-border-width | Width in pixels of the border around the image. Set to 0 to completely disable this.
| Number | optional |
Image border shape | image-border-shape | Shape of the border frame which crops the image. This can be an arbitrary CSS clip-path or a predefined value. Refer to [[Template:Image frame]] for details. The default value of basic disables this.
| String | optional |
Image border color | image-border-color | Color of the image border. This can be a CSS color descriptor.
| String | optional |
Height | height | The height of the image in pixels.
| String | optional |