Skip to content

Commit 94230e9

Browse files
committed
#2821 fix scrolling externally on cnaRules page and made the section headers anchors
1 parent 927d394 commit 94230e9

File tree

1 file changed

+82
-32
lines changed

1 file changed

+82
-32
lines changed

src/views/ResourcesSupport/AllResources/CNARules.vue

Lines changed: 82 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -2,76 +2,119 @@
22
<div id="cve-tertiary-page-main-container" class="container">
33
<div class="columns is-centered">
44
<div class="column is-3 is-hidden-touch">
5-
<TableOfContentsSidebar :nav="cvePageNavs"/>
5+
<TableOfContentsSidebar :nav="cvePageNavs" />
66
</div>
77
<div class="column is-8-desktop cve-main-column-content-width is-12-tablet">
88
<main id="cve-main-page-content" role="main">
99
<h1 class="title">CVE Numbering Authority (CNA) Operational Rules</h1>
1010
<div id="cve-versionInformation">
11-
<p class="has-text-weight-bold">Document Version: <span>{{versionNum}}</span></p>
12-
<p class="has-text-weight-bold">CVE Board Approval: <span>{{versionApprovalDate}}</span></p>
13-
<p class="has-text-weight-bold">Effective Date: <span>{{versionDate}}</span></p>
14-
<p><router-link to="/Resources/Roles/Cnas/CNA_Rules_v4.0.pdf" target="_blank">View as PDF (0.2MB)</router-link></p>
11+
<p class="has-text-weight-bold">
12+
Document Version: <span>{{ versionNum }}</span>
13+
</p>
14+
<p class="has-text-weight-bold">
15+
CVE Board Approval: <span>{{ versionApprovalDate }}</span>
16+
</p>
17+
<p class="has-text-weight-bold">
18+
Effective Date: <span>{{ versionDate }}</span>
19+
</p>
20+
<p>
21+
<router-link to="/Resources/Roles/Cnas/CNA_Rules_v4.0.pdf" target="_blank"
22+
>View as PDF (0.2MB)</router-link
23+
>
24+
</p>
1525
</div>
16-
<hr>
26+
<hr />
1727
<!-- Top level section -->
1828
<div class="content">
1929
<ol class="ml-0">
2030
<li v-for="(section, index) of cnaRulesSections" :key="index">
2131
<h2 class="title" :id="section.sectionId">
22-
{{ section.sectionTitle }}
32+
<a :href="`#${section.sectionId}`">
33+
{{ section.sectionTitle }}
34+
</a>
2335
</h2>
24-
<p v-for="(para, index) of section.sectionParagraphs" v-html="para" :key="index"></p>
36+
<p
37+
v-for="(para, index) of section.sectionParagraphs"
38+
v-html="para"
39+
:key="index"
40+
></p>
2541
<!-- Sub section -->
2642
<ol class="ml-0">
2743
<li v-for="(subSection, index) of section.subSections" :key="index">
2844
<h3 class="title" :id="subSection.subSectionId">
29-
{{ subSection.subSectionTitle }}
45+
<a :href="`#${subSection.subSectionId}`">
46+
{{ subSection.subSectionTitle }}
47+
</a>
3048
</h3>
31-
<p v-for="(para, index) of subSection.subSectionParagraphs"
32-
v-html="para" :key="index"></p>
49+
<p
50+
v-for="(para, index) of subSection.subSectionParagraphs"
51+
v-html="para"
52+
:key="index"
53+
></p>
3354
</li>
34-
</ol> <!-- end page sub section -->
55+
</ol>
56+
<!-- end page sub section -->
3557
</li>
36-
</ol> <!-- end page section -->
58+
</ol>
59+
<!-- end page section -->
3760
<ul class="ml-0 cve-list-no-bullet">
3861
<li v-for="(section, index) of cnaRulesAppendices" :key="index">
3962
<h2 class="title" :id="section.sectionId">
4063
{{ section.sectionTitle }}
4164
</h2>
42-
<p v-for="(para, index) of section.sectionParagraphs" v-html="para" :key="index"></p>
65+
<p
66+
v-for="(para, index) of section.sectionParagraphs"
67+
v-html="para"
68+
:key="index"
69+
></p>
4370
<!-- Sub section -->
4471
<ul class="ml-0 cve-list-no-bullet">
4572
<li v-for="(subSection, index) of section.subSections" :key="index">
4673
<h3 class="title" :id="subSection.subSectionId">
47-
{{ subSection.subSectionTitle }}
74+
{{ subSection.subSectionTitle }}
4875
</h3>
49-
<p v-for="(para, index) of subSection.subSectionParagraphs" v-html="para" :key="index"></p>
50-
<ul class="ml-0 cve-list-no-bullet"> <!-- Sub Sub section -->
51-
<li v-for="(subSubSection, index) of subSection.subSubSections" :key="index">
76+
<p
77+
v-for="(para, index) of subSection.subSectionParagraphs"
78+
v-html="para"
79+
:key="index"
80+
></p>
81+
<ul class="ml-0 cve-list-no-bullet">
82+
<!-- Sub Sub section -->
83+
<li
84+
v-for="(subSubSection, index) of subSection.subSubSections"
85+
:key="index"
86+
>
5287
<h4 class="title" :id="subSubSection.subSubSectionId">
5388
{{ subSubSection.subSubSectionTitle }}
5489
</h4>
55-
<p v-for="(para, index) of subSubSection.subSubSectionParagraphs" v-html="para" :key="index"></p>
90+
<p
91+
v-for="(para, index) of subSubSection.subSubSectionParagraphs"
92+
v-html="para"
93+
:key="index"
94+
></p>
5695
</li>
57-
</ul> <!-- end apendices sub sub section -->
96+
</ul>
97+
<!-- end apendices sub sub section -->
5898
</li>
59-
</ul> <!-- end appendices sub section -->
99+
</ul>
100+
<!-- end appendices sub section -->
60101
</li>
61-
</ul> <!-- end appendicessection -->
62-
</div>
102+
</ul>
103+
<!-- end appendicessection -->
104+
</div>
63105
</main>
64106
</div>
65-
</div> <!-- end columns -->
107+
</div>
108+
<!-- end columns -->
66109
</div>
67110
</template>
68111

69112
<script>
70-
import TableOfContentsSidebar from '@/components/TableOfContentsSidebar.vue';
71-
import cnaRulesData from '@/assets/data/cnaRules.json';
113+
import TableOfContentsSidebar from "@/components/TableOfContentsSidebar.vue";
114+
import cnaRulesData from "@/assets/data/cnaRules.json";
72115
73116
export default {
74-
name: 'CNARules',
117+
name: "CNARules",
75118
components: {
76119
TableOfContentsSidebar,
77120
},
@@ -89,21 +132,28 @@ export default {
89132
</script>
90133

91134
<style lang="scss">
92-
@import '@/assets/style/globals.scss';
135+
@import "@/assets/style/globals.scss";
93136
</style>
94137

95138
<!-- Add "scoped" attribute to limit CSS to this component only -->
96139
<style scoped lang="scss">
140+
ol {
141+
counter-reset: item;
142+
}
143+
ol li {
144+
display: block;
145+
}
97146
98-
ol { counter-reset: item; }
99-
ol li {display: block;}
100-
ol li p, ul li p {
147+
ol li p,
148+
ul li p {
101149
margin-bottom: 16px;
102150
}
103-
ol li h2::before, ol li h3::before {
151+
ol li h2 a::before,
152+
ol li h3 a::before {
104153
content: counters(item, ".");
105154
counter-increment: item;
106155
margin-right: 0.5rem;
156+
color: #005ea2;
107157
}
108158
109159
:deep(.cve-acronym),

0 commit comments

Comments
 (0)