digitalmarketplace-frontend
Version:
Digital Marketplace Frontend contains assets and components used in Digital Marketplace projects
95 lines (89 loc) • 4.37 kB
HTML
<fieldset class="govuk-fieldset">
<legend class="govuk-fieldset__legend govuk-fieldset__legend--m">
Here is the formula question
</legend>
<table class="govuk-table dm-question-formula">
<thead class="govuk-table__head">
<tr class="govuk-table__row">
<th scope="col" class="govuk-table__header govuk-!-width-one-half"><span class="govuk-visually-hidden">Question</span></th>
<th scope="col" class="govuk-table__header govuk-!-width-one-half"><span class="govuk-visually-hidden">Answer</span></th>
</tr>
</thead>
<tbody class="govuk-table__body"><tr class="govuk-table__row">
<td class="govuk-table__cell">This is the total</td>
<td class="govuk-table__cell">I am some total</td>
</tr><tr class="govuk-table__row">
<td class="govuk-table__cell" colspan="2"><strong class="govuk-!-font-size-27">=</strong></td>
</tr>
<tr class="govuk-table__row govuk-character-count" data-module="govuk-character-count" data-maxwords="200">
<td class="govuk-table__cell">
<label class="govuk-label govuk-label--s" for="input-formulaStart">
This is the thing to start with
</label>
</td>
<td class="govuk-table__cell">
<textarea
class="govuk-textarea govuk-js-character-count"
id="input-formulaStart"
name="formulaStart"
rows="3" aria-describedby="input-formulaStart-info" >I am the start of the formula</textarea>
<div id="input-formulaStart-info" class="govuk-hint govuk-character-count__message">
You can enter up to 200 words
</div>
</td>
</tr>
<tr class="govuk-table__row">
<td class="govuk-table__cell">
<label class="govuk-label govuk-label--s" for="input-formulaStartText">
This is an extra question
</label>
</td>
<td class="govuk-table__cell">
<input
class="govuk-input"
id="input-formulaStartText"
name="formulaStartText"
type="text" value="I am the extra of the formula" >
</td>
</tr>
<tr class="govuk-table__row">
<td class="govuk-table__cell" colspan="2"><strong class="govuk-!-font-size-27">+</strong></td>
</tr>
<tr class="govuk-table__row govuk-character-count" data-module="govuk-character-count" data-maxwords="300">
<td class="govuk-table__cell">
<label class="govuk-label govuk-label--s" for="input-formulaAdd">
This is the thing to add
</label>
</td>
<td class="govuk-table__cell">
<textarea
class="govuk-textarea govuk-js-character-count"
id="input-formulaAdd"
name="formulaAdd"
rows="3" aria-describedby="input-formulaAdd-info" >I am the part of the formula added</textarea>
<div id="input-formulaAdd-info" class="govuk-hint govuk-character-count__message">
You can enter up to 300 words
</div>
</td>
</tr><tr class="govuk-table__row">
<td class="govuk-table__cell" colspan="2"><strong class="govuk-!-font-size-27">-</strong></td>
</tr>
<tr class="govuk-table__row govuk-character-count" data-module="govuk-character-count" data-maxwords="400">
<td class="govuk-table__cell">
<label class="govuk-label govuk-label--s" for="input-formulaSubtract">
This is the thing to subtract
</label>
</td>
<td class="govuk-table__cell">
<textarea
class="govuk-textarea govuk-js-character-count"
id="input-formulaSubtract"
name="formulaSubtract"
rows="3" aria-describedby="input-formulaSubtract-info" >I am the part of the formula to subtract</textarea>
<div id="input-formulaSubtract-info" class="govuk-hint govuk-character-count__message">
You can enter up to 400 words
</div>
</td>
</tr></tbody>
</table>
</fieldset>