Skip to content

Commit 1d63454

Browse files
committed
#3000 fixed accordion typos
1 parent 83267a9 commit 1d63454

15 files changed

Lines changed: 121 additions & 121 deletions

File tree

src/components/AdpVulnerabilityEnrichment.vue

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,26 +1,26 @@
11
<template>
22
<div :id="`${sectionAnchorId}`">
33
<div class="mb-2">
4-
<div class="message-header cve-accordion-header">
4+
<div @click="togglePanel" class="message-header cve-accordion-header">
55
<slot></slot>
66
<button class="button message-header-button"
77
:style="{'background-color': '#162e51 !important', 'color': 'white !important'}"
88
@click="togglePanel"
9-
:aria-expanded="useCveRecordLookupStore.accordianState[organizationId] ? 'true' : 'false'"
9+
:aria-expanded="useCveRecordLookupStore.accordionState[organizationId] ? 'true' : 'false'"
1010
:aria-controls="`${organizationId}-panel`"
1111
>
1212
<span class="icon is-small">
1313
<p :id="`expandCollapseAltText-${organizationId}`" class="is-hidden">
14-
{{useCveRecordLookupStore.accordianState[organizationId] ? 'expand' : 'collapse'}}
14+
{{useCveRecordLookupStore.accordionState[organizationId] ? 'expand' : 'collapse'}}
1515
</p>
16-
<font-awesome-icon :icon="useCveRecordLookupStore.accordianState[organizationId] ? 'minus' : 'plus'"
16+
<font-awesome-icon :icon="useCveRecordLookupStore.accordionState[organizationId] ? 'minus' : 'plus'"
1717
aria-hidden="false" focusable="true" :aria-labelledby="`expandCollapseAltText-${organizationId}`"
1818
/>
1919
</span>
2020
</button>
2121
</div>
2222
<!-- Panel content is conditionally determined by role -->
23-
<div :id="`${organizationId}-panel`" v-if="useCveRecordLookupStore.accordianState[organizationId]"
23+
<div :id="`${organizationId}-panel`" v-if="useCveRecordLookupStore.accordionState[organizationId]"
2424
class="pl-3 pr-3 pt-2 pb-5 cve-container-accordion-panel"
2525
>
2626
<div>
@@ -258,7 +258,7 @@ export default {
258258
},
259259
methods: {
260260
togglePanel(){
261-
useCveRecordLookupStore().accordianState[this.organizationId] = !useCveRecordLookupStore().accordianState[this.organizationId];
261+
useCveRecordLookupStore().accordionState[this.organizationId] = !useCveRecordLookupStore().accordionState[this.organizationId];
262262
},
263263
hasEnrichmentData(){
264264
if (this.cwes.length > 0 || this.cvsss.length > 0 || this.kevs.length > 0 || this.ssvcs.length > 0) {

src/components/NotificationBannerModule.vue

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -66,7 +66,7 @@
6666
<div>
6767
<p id="expandCollapseButton" class="is-hidden">Expand or collapse notification button</p>
6868
<button id="alertIcon" class="button is-text pl-3 pb-0 pt-0" style="height: 1.5rem" aria-labelledby="expandCollapseButton"
69-
@click="toggleAccordianItem()" :aria-expanded="isCollapsed ? false : true">
69+
@click="toggleAccordionItem()" :aria-expanded="isCollapsed ? false : true">
7070
<span class="icon is-small" style="padding-top: 6px;">
7171
<p :id="isCollapsed ? 'caret-up' : 'caret-down'" class="is-hidden">close notification button</p>
7272
<font-awesome-icon style="font-size: 25px" :icon="isCollapsed ? 'caret-up' : 'caret-down'"
@@ -95,7 +95,7 @@ export default {
9595
this.setIsCollapsedState();
9696
},
9797
methods: {
98-
toggleAccordianItem() {
98+
toggleAccordionItem() {
9999
this.isCollapsed = !this.isCollapsed;
100100
useGlobalNotificationStore().setLocalNotificationStates();
101101
},

src/components/TableOfContentsSidebar.vue

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -114,31 +114,31 @@ export default {
114114
return {
115115
isActive: true,
116116
isOpen: -1,
117-
accordian: {},
118-
accordianList: [],
117+
accordion: {},
118+
accordionList: [],
119119
selectedSubmenu: [],
120120
};
121121
},
122122
created() {
123-
this.setAccordian(false, '', 'subSectionId', 'subSections', ['pageSections', 'appendices']);
123+
this.setAccordion(false, '', 'subSectionId', 'subSections', ['pageSections', 'appendices']);
124124
},
125125
methods: {
126126
isExactPath(onPageLink) {
127127
return useLinkStore().isExactPath(`${this.$route.path}${onPageLink}`, this.$route.fullPath);
128128
},
129-
setAccordian(isHidden, parentId, childId, subSectionPropertyName, topLevelProperties) {
129+
setAccordion(isHidden, parentId, childId, subSectionPropertyName, topLevelProperties) {
130130
Object.keys(this.nav).forEach((topLevelSection) => {
131131
if (topLevelProperties.includes(topLevelSection)) {
132132
this.nav[topLevelSection].forEach((item) => {
133133
item[subSectionPropertyName].forEach((subSection) => {
134-
this.accordian[(parentId === '') ? subSection[childId] : `${item[parentId]}${subSection[childId]}`] = isHidden;
134+
this.accordion[(parentId === '') ? subSection[childId] : `${item[parentId]}${subSection[childId]}`] = isHidden;
135135
});
136136
});
137137
}
138138
});
139139
},
140-
toggleAccordianItem(id) {
141-
this.accordian[id] = !this.accordian[id];
140+
toggleAccordionItem(id) {
141+
this.accordion[id] = !this.accordion[id];
142142
},
143143
toggleSubmenuItem(id) {
144144
if (this.selectedSubmenu.includes(id)) {

src/stores/cveRecordLookup.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@ export const useCveRecordLookupStore = defineStore('cveRecordLookup', {
1919
showJsonRecord: false,
2020
hasAdpInfo: false,
2121
emptyProductStatus: {},
22-
accordianState: {
22+
accordionState: {
2323
collapseAll: true,
2424
},
2525
onPageMenuItems: {

src/views/About/Process.vue

Lines changed: 15 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -48,23 +48,23 @@
4848
<div class="timeline-content">
4949
<h3 class="title">Request</h3>
5050
<p>CVE Program participant requests a CVE Identifier (CVE ID).</p>
51-
<section class="cve-accordian">
51+
<section class="cve-accordion">
5252
<div class="message">
5353
<div class="message-header">
5454
<h4 class="title">CVE ID</h4>
55-
<button class="button" @click="toggleAccordianItem('cve-id')"
56-
:aria-expanded="!accordian['cve-id'] ? 'true' : 'false'"
55+
<button class="button" @click="toggleAccordionItem('cve-id')"
56+
:aria-expanded="!accordion['cve-id'] ? 'true' : 'false'"
5757
aria-controls="cve-id">
5858
<span class="icon is-small">
5959
<p id="cve-id-alttext" class="is-hidden">
60-
{{accordian['cve-id'] ? 'collapse' : 'expand'}}
60+
{{accordion['cve-id'] ? 'collapse' : 'expand'}}
6161
</p>
62-
<font-awesome-icon :icon="accordian['cve-id'] ? 'plus' : 'minus'"
62+
<font-awesome-icon :icon="accordion['cve-id'] ? 'plus' : 'minus'"
6363
aria-hidden="false" focusable="true" aria-labelledby="cve-id-alttext"/>
6464
</span>
6565
</button>
6666
</div>
67-
<div class="message-body" :class="{'is-hidden': accordian['cve-id']}" id="cve-id">
67+
<div class="message-body" :class="{'is-hidden': accordion['cve-id']}" id="cve-id">
6868
<div class="block">
6969
<p>
7070
A CVE ID is a unique, alphanumeric identifier assigned by the CVE Program. Each identifier references a specific
@@ -124,23 +124,23 @@
124124
CNA.
125125
</p>
126126
<p>The CVE Record is now available for download and viewing by the public.</p>
127-
<section class="cve-accordian">
127+
<section class="cve-accordion">
128128
<div class="message">
129129
<div class="message-header">
130130
<h4 class="title">CVE Records</h4>
131-
<button class="button" @click="toggleAccordianItem('cve-record')"
132-
:aria-expanded="!accordian['cve-record'] ? 'true' : 'false'"
131+
<button class="button" @click="toggleAccordionItem('cve-record')"
132+
:aria-expanded="!accordion['cve-record'] ? 'true' : 'false'"
133133
aria-controls="cve-record">
134134
<span class="icon is-small">
135135
<p id="cve-record-alttext" class="is-hidden">
136-
{{accordian['cve-record'] ? 'collapse' : 'expand'}}
136+
{{accordion['cve-record'] ? 'collapse' : 'expand'}}
137137
</p>
138-
<font-awesome-icon :icon="accordian['cve-record'] ? 'plus' : 'minus'"
138+
<font-awesome-icon :icon="accordion['cve-record'] ? 'plus' : 'minus'"
139139
aria-hidden="false" focusable="true" aria-labelledby="cve-record-alttext"/>
140140
</span>
141141
</button>
142142
</div>
143-
<div class="message-body" :class="{'is-hidden': accordian['cve-record']}" id="cve-record">
143+
<div class="message-body" :class="{'is-hidden': accordion['cve-record']}" id="cve-record">
144144
<div class="block">
145145
<p>
146146
A CVE Record is the descriptive data about a vulnerability associated with a CVE ID, provided by a CVE Numbering
@@ -222,12 +222,12 @@ export default {
222222
},
223223
data() {
224224
return {
225-
accordian: { 'cve-id': true, 'cve-record': true },
225+
accordion: { 'cve-id': true, 'cve-record': true },
226226
};
227227
},
228228
methods: {
229-
toggleAccordianItem(id) {
230-
this.accordian[id] = !this.accordian[id];
229+
toggleAccordionItem(id) {
230+
this.accordion[id] = !this.accordion[id];
231231
},
232232
},
233233
};

src/views/CVERecord/PublishedRecord.vue

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -47,10 +47,10 @@
4747
</div>
4848
<div class="level-right ml-1">
4949
<div class="level-item">
50-
<div id="cve-accordian-expand-collapse-all-btn" class="buttons mb-0" style="justify-content: flex-end;">
51-
<button id="expand-collpse-all-btn" @click="toggleAccordian" class="button is-small cve-button"
50+
<div id="cve-accordion-expand-collapse-all-btn" class="buttons mb-0" style="justify-content: flex-end;">
51+
<button id="expand-collpse-all-btn" @click="toggleAccordion" class="button is-small cve-button"
5252
>
53-
{{ useCveRecordLookupStore.accordianState.collapseAll ? 'Collapse' : 'Expand' }} all
53+
{{ useCveRecordLookupStore.accordionState.collapseAll ? 'Collapse' : 'Expand' }} all
5454
</button>
5555
</div>
5656
</div>
@@ -148,10 +148,10 @@ export default {
148148
};
149149
},
150150
methods: {
151-
toggleAccordian() {
152-
const newPanelState = !useCveRecordLookupStore().accordianState.collapseAll;
153-
Object.keys(useCveRecordLookupStore().accordianState).forEach( (panelName) => {
154-
useCveRecordLookupStore().accordianState[panelName] = newPanelState;
151+
toggleAccordion() {
152+
const newPanelState = !useCveRecordLookupStore().accordionState.collapseAll;
153+
Object.keys(useCveRecordLookupStore().accordionState).forEach( (panelName) => {
154+
useCveRecordLookupStore().accordionState[panelName] = newPanelState;
155155
});
156156
},
157157
populateOnPageMenu() {
@@ -208,20 +208,20 @@ export default {
208208
setupContainersAccordionStateOnPageMenu() {
209209
this.cnaContainer = this.originalRecordData.containers.cna;
210210
if (this.cnaContainer?.providerMetadata?.orgId) {
211-
useCveRecordLookupStore().accordianState[`cna-${this.cnaContainer.providerMetadata.orgId}`] = true;
211+
useCveRecordLookupStore().accordionState[`cna-${this.cnaContainer.providerMetadata.orgId}`] = true;
212212
}
213213
214214
if (this.originalRecordData?.containers?.adp) {
215215
this.originalRecordData.containers.adp.forEach((adp) => {
216216
if (adp.providerMetadata.shortName.toLowerCase() === useCveRecordLookupStore().cveProgramShortName) {
217217
this.cveProgramContainer = adp;
218-
useCveRecordLookupStore().accordianState[`cve-program-${adp.providerMetadata.orgId}`] = true;
218+
useCveRecordLookupStore().accordionState[`cve-program-${adp.providerMetadata.orgId}`] = true;
219219
}
220220
});
221221
}
222222
223223
Object.keys(this.adpContainers).forEach( (adpName) => {
224-
useCveRecordLookupStore().accordianState[`adp-${this.adpContainers[adpName].providerMetadata.orgId}`] = false;
224+
useCveRecordLookupStore().accordionState[`adp-${this.adpContainers[adpName].providerMetadata.orgId}`] = false;
225225
});
226226
227227
this.populateOnPageMenu();

src/views/CVERecord/RejectedRecordOrId.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,7 @@
2525
</nav>
2626
<div role="information" class="notification is-info is-light p-3 mt-4">
2727
<div class="is-flex" style="justify-content: center;">
28-
<section class="cve-accordian" style="flex: 0 0 100%;">
28+
<section class="cve-accordion" style="flex: 0 0 100%;">
2929
<div class="message" style="background: transparent !important;">
3030
<div class="message-header p-0"
3131
style="background: transparent !important;border-bottom: unset !important">

src/views/CVERecord/ReservedId.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,7 @@
2222
</nav>
2323
<div role="information" class="notification is-info is-light p-3">
2424
<div class="is-flex" style="justify-content: center;">
25-
<section class="cve-accordian" style="flex: 0 0 100%;">
25+
<section class="cve-accordion" style="flex: 0 0 100%;">
2626
<div class="message" style="background: transparent !important;">
2727
<div class="message-header p-0"
2828
style="background: transparent !important;border-bottom: unset !important">

src/views/Media/News/BlogArchives.vue

Lines changed: 19 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -12,30 +12,30 @@
1212
to the <router-link to="/Media/News/Blogs">Blogs</router-link> page.
1313
</p>
1414
<div class="has-text-right pb-4">
15-
<button class="button cve-button" @click="toggleAccordianAll()">
16-
{{accordian.length > 1 ? 'Collapse All' : 'Expand All'}}
15+
<button class="button cve-button" @click="toggleAccordionAll()">
16+
{{accordion.length > 1 ? 'Collapse All' : 'Expand All'}}
1717
</button>
1818
</div>
19-
<section class="cve-accordian">
19+
<section class="cve-accordion">
2020
<div v-for="(archiveYear, index) in Object.keys(sortedEntries).sort(function(a,b){return b-a})"
2121
:key="index" class="message">
2222
<div class="message-header cve-base-light-gray-borders-bg">
2323
<p class="message-label has-text-weight-bold" style="margin-top: auto; margin-bottom: auto;">
2424
{{archiveYear}}
2525
</p>
26-
<button class="button" @click="toggleAccordianItem(archiveYear)"
27-
:aria-expanded="!accordian.includes(archiveYear) ? 'true' : 'false'"
26+
<button class="button" @click="toggleAccordionItem(archiveYear)"
27+
:aria-expanded="!accordion.includes(archiveYear) ? 'true' : 'false'"
2828
:aria-controls="archiveYear">
2929
<span class="icon is-small">
3030
<p :id="archiveYear + '-alttext'" class="is-hidden">
31-
{{accordian.includes(archiveYear) ? 'collapse' : 'expand'}}
31+
{{accordion.includes(archiveYear) ? 'collapse' : 'expand'}}
3232
</p>
33-
<font-awesome-icon :icon="accordian.includes(archiveYear) ? 'plus' : 'minus'"
33+
<font-awesome-icon :icon="accordion.includes(archiveYear) ? 'plus' : 'minus'"
3434
aria-hidden="false" focusable="true" :aria-labelledby="archiveYear + '-alttext'"/>
3535
</span>
3636
</button>
3737
</div>
38-
<div class="message-body" v-show="accordian.includes(archiveYear)" :id="archiveYear">
38+
<div class="message-body" v-show="accordion.includes(archiveYear)" :id="archiveYear">
3939
<div class="table-container" :id="archiveYear">
4040
<table class="table is-striped is-hoverable cve-border-dark-blue cve-border-bottom-unset">
4141
<thead>
@@ -85,7 +85,7 @@ export default {
8585
data() {
8686
return {
8787
archiveBlogs: newsData.archiveBlogs,
88-
accordian: [],
88+
accordion: [],
8989
sortedEntries: {},
9090
isNavSidebarHiddenTouch: false,
9191
};
@@ -121,7 +121,7 @@ export default {
121121
});
122122
Object.keys(blogArchivesByYear).forEach((archiveYear) => {
123123
sortedBlogArchives[archiveYear] = this.sortYearEntries(blogArchivesByYear[archiveYear]);
124-
this.accordian.push(archiveYear);
124+
this.accordion.push(archiveYear);
125125
});
126126
this.sortedEntries = sortedBlogArchives;
127127
},
@@ -133,21 +133,21 @@ export default {
133133
});
134134
return sortedEntries;
135135
},
136-
toggleAccordianAll() {
137-
if (this.accordian.length > 1) {
138-
this.accordian = [];
136+
toggleAccordionAll() {
137+
if (this.accordion.length > 1) {
138+
this.accordion = [];
139139
} else {
140140
Object.keys(this.sortedEntries).forEach((year) => {
141-
this.accordian.push(year);
141+
this.accordion.push(year);
142142
});
143143
}
144144
},
145-
toggleAccordianItem(id) {
146-
if (this.accordian.includes(id)) {
147-
const index = this.accordian.indexOf(id);
148-
this.accordian.splice(index, 1);
145+
toggleAccordionItem(id) {
146+
if (this.accordion.includes(id)) {
147+
const index = this.accordion.indexOf(id);
148+
this.accordion.splice(index, 1);
149149
} else {
150-
this.accordian.push(id);
150+
this.accordion.push(id);
151151
}
152152
},
153153
},

0 commit comments

Comments
 (0)