Bilingual Quotes

This will create quote blocks which change to a different language on hovering.

Utility

This adds another layer of immersion to the world, allowing the reader look at the "original" text of the quote. Showing it only on hovering avoids cluttering the article with confusing text.

Manufacturing

The Content

Where to insert it

The bilingual content is inserted as the text in a regular block quote.

What to insert

You need a section for either language, "conlang" and "english" in this example. Additionally, I recommend adding a section which hints at the hover functionality.

[quote] [section:conlang]Avéar ryn ných nol phó icýnéló?[/section][section:hint]hover to translate[/section][section:english]Did you run against a tree during childhood?[/section]|Eastern Hechalic phrase, used to call someone stupid [/quote]

The CSS to make it work

Toggling visibility

The sections need to be set to either be displayed or not, depending on the ":hover" state of the "blockquote" element.

If you have the visibility toggler activated in your world settings, it will override the styling of these sections and you will need to add the "!important" flag to enforce it. This also means that the visibility toggler will only work on the quote as a whole, but not its content.

.user-css blockquote .conlang,
.user-css blockquote:hover .hint,
.user-css blockquote:hover .english{
display:none !important;
}

.user-css blockquote:hover .conlang,
.user-css blockquote .hint,
.user-css blockquote .english{
display:inline!important;
}

Styling the hint

To position the hint as in the example, you can use the following CSS. This also includes the parameters for visually setting it apart from the quote in the background.

.user-css blockquote .hint{
position:absolute;
transform:translate(-25px,-25px);
padding:5px;
font-size:0.6em;
line-height:1.0em;
color: white;
background: gray;
box-shadow:3px 3px 5px black;
}

Table of Contents

Access & Availability

Grandmaster

Complexity

Sections, CSS

Discovery

inspired by a feature request for a new quote system, combined with my fascination for languages

Examples

Avéar ryn ných nol phó icýnéló?hover to translateDid you run against a tree during childhood?

— Eastern Hechalic phrase, used to call someone stupid

hover to translateI feel deeply honored to receive this award. I thank you for the trust that you placed in Ub Lenliz Lu Kegmilut, and I am proud to say that we delivered on our promises. But still, the greatest reward is to see the plants grow, blossom and bear fruit after all these years. We have shown that this world is far from dead. We have shown that there is a future waiting for us. And I promise you - I promise you all - that the feast we just shared will merely be the first of many to come.Hakru va iverasi pabsi, res vutga nu guleru. Reg sa o goduru va, re Ub Lenliz Lu Kegmilut o pampu panuboru, di muru pi iru va rengehaksi, si reg romupru reg vami pamemparuro reg va. Pa nontat limbil ulrep si iru, sil fitru di aguru di lingoru reg milut utgiru va, vuz reg ad nu. Gotruro reg va, sil ropibru keb iru sas nu vutgo. Gotruro reg va, sil reg va ki leniru muzu. Di reg sa o mupru va - reg sa bez mupru va - sil kongebla si, miz nu buzruro faf reg va, tud zatruta lu nomiz vombit iruni.

— Te-Sakal, upon being awarded the Spring Crab Medal