Skip to content

TD-4080: DIG302: Placeholder text cannot be used to label forms #725

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 1 commit into from
Nov 4, 2024
Merged

TD-4080: DIG302: Placeholder text cannot be used to label forms #725

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions LearningHub.Nhs.WebUI/Scripts/vuesrc/catalogue/managecatalogue.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -76,6 +76,7 @@
<div class="row">
<div class="col" style="min-width:400px; width:400px;">
<div class="input-group pt-4" id="input-group-searchbar-md">
<label class="nhsuk-label nhsuk-u-visually-hidden" for="input-search-md">Find a user by their email address</label>
<input class="form-control small pl-4" v-model="emailAddressFilter" type="search" placeholder="Find a user by their email address" aria-label="Search your learning activity" id="input-search-md" @change="loadUsers();" v-on:keyup="searchUsersKeyUp($event.keyCode)">
<span class="input-group-append">
<button class="btn btn-outline-secondary btn-search" type="button" name="button-search" aria-label="search" v-on:click="loadUsers()" style="margin-top: 0;">
Expand Down
5 changes: 4 additions & 1 deletion LearningHub.Nhs.WebUI/Scripts/vuesrc/contribute-resource/Contribute.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -49,11 +49,13 @@

<div class="contribute-title-wrapper lh-padding-fluid">
<div class="lh-container-xl pt-20 pb-2">

<EditSaveFieldWithCharacterCount v-model="resourceDetails.title"
addEditLabel="title"
:characterLimit="255"
:isH1="true"
size="large"></EditSaveFieldWithCharacterCount>
size="large"
:inputId="title"></EditSaveFieldWithCharacterCount>
</div>
<h3 v-if="resourceDetails.resourceType === ResourceType.ASSESSMENT"
class="pb-15 lh-container-xl">
Expand Down Expand Up @@ -290,6 +292,7 @@
export default Vue.extend({
props: {
resourceVersionId: String,
title: { type: String, default: 'title' },
},
components: {
ContributeActionsBar,
Expand Down
10 changes: 6 additions & 4 deletions LearningHub.Nhs.WebUI/Scripts/vuesrc/contribute-resource/ContributeAssessmentSettings.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -53,8 +53,8 @@

<div class="d-flex" v-if="assessmentDetails.assessmentType === AssessmentTypeEnum.Formal">
<div class="selection pr-50">
<div class="mb-4">Define how many attempts the learner can have.</div>
<input class="text-input" type="text" v-model="assessmentDetails.maximumAttempts" />
<div class="mb-4"><label for="maximumAttempts">Define how many attempts the learner can have.</label></div>
<input class="text-input" type="text" id="maximumAttempts" name="maximumAttempts" v-model="assessmentDetails.maximumAttempts" />
</div>
<div class="tip">
<h3>Tip</h3>
Expand All @@ -65,11 +65,12 @@

<div class="d-flex">
<div class="selection pr-50">
<div>Provide guidance for the learner at the end of this assessment. <i v-if="!IsVisible" class="warningTriangle fas fa-exclamation-triangle warm-yellow"></i></div>
<div>Provide guidance for the learner at the end of this assessment.<i v-if="!IsVisible" class="warningTriangle fas fa-exclamation-triangle warm-yellow"></i></div>
<EditSaveFieldWithCharacterCount v-model="assessmentDetails.endGuidance.blocks[0].title"
addEditLabel="title"
v-bind:characterLimit="60"
v-bind:isH3="true" />
v-bind:isH3="true"
v-bind:inputId="message"/>
<ckeditorwithhint v-on:blur="setEndGuidance"
v-on:inputValidity="setGuidanceValidity"
:maxLength="1000"
Expand Down Expand Up @@ -107,6 +108,7 @@
props: {
blockCollection: { type: Object } as PropOptions<BlockCollectionModel>,
firstTimeOpen: Boolean,
message: { type: String, default: 'message' },
},
components: {
ExpansionPanel,
Expand Down
10 changes: 7 additions & 3 deletions LearningHub.Nhs.WebUI/Scripts/vuesrc/contribute-resource/ContributeAuthorsTab.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,7 @@
</label>
</div>
<CharacterCount v-model="authorName"
v-bind:inputId="authorName"
v-bind:inputId="txtauthorName"
v-bind:characterLimit="100"
v-bind:disabled="authorIsContributor"
:showTitle="false"
Expand All @@ -38,7 +38,7 @@
</template>
</CharacterCount>
<CharacterCount v-model="authorOrganisation"
v-bind:inputId="authorOrganisation"
v-bind:inputId="txtauthorOrganisation"
v-bind:characterLimit="100"
:showTitle="false"
class="mt-15">
Expand All @@ -47,7 +47,7 @@
</template>
</CharacterCount>
<CharacterCount v-model="authorRole"
v-bind:inputId="authorRole"
v-bind:inputId="txtauthorRole"
v-bind:characterLimit="100"
:showTitle="false"
class="mt-15">
Expand Down Expand Up @@ -86,12 +86,16 @@
props: {
resourceDetails: { type: Object } as PropOptions<ContributeResourceDetailModel>,
configuration: { type: Object } as PropOptions<ContributeConfiguration>,
txtauthorName: { type: String, default: 'authorName' },
txtauthorOrganisation: { type: String, default: 'authorOrganisation' },
txtauthorRole: { type: String, default: 'authorRole' },
},
components: {
AuthorsList,
Button,
CharacterCount,
LinkTextAndIcon,

},
data() {
return {
Expand Down
6 changes: 4 additions & 2 deletions LearningHub.Nhs.WebUI/Scripts/vuesrc/contribute-resource/ContributeBlock.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,8 @@
v-model="block.title"
addEditLabel="title"
:characterLimit="60"
:isH3="true"></EditSaveFieldWithCharacterCount>
:isH3="true"
:inputId="title"></EditSaveFieldWithCharacterCount>
<h3 class="my-0"
v-else>
{{ block.title }}
Expand Down Expand Up @@ -158,7 +159,8 @@
enableDown: Boolean,
resourceType: { type: Number } as PropOptions<ResourceType>,
canBeDuplicated: Boolean,
selectedToDuplicate: Boolean
selectedToDuplicate: Boolean,
title: { type: String, default: 'title' },
},
data() {
return {
Expand Down
6 changes: 4 additions & 2 deletions LearningHub.Nhs.WebUI/Scripts/vuesrc/contribute-resource/ContributeImageCarouselBlock.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
<div class="contribute-image-carousel-block">
<div class="contribute-image-carousel-block-description">
<div>
<b>Description text</b>
<label for="description"> <b>Description text</b></label>
<Tick v-bind:complete="!!imageCarouselBlock.description"></Tick>
<p>
Provide a short description for the Carousel. This will be displayed to the user in the header bar beneath the title.
Expand All @@ -13,7 +13,8 @@
<EditSaveFieldWithCharacterCount v-model="imageCarouselBlock.description"
addEditLabel="Description"
v-bind:characterLimit="250"
v-bind:isH3="true"></EditSaveFieldWithCharacterCount>
v-bind:isH3="true"
v-bind:inputId="description"></EditSaveFieldWithCharacterCount>
</div>
</div>
</div>
Expand Down Expand Up @@ -97,6 +98,7 @@
props: {
imageCarouselBlock: { type: Object } as PropOptions<ImageCarouselBlockModel>,
resourceType: { type: Number } as PropOptions<ResourceType>,
description: { type: String, default: 'description' },
},
data() {
return {
Expand Down
4 changes: 3 additions & 1 deletion ...ningHub.Nhs.WebUI/Scripts/vuesrc/contribute-resource/ContributeImageCarouselBlockItem.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,8 @@
<EditSaveFieldWithCharacterCount v-model="block.title"
addEditLabel="title"
v-bind:characterLimit="60"
v-bind:isH3="true"></EditSaveFieldWithCharacterCount>
v-bind:isH3="true"
v-bind:inputId="title"></EditSaveFieldWithCharacterCount>
<Tick v-bind:complete="block.isReadyToPublish()" class="p-10"></Tick>
</div>
<div class="d-flex justify-content-center icon-button">
Expand Down Expand Up @@ -107,6 +108,7 @@ export default Vue.extend({
enableUp: Boolean,
enableDown: Boolean,
resourceType: {type: Number} as PropOptions<ResourceType>,
title: { type: String, default: 'title' },
},
data() {
return {
Expand Down
12 changes: 8 additions & 4 deletions LearningHub.Nhs.WebUI/Scripts/vuesrc/contribute-resource/ContributeWholeSlideImage.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,11 +4,12 @@
<div class="d-flex flex-grow-1">
<Tick :complete="wholeSlideImageItem.isReadyToPublish()"
class="pt-20 pl-15 pr-10"></Tick>
<div class="flex-grow-1 mr-10">
<div class="flex-grow-1 mr-10">
<EditSaveFieldWithCharacterCount v-model="wholeSlideImage.title"
addEditLabel="title"
:characterLimit="60"
:isH4="true"></EditSaveFieldWithCharacterCount>
:isH4="true"
:inputId="title"></EditSaveFieldWithCharacterCount>
</div>
</div>
<div class="contribute-whole-slide-image-buttons d-flex align-items-start justify-content-end">
Expand Down Expand Up @@ -53,13 +54,14 @@

<div v-if="!wholeSlideImage.getFileModel() && !imageZone">
<h3 class="flex pl-2 pt-10"
v-if="showPlaceholderText">Placeholder text:</h3>
v-if="showPlaceholderText"><label for="placeholder">Placeholder text:</label></h3>
<div class="d-flex align-items-center">
<EditSaveFieldWithCharacterCount
class="flex"
addEditLabel="placeholder text"
v-model="wholeSlideImageItem.placeholderText"
:characterLimit="500"
:inputId="placeholder"
@updateIsEditing="value => isEditingPlaceholder(value)"/>
</div>
<div>
Expand Down Expand Up @@ -225,7 +227,9 @@
enableUp: Boolean,
enableDown: Boolean,
resourceType: { type: Number } as PropOptions<ResourceType>,
imageZone: { type: Boolean, default: false }
imageZone: { type: Boolean, default: false },
title: { type: String, default: 'title' },
placeholder: { type: String, default: 'placeholder' },
},
data() {
return {
Expand Down
6 changes: 4 additions & 2 deletions ...bUI/Scripts/vuesrc/contribute-resource/components/content-tab/MediaBlockCarouselImage.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,13 +20,14 @@
</picture>
</div>
<div class="carousel-text-editor">
<b>Description text</b> (Optional)
<label for="description"> <b>Description text</b> (Optional)</label>
<p>
Provide a short description of the image, which will be displayed to the user under the image in the carousel.
</p>
<EditSaveFieldWithCharacterCount v-model="image.description"
addEditLabel="Description"
v-bind:characterLimit="150"
v-bind:inputId="description"
block-view/>
</div>
<div class="carousel-text-editor">
Expand All @@ -39,7 +40,7 @@
<EditSaveFieldWithCharacterCount v-model="image.altText"
addEditLabel="alt text"
v-bind:characterLimit="125"
block-view/>
block-view />
</div>
</div>
</div>
Expand Down Expand Up @@ -71,6 +72,7 @@
},
props: {
image: { type: Object } as PropOptions<ImageModel>,
description: { type: String, default: 'description' },
},
data() {
return {
Expand Down
7 changes: 5 additions & 2 deletions ...b.Nhs.WebUI/Scripts/vuesrc/contribute-resource/components/content-tab/MediaBlockImage.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,8 @@
<div v-if="withLabel">
<EditSaveFieldWithCharacterCount v-model="image.description"
addEditLabel="label"
v-bind:characterLimit="descriptionCharacterLimit"/>
v-bind:characterLimit="descriptionCharacterLimit"
v-bind:inputId="imageAltText"/>
</div>
</div>
<div v-else class="d-flex flex-column align-items-center justify-content-center">
Expand All @@ -36,6 +37,7 @@
<EditSaveFieldWithCharacterCount v-model="image.altText"
addEditLabel="alt text"
v-bind:characterLimit="125"
v-bind:inputId="alttext"
block-view/>
</div>
</div>
Expand Down Expand Up @@ -71,7 +73,8 @@ export default Vue.extend({
restrictAdvancedImageTypes: { type: Boolean, default: false },
imageClass: String,
withLabel: { type: Boolean, default: false },
descriptionCharacterLimit: { type: Number, default: 125 }
descriptionCharacterLimit: { type: Number, default: 125 },
alttext: { type: String, default: 'alttext' },
},
data() {
return {
Expand Down
14 changes: 8 additions & 6 deletions ...hs.WebUI/Scripts/vuesrc/contribute-resource/components/questions/MultipleChoiceAnswer.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,12 +3,13 @@
<div>
<div class="flex align-items-center">
<div class="flex">
<Tick v-bind:complete="this.answer.isReadyToPublish()" class="pr-3 align-with-cc"/>
<EditSaveFieldWithCharacterCount
v-model="message"
addEditLabel="response text"
v-bind:characterLimit="120"
v-bind:isH3="true"></EditSaveFieldWithCharacterCount>
<Tick v-bind:complete="this.answer.isReadyToPublish()" class="pr-3 align-with-cc" />
<label class="nhsuk-u-visually-hidden" for="messagedetails"></label>
<EditSaveFieldWithCharacterCount v-model="message"
addEditLabel="response text"
v-bind:characterLimit="120"
v-bind:inputId="messagedetails"
v-bind:isH3="true"></EditSaveFieldWithCharacterCount>
</div>
<span class="bin">
<IconButton v-on:click="$emit('deleteAnswer', answer)"
Expand Down Expand Up @@ -49,6 +50,7 @@
props: {
answer: { type: Object } as PropOptions<AnswerModel>,
multipleAnswers: Boolean,
messagedetails: { type: String, default: 'messagedetails' },
},

data() {
Expand Down
3 changes: 2 additions & 1 deletion ...ningHub.Nhs.WebUI/Scripts/vuesrc/globalcomponents/CharacterCountWithSaveCancelButtons.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
<CharacterCount v-model="inputValue"
v-bind:characterLimit="characterLimit"
v-bind:size="size"
:showTitle="false"
v-bind:inputId="inputId"
focusOnLoad></CharacterCount>
<div class="d-inline-flex">
<Button v-on:click="save"
Expand Down Expand Up @@ -34,6 +34,7 @@
value: String,
characterLimit: Number,
size: String,
inputId:String
},
data() {
return {
Expand Down
2 changes: 2 additions & 0 deletions LearningHub.Nhs.WebUI/Scripts/vuesrc/globalcomponents/EditSaveFieldWithCharacterCount.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@
v-model="inputValue"
v-bind:characterLimit="characterLimit"
v-bind:size="size"
v-bind:inputId="inputId"
v-on:input="$emit('input', $event)"
v-on:close="isEditing = false"></CharacterCountWithSaveCancelButtons>
<div v-else>
Expand Down Expand Up @@ -66,6 +67,7 @@
addEditLabel: String,
blockView: Boolean,
size: String,
inputId: String,
},
data() {
return {
Expand Down
5 changes: 4 additions & 1 deletion LearningHub.Nhs.WebUI/Scripts/vuesrc/resource/blocks/AnnotationFullPageEdit.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,10 +14,12 @@
</div>
<div class="annotation-edit-fs-functions">
<div class="annotation-edit-fs-functions-change-title">
<label class="nhsuk-u-visually-hidden" for="title"></label>
<EditSaveFieldWithCharacterCount v-model="wholeSlideImage.title"
addEditLabel="title"
:characterLimit="60"
:isH4="true"/>
:isH4="true"
:inputId="title" />
</div>
<div class="annotation-edit-fs-functions-other">
<div class="edit-hide-controls">
Expand Down Expand Up @@ -75,6 +77,7 @@
resourceType: { type: Number } as PropOptions<ResourceType>,
imageZone: Boolean,
questionBlock: { type: Object } as PropOptions<QuestionBlockModel>,
title: { type: String, default: 'title' },
},
data() {
return {
Expand Down
Loading