Merge pull request #12716 from edx/clrux/ac-484
AC-484 changing aria- to data-, a to button
This commit is contained in:
@@ -1,29 +1,30 @@
|
||||
<ul>
|
||||
<li class="calc-main">
|
||||
<a href="#" class="calc" title="Open Calculator" role="button" aria-controls="calculator_wrapper" aria-expanded="false">Open Calculator</a>
|
||||
<div class="calc-main">
|
||||
<button title="Open Calculator" aria-controls="calculator_wrapper" aria-expanded="false" class="calc utility-control-button">
|
||||
<span class="icon fa fa-calculator" aria-hidden="true"></span>
|
||||
</button>
|
||||
|
||||
<div id="calculator_wrapper">
|
||||
<form id="calculator">
|
||||
<div class="input-wrapper">
|
||||
<input type="text" id="calculator_input" tabindex="-1" />
|
||||
<div class="help-wrapper">
|
||||
<a id="calculator_hint" href="#" role="button" aria-haspopup="true" tabindex="-1">Hints</a>
|
||||
<ul id="calculator_input_help" class="help" aria-activedescendant="hint-integers" role="tooltip" aria-hidden="true">
|
||||
<li class="hint-item" id="hint-moreinfo" tabindex="-1">
|
||||
<p>
|
||||
<span class="bold">For detailed information, see
|
||||
<a id="hint-link-first" href="http://edx.readthedocs.io/projects/edx-guide-for-students/en/latest/completing_assignments/SFD_mathformatting.html#math-formatting">Entering Mathematical and Scientific Expressions</a> in the
|
||||
<a id="hint-link-second" href="http://edx-guide-for-students.readthedocs.io/en/latest/index.html">EdX Learner's Guide</a>.
|
||||
</span>
|
||||
</p>
|
||||
</li>
|
||||
<li class="hint-item" id="hint-integers" tabindex="-1"><p><span class="bold">Integers:</span> 2520</p></li>
|
||||
<li class="hint-item" id="hint-decimals" tabindex="-1"><p><span class="bold">Decimals:</span> 3.14 or .98</p></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<input id="calculator_button" type="submit" title="Calculate" arial-label="Calculate" value="=" tabindex="-1" />
|
||||
<input type="text" id="calculator_output" readonly tabindex="-1" />
|
||||
</form>
|
||||
<form id="calculator">
|
||||
<div class="input-wrapper">
|
||||
<input type="text" id="calculator_input" tabindex="-1" />
|
||||
<div class="help-wrapper">
|
||||
<button type="button" id="calculator_hint" aria-haspopup="true">Hints</button>
|
||||
<ul id="calculator_input_help" class="help" data-calculator-hint="hint-integers" role="tooltip" aria-hidden="true">
|
||||
<li class="hint-item" id="hint-moreinfo" tabindex="-1">
|
||||
<p>
|
||||
<span class="bold">For detailed information, see
|
||||
<a id="hint-link-first" href="http://edx.readthedocs.io/projects/edx-guide-for-students/en/latest/completing_assignments/SFD_mathformatting.html#math-formatting">Entering Mathematical and Scientific Expressions</a> in the
|
||||
<a id="hint-link-second" href="http://edx-guide-for-students.readthedocs.io/en/latest/index.html">EdX Learner's Guide</a>.
|
||||
</span>
|
||||
</p>
|
||||
</li>
|
||||
<li class="hint-item" id="hint-integers" tabindex="-1"><p><span class="bold">Integers:</span> 2520</p></li>
|
||||
<li class="hint-item" id="hint-decimals" tabindex="-1"><p><span class="bold">Decimals:/span> 3.14 or .98</p></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<input id="calculator_button" type="submit" title="Calculate" value="=" />
|
||||
<input type="text" id="calculator_output" tabindex="-1" readonly />
|
||||
</form>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
@@ -105,7 +105,7 @@ describe 'Calculator', ->
|
||||
|
||||
expect(element.focus).toHaveBeenCalled()
|
||||
expect(@calculator.activeHint).toEqual(element)
|
||||
expect(@calculator.hintPopup).toHaveAttr('aria-activedescendant', element.attr('id'))
|
||||
expect(@calculator.hintPopup).toHaveAttr('data-calculator-hint', element.attr('id'))
|
||||
|
||||
it 'select the first hint if argument element is not passed', ->
|
||||
@calculator.selectHint()
|
||||
|
||||
@@ -14,13 +14,15 @@
|
||||
class @Calculator
|
||||
constructor: ->
|
||||
@hintButton = $('#calculator_hint')
|
||||
@calcInput = $('#calculator_input')
|
||||
@hintPopup = $('.help')
|
||||
@hintsList = @hintPopup.find('.hint-item')
|
||||
@selectHint($('#' + @hintPopup.attr('aria-activedescendant')));
|
||||
@selectHint($('#' + @hintPopup.attr('data-calculator-hint')));
|
||||
|
||||
$('.calc').click @toggle
|
||||
$('form#calculator').submit(@calculate).submit (e) ->
|
||||
e.preventDefault()
|
||||
|
||||
@hintButton
|
||||
.click(($.proxy(@handleClickOnHintButton, @)))
|
||||
|
||||
@@ -34,6 +36,9 @@ class @Calculator
|
||||
.keyup($.proxy(@handleKeyUpOnHint, @))
|
||||
|
||||
@handleClickOnDocument = $.proxy(@handleClickOnDocument, @)
|
||||
|
||||
@calcInput
|
||||
.focus(($.proxy(@inputClickHandler, @)))
|
||||
|
||||
KEY:
|
||||
TAB : 9
|
||||
@@ -51,21 +56,19 @@ class @Calculator
|
||||
$calcWrapper = $('#calculator_wrapper')
|
||||
text = gettext('Open Calculator')
|
||||
isExpanded = false
|
||||
icon = 'fa-calculator'
|
||||
icon = 'fa-calculator'
|
||||
|
||||
$('div.calc-main').toggleClass 'open'
|
||||
$('.calc-main').toggleClass 'open'
|
||||
if $calc.hasClass('closed')
|
||||
$calcWrapper
|
||||
.find('input, a')
|
||||
.attr 'tabindex', -1
|
||||
.attr('aria-hidden', 'true')
|
||||
else
|
||||
text = gettext('Close Calculator')
|
||||
icon = 'fa-close'
|
||||
isExpanded = true
|
||||
|
||||
$calcWrapper
|
||||
.find('input, a')
|
||||
.attr 'tabindex', 0
|
||||
.attr('aria-hidden', 'false')
|
||||
# TODO: Investigate why doing this without the timeout causes it to jump
|
||||
# down to the bottom of the page. I suspect it's because it's putting the
|
||||
# focus on the text field before it transitions onto the page.
|
||||
@@ -84,12 +87,16 @@ class @Calculator
|
||||
.addClass(icon)
|
||||
|
||||
$calc.toggleClass 'closed'
|
||||
|
||||
inputClickHandler: ->
|
||||
$('#calculator_output').removeClass('has-result')
|
||||
|
||||
showHint: ->
|
||||
@hintPopup
|
||||
.addClass('shown')
|
||||
.attr('aria-hidden', false)
|
||||
|
||||
$('#calculator_output').removeClass('has-result')
|
||||
|
||||
$(document).on('click', @handleClickOnDocument)
|
||||
|
||||
@@ -97,6 +104,8 @@ class @Calculator
|
||||
@hintPopup
|
||||
.removeClass('shown')
|
||||
.attr('aria-hidden', true)
|
||||
|
||||
$('#calculator_output').removeClass('has-result')
|
||||
|
||||
$(document).off('click', @handleClickOnDocument)
|
||||
|
||||
@@ -106,7 +115,7 @@ class @Calculator
|
||||
|
||||
@activeHint = element;
|
||||
@activeHint.focus();
|
||||
@hintPopup.attr('aria-activedescendant', element.attr('id'));
|
||||
@hintPopup.attr('data-calculator-hint', element.attr('id'));
|
||||
|
||||
prevHint: () ->
|
||||
prev = @activeHint.prev(); # the previous hint
|
||||
@@ -211,4 +220,5 @@ class @Calculator
|
||||
$.getWithPrefix '/calculate', { equation: $('#calculator_input').val() }, (data) ->
|
||||
$('#calculator_output')
|
||||
.val(data.result)
|
||||
.addClass('has-result')
|
||||
.focus()
|
||||
|
||||
@@ -70,12 +70,12 @@
|
||||
}
|
||||
|
||||
#calculator_button {
|
||||
background: #111;
|
||||
border: 1px solid $black;
|
||||
background: $white;
|
||||
border: 1px solid $white;
|
||||
border-radius: 0;
|
||||
box-shadow: none;
|
||||
@include box-sizing(border-box);
|
||||
color: $white;
|
||||
color: $black;
|
||||
float: left;
|
||||
font-size: 30px;
|
||||
font-weight: bold;
|
||||
@@ -87,7 +87,8 @@
|
||||
width: flex-grid(.5) + flex-gutter();
|
||||
|
||||
&:hover, &:focus {
|
||||
color: $link-color;
|
||||
background: $blue-d2;
|
||||
color: $white;
|
||||
}
|
||||
|
||||
.calc-button-label {
|
||||
@@ -97,11 +98,11 @@
|
||||
}
|
||||
|
||||
#calculator_output {
|
||||
background: #111;
|
||||
border: 0;
|
||||
background: $white;
|
||||
border: 1px solid $white;
|
||||
box-shadow: none;
|
||||
@include box-sizing(border-box);
|
||||
color: $white;
|
||||
color: $black;
|
||||
float: left;
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
@@ -109,6 +110,11 @@
|
||||
padding: 10px;
|
||||
-webkit-appearance: none;
|
||||
width: flex-grid(4);
|
||||
|
||||
&.has-result {
|
||||
border: 1px solid $green-d1;
|
||||
box-shadow: inset 0px 0px ($baseline/3) $green-d1;
|
||||
}
|
||||
}
|
||||
|
||||
.input-wrapper {
|
||||
|
||||
@@ -1,144 +1,157 @@
|
||||
<%page expression_filter="h"/>
|
||||
|
||||
<%!
|
||||
from django.utils.translation import ugettext as _
|
||||
from django.core.urlresolvers import reverse
|
||||
from openedx.core.djangolib.markup import HTML, Text
|
||||
%>
|
||||
|
||||
<div class="calc-main">
|
||||
<button title="${_('Open Calculator')}" aria-controls="calculator_wrapper" aria-expanded="false" class="calc utility-control-button">
|
||||
<span class="icon fa fa-calculator" aria-hidden="true"></span>
|
||||
<span class="utility-control-label sr">${_("Open Calculator")}</span>
|
||||
</button>
|
||||
<button title="${_('Open Calculator')}" aria-controls="calculator_wrapper" aria-expanded="false" class="calc utility-control-button">
|
||||
<span class="icon fa fa-calculator" aria-hidden="true"></span>
|
||||
</button>
|
||||
|
||||
<div id="calculator_wrapper">
|
||||
<form id="calculator">
|
||||
<div class="input-wrapper">
|
||||
<label for="calculator_input" class="label-calc-input sr">${_('Enter equation')}</label>
|
||||
<input type="text" id="calculator_input" title="${_('Calculator Input Field')}" />
|
||||
|
||||
<div class="help-wrapper">
|
||||
<button type="button" title="${_('Hints')}" id="calculator_hint" aria-haspopup="true" aria-expanded="false" aria-controls="calculator_input_help"></button>
|
||||
<ul id="calculator_input_help" class="help" aria-hidden="true">
|
||||
<li class="hint-item" id="hint-moreinfo">
|
||||
<p class="sr">${_('Use the arrow keys to navigate the tips or use the tab key to return to the calculator')}</p>
|
||||
<p>
|
||||
<span class="bold">
|
||||
${Text(_("For detailed information, see {math_link_start}Entering Mathematical and Scientific Expressions{math_link_end} in the {guide_link_start}edX Guide for Students{guide_link_end}.")).format(
|
||||
math_link_start=HTML('<a href="http://edx.readthedocs.io/projects/edx-guide-for-students/en/latest/completing_assignments/SFD_mathformatting.html#math-formatting">'),
|
||||
math_link_end=HTML('</a>'),
|
||||
guide_link_start=HTML('<a href="http://edx-guide-for-students.readthedocs.io/en/latest/index.html">'),
|
||||
guide_link_end=HTML('</a>'),
|
||||
)}
|
||||
</span>
|
||||
</p>
|
||||
</li>
|
||||
<li class="hint-item" id="hint-tips"><p><span class="bold">${_("Tips")}:</span> </p>
|
||||
<ul>
|
||||
<li class="hint-item" id="hint-paren"><p>${_("Use parentheses () to make expressions clear. You can use parentheses inside other parentheses.")}</p></li>
|
||||
<li class="hint-item" id="hint-spaces"><p>${_("Do not use spaces in expressions.")}</p></li>
|
||||
<li class="hint-item" id="hint-howto-constants"><p>${_("For constants, indicate multiplication explicitly (example: 5*c).")}</p></li>
|
||||
<li class="hint-item" id="hint-howto-maffixes"><p>${_("For affixes, type the number and affix without a space (example: 5c).")}</p></li>
|
||||
<li class="hint-item" id="hint-howto-functions"><p>${_("For functions, type the name of the function, then the expression in parentheses.")}</p></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="hint-item" id="hint-list">
|
||||
<table class="calculator-input-help-table">
|
||||
<tbody>
|
||||
<tr>
|
||||
<th scope="col">${_("To Use")}</th>
|
||||
<th scope="col">${_("Type")}</th>
|
||||
<th scope="col">${_("Examples")}</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">${_("Numbers")}</th>
|
||||
<td>
|
||||
${_("Integers")}<br />
|
||||
${_("Fractions")}<br />
|
||||
${_("Decimals")}
|
||||
</td>
|
||||
<td>
|
||||
2520<br />
|
||||
2/3<br />
|
||||
3.14, .98
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">${_("Operators")}</th>
|
||||
## Translators: Please do not translate mathematical symbols.
|
||||
<td>
|
||||
${_("+ - * / (add, subtract, multiply, divide)")}<br />
|
||||
## Translators: Please do not translate mathematical symbols.
|
||||
${_("^ (raise to a power)")}<br />
|
||||
## Translators: Please do not translate mathematical symbols.
|
||||
${_("_ (add a subscript)")}<br />
|
||||
## Translators: Please do not translate mathematical symbols.
|
||||
${_("|| (parallel resistors)")}
|
||||
</td>
|
||||
<td>
|
||||
x+(2*y)/x-1
|
||||
x^(n+1)<br />
|
||||
v_IN+v_OUT<br />
|
||||
1||2
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">${_("Greek letters")}</th>
|
||||
<td>${_("Name of letter")}</td>
|
||||
<td>
|
||||
alpha<br />
|
||||
lambda
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">${_("Constants")}</th>
|
||||
<td>c, e, g, i, j, k, pi, q, T</td>
|
||||
<td>
|
||||
20*c<br />
|
||||
418*T
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">${_("Affixes")}</th>
|
||||
<td>${_("Percent sign (%) and metric affixes (d, c, m, u, n, p, k, M, G, T)")}</td>
|
||||
<td>
|
||||
20%<br />
|
||||
20c<br />
|
||||
418T
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">${_("Basic functions")}</th>
|
||||
<td>abs, exp, fact or factorial, ln, log2, log10, sqrt</td>
|
||||
<td>
|
||||
abs(x+y)<br />
|
||||
sqrt(x^2-y)
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">${_("Trigonometric functions")}</th>
|
||||
<td>
|
||||
sin, cos, tan, sec, csc, cot<br />
|
||||
arcsin, sinh, arcsinh, etc.<br />
|
||||
</td>
|
||||
<td>
|
||||
sin(4x+y)<br />
|
||||
arccsch(4x+y)
|
||||
</td>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
## Translators: Please see http://en.wikipedia.org/wiki/Scientific_notation
|
||||
<th scope="row">${_("Scientific notation")}</th>
|
||||
## Translators: 10^ is a mathematical symbol. Please do not translate.
|
||||
<td>${_("10^ and the exponent")}</td>
|
||||
<td>10^-9</td>
|
||||
</tr>
|
||||
<tr>
|
||||
## Translators: this is part of scientific notation. Please see http://en.wikipedia.org/wiki/Scientific_notation#E_notation
|
||||
<th scope="row">${_("e notation")}</th>
|
||||
## Translators: 1e is a mathematical symbol. Please do not translate.
|
||||
<td>${_("1e and the exponent")}</td>
|
||||
<td>1e-9</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="calculator_wrapper">
|
||||
<form id="calculator">
|
||||
<div class="input-wrapper">
|
||||
<label for="calculator_input" class="label-calc-input sr">${_('Calculator Input')}</label>
|
||||
<input type="text" id="calculator_input" title="${_('Calculator Input Field')}" />
|
||||
|
||||
<div class="help-wrapper">
|
||||
<p class="sr" id="hint-instructions">${_('Use the arrow keys to navigate the tips or use the tab key to return to the calculator')}</p>
|
||||
|
||||
<button id="calculator_hint" aria-haspopup="true" aria-expanded="false" aria-controls="calculator_input_help" aria-describedby="hint-instructions"><span class="calc-hint sr">${_("Hints")}</span></button>
|
||||
|
||||
<ul id="calculator_input_help" class="help" aria-hidden="true">
|
||||
<li class="hint-item" id="hint-moreinfo">
|
||||
<p><span class="bold">${_("For detailed information, see {math_link_start}Entering Mathematical and Scientific Expressions{math_link_end} in the {guide_link_start}edX Guide for Students{guide_link_end}.").format(
|
||||
math_link_start='<a href="http://edx.readthedocs.io/projects/edx-guide-for-students/en/latest/completing_assignments/SFD_mathformatting.html#math-formatting">',
|
||||
math_link_end='</a>',
|
||||
guide_link_start='<a href="http://edx-guide-for-students.readthedocs.io/en/latest/index.html">',
|
||||
guide_link_end='</a>',
|
||||
)}</span></p>
|
||||
</li>
|
||||
|
||||
<li class="hint-item" id="hint-tips"><p><span class="bold">${_("Tips")}:</span> </p>
|
||||
<ul>
|
||||
<li class="hint-item" id="hint-paren"><p>${_("Use parentheses () to make expressions clear. You can use parentheses inside other parentheses.")}</p></li>
|
||||
<li class="hint-item" id="hint-spaces"><p>${_("Do not use spaces in expressions.")}</p></li>
|
||||
<li class="hint-item" id="hint-howto-constants"><p>${_("For constants, indicate multiplication explicitly (example: 5*c).")}</p></li>
|
||||
<li class="hint-item" id="hint-howto-maffixes"><p>${_("For affixes, type the number and affix without a space (example: 5c).")}</p></li>
|
||||
<li class="hint-item" id="hint-howto-functions"><p>${_("For functions, type the name of the function, then the expression in parentheses.")}</p></li>
|
||||
</ul>
|
||||
</li>
|
||||
|
||||
<li class="hint-item" id="hint-list">
|
||||
<table class="calculator-input-help-table">
|
||||
<tbody>
|
||||
<tr>
|
||||
<th scope="col">${_("To Use")}</th>
|
||||
<th scope="col">${_("Type")}</th>
|
||||
<th scope="col">${_("Examples")}</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">${_("Numbers")}</th>
|
||||
<td>${_("Integers")}<br />
|
||||
${_("Fractions")}<br />
|
||||
${_("Decimals")}
|
||||
</td>
|
||||
<td>2520<br />
|
||||
2/3<br />
|
||||
3.14, .98
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">${_("Operators")}</th>
|
||||
## Translators: Please do not translate mathematical symbols.
|
||||
<td>${_("+ - * / (add, subtract, multiply, divide)")}<br />
|
||||
## Translators: Please do not translate mathematical symbols.
|
||||
${_("^ (raise to a power)")}<br />
|
||||
## Translators: Please do not translate mathematical symbols.
|
||||
${_("_ (add a subscript)")}<br />
|
||||
## Translators: Please do not translate mathematical symbols.
|
||||
${_("|| (parallel resistors)")}
|
||||
</td>
|
||||
<td>x+(2*y)/x-1
|
||||
x^(n+1)<br />
|
||||
v_IN+v_OUT<br />
|
||||
1||2
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">${_("Greek letters")}</th>
|
||||
<td>${_("Name of letter")}</td>
|
||||
<td>alpha<br />
|
||||
lambda
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">${_("Constants")}</th>
|
||||
<td>c, e, g, i, j, k, pi, q, T</td>
|
||||
<td>20*c<br />
|
||||
418*T
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">${_("Affixes")}</th>
|
||||
<td>${_("Percent sign (%) and metric affixes (d, c, m, u, n, p, k, M, G, T)")}</td>
|
||||
<td>20%<br />
|
||||
20c<br />
|
||||
418T
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">${_("Basic functions")}</th>
|
||||
<td>abs, exp, fact or factorial, ln, log2, log10, sqrt</td>
|
||||
<td>abs(x+y)<br />
|
||||
sqrt(x^2-y)
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">${_("Trigonometric functions")}</th>
|
||||
<td>sin, cos, tan, sec, csc, cot<br />
|
||||
arcsin, sinh, arcsinh, etc.<br />
|
||||
</td>
|
||||
<td>sin(4x+y)<br />
|
||||
arccsch(4x+y)
|
||||
</td>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
## Translators: Please see http://en.wikipedia.org/wiki/Scientific_notation
|
||||
<th scope="row">${_("Scientific notation")}</th>
|
||||
## Translators: 10^ is a mathematical symbol. Please do not translate.
|
||||
<td>${_("10^ and the exponent")}</td>
|
||||
<td>10^-9</td>
|
||||
</tr>
|
||||
<tr>
|
||||
## Translators: this is part of scientific notation. Please see http://en.wikipedia.org/wiki/Scientific_notation#E_notation
|
||||
<th scope="row">${_("e notation")}</th>
|
||||
## Translators: 1e is a mathematical symbol. Please do not translate.
|
||||
<td>${_("1e and the exponent")}</td>
|
||||
<td>1e-9</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<input type="submit" id="calculator_button" value="=" aria-label="${_('Calculate')}">
|
||||
<label for="calculator_output" class="calc-output-label sr">${_('Calculator Output')}</label>
|
||||
<input type="text" id="calculator_output" readonly />
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
<input type="submit" id="calculator_button" value="=" aria-label="${_('Calculate')}">
|
||||
<label for="calculator_output" class="calc-output-label sr">${_('Result')}</label>
|
||||
<input type="text" id="calculator_output" tabindex="-1" readonly />
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user