Template:Optin/Default: Difference between revisions
Jump to navigation
Jump to search
Content deleted Content added
No edit summary |
trying focus method instead |
||
| (13 intermediate revisions by the same user not shown) | |||
| Line 2: | Line 2: | ||
<fieldset class="optin-options"> |
<fieldset class="optin-options"> |
||
<legend></html>{{Translated|Template:OptinText/Question}}<html></legend> |
<legend></html>{{Translated|Template:OptinText/Question}}<html></legend> |
||
<span id="error-optin" class="lp-error" style="display: none;"> |
|||
</html>{{int:donate_interface-error-msg-opt_in}}<html> |
|||
</span> |
|||
<ul> |
<ul> |
||
<li> |
<li> |
||
| Line 16: | Line 13: | ||
</ul> |
</ul> |
||
<div class="optin-no-prompt" data-is-translated="</html>{{IsTranslated|Template:OptinText/PromptNo|{{int:lang}}}}<html>"> |
<div class="optin-no-prompt" data-is-translated="</html>{{IsTranslated|Template:OptinText/PromptNo|{{int:lang}}}}<html>"> |
||
<div class="optin-no-prompt__no"></div> |
<div class="optin-no-prompt__no"></html>{{Translated|Template:OptinText/PromptNo}}<html></div> |
||
<div class="optin-no-prompt__yes"></div> |
<div class="optin-no-prompt__yes"></html>{{Translated|Template:OptinText/PromptYes}}<html></div> |
||
</div> |
|||
<div id="error-optin" class="lp-error" style="display: none;" tabindex="-1"><!-- tabindex="-1" allows focus with js so it can be announced --> |
|||
</html>{{Translated|Template:OptinText/PleaseSelect}}<html> |
|||
</div> |
</div> |
||
<div class="optin-smallprint links-in-new-tab"> |
<div class="optin-smallprint links-in-new-tab"> |
||
| Line 23: | Line 23: | ||
</div> |
</div> |
||
</fieldset> |
</fieldset> |
||
<style> |
|||
/* --- Opt-in --- */ |
|||
.optin-options { |
|||
padding: 0 4px !important; |
|||
} |
|||
.optin-options legend { |
|||
padding: 0; |
|||
font-size: inherit; |
|||
font-weight: bold; |
|||
} |
|||
.optin-options ul { |
|||
list-style: none; |
|||
margin: 0; |
|||
} |
|||
.optin-options li { |
|||
display: table; |
|||
} |
|||
.lp-radio { |
|||
display: table-cell; |
|||
vertical-align: top; |
|||
margin: 7px 8px 8px 2px; |
|||
cursor: pointer; |
|||
} |
|||
.lp-radio-label { |
|||
display: table-cell; |
|||
vertical-align: top; |
|||
padding: 4px 0; |
|||
white-space: normal; |
|||
font-size: 14px; |
|||
line-height: 18px; |
|||
font-weight: normal; |
|||
cursor: pointer; |
|||
} |
|||
.lp-radio-label:hover, |
|||
.lp-radio:focus + .lp-radio-label, |
|||
.lp-radio:hover + .lp-radio-label { |
|||
color: #36c; |
|||
text-decoration: none; |
|||
} |
|||
.optin-smallprint { |
|||
clear: both; |
|||
font-size: 12px; |
|||
line-height: 14px; |
|||
} |
|||
.optin-no-prompt { |
|||
display: none; |
|||
margin: 4px 0 8px 0; |
|||
padding: 6px; |
|||
border: 2px solid #900; |
|||
border-radius: 2px; |
|||
font-size: 14px; |
|||
line-height: 18px; |
|||
font-weight: normal; |
|||
} |
|||
.optin-no-prompt.is-positive { |
|||
border-color: #14866d; |
|||
font-weight: bold; |
|||
} |
|||
.optin-no-prompt__yes { |
|||
display: none; |
|||
} |
|||
.optin-no-prompt__no { |
|||
display: block; |
|||
} |
|||
.optin-no-prompt.is-positive .optin-no-prompt__yes { |
|||
display: block; |
|||
} |
|||
.optin-no-prompt.is-positive .optin-no-prompt__no { |
|||
display: none; |
|||
} |
|||
</style> |
|||
<script> |
|||
/* Called by Common.js */ |
|||
function initOptin() { |
|||
var language = mw.config.get('wgUserLanguage'); |
|||
var optinNoPrompts = { |
|||
'en' : { |
|||
'no' : "😔 Sorry to hear that. We don't email often; would you consider changing your mind?", |
|||
'yes' : "😍 Thanks for changing your mind! We'll respect your inbox." |
|||
}, |
|||
'it' : { |
|||
'no' : "😔 È un vero peccato. Non inviamo e-mail frequentemente; prenderesti in considerazione la possibilità di cambiare idea?", |
|||
'yes' : "😍 Grazie per aver cambiato idea! Avremo molto rispetto della tua casella di posta." |
|||
} |
|||
}; |
|||
optinNoPrompts['en-gb'] = optinNoPrompts['en']; |
|||
// Only do all this if we have translated prompts |
|||
if ( optinNoPrompts[language] ) { |
|||
$('.optin-no-prompt__no').text( optinNoPrompts[language].no ); |
|||
$('.optin-no-prompt__yes').text( optinNoPrompts[language].yes ); |
|||
$('.optin-options').on('click', function(){ |
|||
if ( $('#optin-no').is(':checked') ) { |
|||
$('.optin-no-prompt').removeClass('is-positive'); |
|||
if ( !$('.optin-no-prompt').is(':visible') ) { |
|||
$('.optin-no-prompt').slideDown(); |
|||
} |
|||
} else { |
|||
$('.optin-no-prompt').addClass('is-positive'); |
|||
} |
|||
}); |
|||
} |
|||
} |
|||
</script> |
|||
</html> |
</html> |
||
Latest revision as of 19:12, 20 November 2024