@repobit/dex-system-design 0.15.0 → 0.16.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +9 -0
- package/package.json +2 -2
- package/src/components/highlight/highlight.stories.js +11 -11
- package/src/stories/demo.stories.js +240 -240
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,15 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
## [0.16.0](https://github.com/bitdefender/dex-core/compare/@repobit/dex-system-design@0.15.0...@repobit/dex-system-design@0.16.0) (2025-09-11)
|
|
7
|
+
|
|
8
|
+
|
|
9
|
+
### Features
|
|
10
|
+
|
|
11
|
+
* **DEX-1001:** removed highlight-s - outdated file ([2c04b0b](https://github.com/bitdefender/dex-core/commit/2c04b0bf8836bf453f2630271a8f2b87c3838aad))
|
|
12
|
+
|
|
13
|
+
|
|
14
|
+
|
|
6
15
|
## [0.15.0](https://github.com/bitdefender/dex-core/compare/@repobit/dex-system-design@0.14.0...@repobit/dex-system-design@0.15.0) (2025-09-11)
|
|
7
16
|
|
|
8
17
|
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@repobit/dex-system-design",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.16.0",
|
|
4
4
|
"description": "Design system based on Web Components.",
|
|
5
5
|
"author": "Iordache Matei Cezar <miordache@bitdefender.com>",
|
|
6
6
|
"homepage": "https://github.com/bitdefender/dex-core#readme",
|
|
@@ -68,5 +68,5 @@
|
|
|
68
68
|
"volta": {
|
|
69
69
|
"node": "22.14.0"
|
|
70
70
|
},
|
|
71
|
-
"gitHead": "
|
|
71
|
+
"gitHead": "c737f20e05cd527a20c8cf52d111f718158edba9"
|
|
72
72
|
}
|
|
@@ -1,14 +1,14 @@
|
|
|
1
|
-
import "./highlight.js";
|
|
2
1
|
import { html } from "lit";
|
|
2
|
+
import "./highlight.js";
|
|
3
3
|
|
|
4
4
|
export default {
|
|
5
|
-
title: "Atoms/Highlight [v2]",
|
|
5
|
+
title : "Atoms/Highlight [v2]",
|
|
6
6
|
component: "highlight",
|
|
7
|
-
tags: ["autodocs"],
|
|
8
|
-
argTypes: {
|
|
7
|
+
tags : ["autodocs"],
|
|
8
|
+
argTypes : {
|
|
9
9
|
highlightText: { control: "text" },
|
|
10
|
-
defaultSlot: { control: "text", name: "Text Content" }
|
|
11
|
-
}
|
|
10
|
+
defaultSlot : { control: "text", name: "Text Content" }
|
|
11
|
+
}
|
|
12
12
|
};
|
|
13
13
|
|
|
14
14
|
const Template = ({ highlightText, defaultSlot }) => html`
|
|
@@ -21,33 +21,33 @@ export const Default = Template.bind({});
|
|
|
21
21
|
Default.args = {
|
|
22
22
|
highlightText: "next generation of digital security",
|
|
23
23
|
defaultSlot:
|
|
24
|
-
"Introducing the next generation of digital security: your personalized shield for a worry-free online experience."
|
|
24
|
+
"Introducing the next generation of digital security: your personalized shield for a worry-free online experience."
|
|
25
25
|
};
|
|
26
26
|
|
|
27
27
|
export const LongText = Template.bind({});
|
|
28
28
|
LongText.args = {
|
|
29
29
|
highlightText: "next generation of digital security test test testtest123",
|
|
30
30
|
defaultSlot:
|
|
31
|
-
"Introducing the next generation of digital security test test testtest123: your personalized shield for a worry-free online experience."
|
|
31
|
+
"Introducing the next generation of digital security test test testtest123: your personalized shield for a worry-free online experience."
|
|
32
32
|
};
|
|
33
33
|
|
|
34
34
|
export const ShortText = Template.bind({});
|
|
35
35
|
ShortText.args = {
|
|
36
36
|
highlightText: "Introducing",
|
|
37
37
|
defaultSlot:
|
|
38
|
-
"Introducing the next generation of digital security: your personalized shield for a worry-free online experience."
|
|
38
|
+
"Introducing the next generation of digital security: your personalized shield for a worry-free online experience."
|
|
39
39
|
};
|
|
40
40
|
|
|
41
41
|
export const MissingHighlight = Template.bind({});
|
|
42
42
|
MissingHighlight.args = {
|
|
43
43
|
highlightText: "something not in the text",
|
|
44
44
|
defaultSlot:
|
|
45
|
-
"Introducing the next generation of digital security: your personalized shield for a worry-free online experience."
|
|
45
|
+
"Introducing the next generation of digital security: your personalized shield for a worry-free online experience."
|
|
46
46
|
};
|
|
47
47
|
|
|
48
48
|
export const MultipleOccurrences = Template.bind({});
|
|
49
49
|
MultipleOccurrences.args = {
|
|
50
50
|
highlightText: "security",
|
|
51
51
|
defaultSlot:
|
|
52
|
-
"This security system improves your security and brings peace of mind to your digital experience."
|
|
52
|
+
"This security system improves your security and brings peace of mind to your digital experience."
|
|
53
53
|
};
|
|
@@ -1,270 +1,270 @@
|
|
|
1
|
-
// src/stories/DesignSystem.stories.js
|
|
2
|
-
import '/src/components/Anchor/anchor-nav.js';
|
|
3
|
-
import '/src/components/badge/badge.js';
|
|
4
|
-
import '/src/components/Button/Button.js';
|
|
5
|
-
import '/src/components/carousel/carousel.js';
|
|
6
|
-
import '/src/components/checkbox/checkbox.js';
|
|
7
|
-
import '/src/components/divider/divider-horizontal.js';
|
|
8
|
-
import '/src/components/divider/divider-vertical.js';
|
|
9
|
-
import '/src/components/FAQ/faq.js';
|
|
10
|
-
import '/src/components/header/header.js';
|
|
11
|
-
import '/src/components/highlight/highlight-s.js';
|
|
12
|
-
import '/src/components/highlight/highlight.js';
|
|
13
|
-
import '/src/components/input/input.js';
|
|
14
|
-
import '/src/components/light-carousel/light-carousel.js';
|
|
15
|
-
import '/src/components/paragraph/paragraph.js';
|
|
16
|
-
import '/src/components/pricing-cards/pricing-card.js';
|
|
17
|
-
import '/src/components/radio/radio.js';
|
|
18
|
-
import '/src/components/tabs/tabs.js';
|
|
19
|
-
import '/src/components/termsOfUse/terms.js';
|
|
1
|
+
// // src/stories/DesignSystem.stories.js
|
|
2
|
+
// import '/src/components/Anchor/anchor-nav.js';
|
|
3
|
+
// import '/src/components/badge/badge.js';
|
|
4
|
+
// import '/src/components/Button/Button.js';
|
|
5
|
+
// import '/src/components/carousel/carousel.js';
|
|
6
|
+
// import '/src/components/checkbox/checkbox.js';
|
|
7
|
+
// import '/src/components/divider/divider-horizontal.js';
|
|
8
|
+
// import '/src/components/divider/divider-vertical.js';
|
|
9
|
+
// import '/src/components/FAQ/faq.js';
|
|
10
|
+
// import '/src/components/header/header.js';
|
|
11
|
+
// import '/src/components/highlight/highlight-s.js';
|
|
12
|
+
// import '/src/components/highlight/highlight.js';
|
|
13
|
+
// import '/src/components/input/input.js';
|
|
14
|
+
// import '/src/components/light-carousel/light-carousel.js';
|
|
15
|
+
// import '/src/components/paragraph/paragraph.js';
|
|
16
|
+
// import '/src/components/pricing-cards/pricing-card.js';
|
|
17
|
+
// import '/src/components/radio/radio.js';
|
|
18
|
+
// import '/src/components/tabs/tabs.js';
|
|
19
|
+
// import '/src/components/termsOfUse/terms.js';
|
|
20
20
|
|
|
21
|
-
export default {
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
};
|
|
21
|
+
// export default {
|
|
22
|
+
// title : 'Design System/Demo full page',
|
|
23
|
+
// parameters: {
|
|
24
|
+
// },
|
|
25
|
+
// decorators: [
|
|
26
|
+
// (Story) => {
|
|
27
|
+
// return `
|
|
28
|
+
// <link rel="stylesheet" href="/src/tokens/tokens.css" />
|
|
29
|
+
// <link rel="stylesheet" href="/src/tokens/layout.css" />
|
|
30
|
+
// <link rel="stylesheet" href="/src/tokens/typography.css" />
|
|
31
|
+
// <link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@400;600&display=swap" rel="stylesheet" />
|
|
32
|
+
// ${Story()}
|
|
33
|
+
// `;
|
|
34
|
+
// }
|
|
35
|
+
// ]
|
|
36
|
+
// };
|
|
37
37
|
|
|
38
|
-
export const FullPage = () => `
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
38
|
+
// export const FullPage = () => `
|
|
39
|
+
// <bd-header
|
|
40
|
+
// product-name="Bitdefender Ultimate Security"
|
|
41
|
+
// value-prop="Complete Security, Advanced Privacy, and Identity Protection"
|
|
42
|
+
// description="All in one plan to incorporate multi-awarded device protection, solid password management, unlimited VPN traffic & personalized protection for your online identity."
|
|
43
|
+
// full-price="$139.99"
|
|
44
|
+
// discount="Save 44%"
|
|
45
|
+
// final-price="$79.99"
|
|
46
|
+
// >
|
|
47
|
+
// <div class="bd-header-right">
|
|
48
|
+
// <img
|
|
49
|
+
// class="bd-header-image"
|
|
50
|
+
// src="images/bd-header-us.jpg"
|
|
51
|
+
// alt="Security illustration"
|
|
52
|
+
// />
|
|
53
|
+
// </div>
|
|
54
|
+
// </bd-header>
|
|
55
55
|
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
56
|
+
// <bd-anchor-nav>
|
|
57
|
+
// <bd-anchor-nav-item title="Anchor 1" id="anchor-1"></bd-anchor-nav-item>
|
|
58
|
+
// <bd-anchor-nav-item title="Anchor 2" id="anchor-2"></bd-anchor-nav-item>
|
|
59
|
+
// <bd-anchor-nav-item title="Anchor 3" id="anchor-3"></bd-anchor-nav-item>
|
|
60
|
+
// </bd-anchor-nav>
|
|
61
61
|
|
|
62
|
-
|
|
62
|
+
// <p>Let’s Secure Your Digital Life</p>
|
|
63
63
|
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
64
|
+
// <bd-highlight-text-s highlight-text="next generation of digital security">
|
|
65
|
+
// Introducing the next generation of digital security: your personalized shield for a worry-free online experience.
|
|
66
|
+
// </bd-highlight-text-s>
|
|
67
67
|
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
68
|
+
// <bd-light-carousel-section
|
|
69
|
+
// title="Our AI-powered platform that detects and fights scams. In real time."
|
|
70
|
+
// >
|
|
71
|
+
// <bd-light-carousel-item
|
|
72
|
+
// title="Scam Copilot Chatbot"
|
|
73
|
+
// icon="src/assets/icons/light-carousel-img1.png"
|
|
74
|
+
// badge="NEW"
|
|
75
|
+
// >
|
|
76
|
+
// <p>
|
|
77
|
+
// Specialized AI chatbot that helps you identify suspicious online interactions so you don’t become a victim.
|
|
78
|
+
// </p>
|
|
79
|
+
// </bd-light-carousel-item>
|
|
80
80
|
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
81
|
+
// <bd-light-carousel-item
|
|
82
|
+
// title="Scam Wave Alerts"
|
|
83
|
+
// icon="src/assets/icons/light-carousel-img1.png"
|
|
84
|
+
// badge="NEW"
|
|
85
|
+
// >
|
|
86
|
+
// <p>
|
|
87
|
+
// Stay informed with real-time alerts about ongoing scam outbreaks detected in your area automatically.
|
|
88
|
+
// </p>
|
|
89
|
+
// </bd-light-carousel-item>
|
|
90
90
|
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
91
|
+
// <bd-light-carousel-item
|
|
92
|
+
// title="Online Scam Protection"
|
|
93
|
+
// icon="src/assets/icons/light-carousel-img1.png"
|
|
94
|
+
// badge="NEW"
|
|
95
|
+
// >
|
|
96
|
+
// <p>Focused on browsing activities, it specializes in detecting the newest scam patterns and tactics.</p>
|
|
97
|
+
// </bd-light-carousel-item>
|
|
98
98
|
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
99
|
+
// <bd-light-carousel-item
|
|
100
|
+
// title="Remote Access Protection"
|
|
101
|
+
// icon="src/assets/icons/light-carousel-img1.png"
|
|
102
|
+
// badge="NEW"
|
|
103
|
+
// >
|
|
104
|
+
// <p>Detects patterns of behavior typical of scammers seeking to access your data remotely.</p>
|
|
105
|
+
// </bd-light-carousel-item>
|
|
106
106
|
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
107
|
+
// <bd-light-carousel-item
|
|
108
|
+
// title="SMS Protection"
|
|
109
|
+
// icon="src/assets/icons/light-carousel-img1.png"
|
|
110
|
+
// badge="IMPROVED"
|
|
111
|
+
// >
|
|
112
|
+
// <p>Detects scams and harmful links in SMS messages3 using advanced AI for fast, real-time protection.</p>
|
|
113
|
+
// </bd-light-carousel-item>
|
|
114
114
|
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
115
|
+
// <bd-light-carousel-item
|
|
116
|
+
// title="Email Protection"
|
|
117
|
+
// icon="src/assets/icons/light-carousel-img1.png"
|
|
118
|
+
// >
|
|
119
|
+
// <p>Detects scams and harmful links in SMS messages3 using advanced AI for fast, real-time protection.</p>
|
|
120
|
+
// </bd-light-carousel-item>
|
|
121
121
|
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
122
|
+
// <bd-light-carousel-item
|
|
123
|
+
// title="Scam Notification Protection"
|
|
124
|
+
// icon="src/assets/icons/light-carousel-img1.png"
|
|
125
|
+
// >
|
|
126
|
+
// <p>Scans and detects scam attempts directly in push notifications4 before you even tap or interact.</p>
|
|
127
|
+
// </bd-light-carousel-item>
|
|
128
128
|
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
129
|
+
// <bd-light-carousel-item
|
|
130
|
+
// title="Chat Protection"
|
|
131
|
+
// icon="src/assets/icons/light-carousel-img1.png"
|
|
132
|
+
// >
|
|
133
|
+
// <p>Identifies scam messages in WhatsApp, Messenger, Telegram and Discord chats4 before they reach your attention.</p>
|
|
134
|
+
// </bd-light-carousel-item>
|
|
135
135
|
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
136
|
+
// <bd-light-carousel-item
|
|
137
|
+
// title="Calendar Invites Protection"
|
|
138
|
+
// icon="src/assets/icons/light-carousel-img1.png"
|
|
139
|
+
// >
|
|
140
|
+
// <p>Finds and blocks scam calendar events5 before they can trick you with fake links or misleading invites.</p>
|
|
141
|
+
// </bd-light-carousel-item>
|
|
142
|
+
// </bd-light-carousel-section>
|
|
143
143
|
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
144
|
+
// <div class="tabs">
|
|
145
|
+
// <bd-tabs-component id="anchor-2-section"></bd-tabs-component>
|
|
146
|
+
// </div>
|
|
147
147
|
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
148
|
+
// <bd-faq-section title="Questions? Answers." id="anchor-1-section">
|
|
149
|
+
// <bd-faq-section-item title="How does Bitdefender Internet Security protect me?">
|
|
150
|
+
// <p>Bitdefender Internet Security provides the best protection...</p>
|
|
151
|
+
// <p>Bitdefender Internet Security provides the best protection...</p>
|
|
152
|
+
// <p>Bitdefender Internet Security provides the best protection...</p>
|
|
153
|
+
// </bd-faq-section-item>
|
|
154
154
|
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
155
|
+
// <bd-faq-section-item title="Does Bitdefender protect me against ransomware?">
|
|
156
|
+
// <p>Yes! Bitdefender Internet Security offers unbeatable ransomware protection...</p>
|
|
157
|
+
// </bd-faq-section-item>
|
|
158
158
|
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
159
|
+
// <bd-faq-section-item title="Do I get a VPN with Bitdefender Internet Security?">
|
|
160
|
+
// <p>Bitdefender Internet Security includes a basic VPN with 200MB per day.</p>
|
|
161
|
+
// </bd-faq-section-item>
|
|
162
|
+
// </bd-faq-section>
|
|
163
163
|
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
164
|
+
// <div class="bd-answer">
|
|
165
|
+
// <bd-terms-section></bd-terms-section>
|
|
166
|
+
// </div>
|
|
167
167
|
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
168
|
+
// <bd-carousel-section
|
|
169
|
+
// title="Need help? We've got answers!"
|
|
170
|
+
// id="anchor-3-section"
|
|
171
|
+
// >
|
|
172
|
+
// <bd-carousel-item
|
|
173
|
+
// title="Scam Copilot Bot"
|
|
174
|
+
// subTitle="Specialized AI chatbot that helps you identify suspicious online interactions so you don’t become a victim"
|
|
175
|
+
// modalText="Specialized AI chatbot that helps you identify suspicious online interactions so you don’t become a victim"
|
|
176
|
+
// icon="src/assets/icons/light-carousel-img1.png"
|
|
177
|
+
// >
|
|
178
|
+
// <h3>Scam Copilot Bot</h3>
|
|
179
|
+
// <p>Specialized AI chatbot that helps you identify suspicious online interactions so you don’t become a victim.</p>
|
|
180
|
+
// <p>Specialized AI chatbot that helps you identify suspicious online interactions so you don’t become a victim.</p>
|
|
181
|
+
// <p>Specialized AI chatbot that helps you identify suspicious online interactions so you don’t become a victim.</p>
|
|
182
|
+
// <h6>Testare Scam Copilot</h6>
|
|
183
|
+
// </bd-carousel-item>
|
|
184
184
|
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
185
|
+
// <bd-carousel-item
|
|
186
|
+
// title="Scam Wave Alerts"
|
|
187
|
+
// subTitle="Proactively informs you about scam outbreaks in your region"
|
|
188
|
+
// modalText="Proactively informs you about scam outbreaks in your region"
|
|
189
|
+
// icon="src/assets/icons/light-carousel-img1.png"
|
|
190
|
+
// >
|
|
191
|
+
// <h3>Scam Wave Alerts</h3>
|
|
192
|
+
// <p>Proactively informs you about scam outbreaks in your region.</p>
|
|
193
|
+
// </bd-carousel-item>
|
|
194
194
|
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
195
|
+
// <bd-carousel-item
|
|
196
|
+
// title="AI-Powered Scam Check"
|
|
197
|
+
// subTitle="AI-driven tool that instantly evaluates the legitimacy of any link, message, or online interaction"
|
|
198
|
+
// modalText="AI-driven tool that instantly evaluates the legitimacy of any link, message, or online interaction"
|
|
199
|
+
// icon="src/assets/icons/light-carousel-img1.png"
|
|
200
|
+
// >
|
|
201
|
+
// <h3>AI-Powered Scam Check</h3>
|
|
202
|
+
// <p>AI-driven tool that instantly evaluates the legitimacy of any link, message, or online interaction.</p>
|
|
203
|
+
// </bd-carousel-item>
|
|
204
204
|
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
205
|
+
// <bd-carousel-item
|
|
206
|
+
// title="Educational Resources"
|
|
207
|
+
// subTitle="Access a wealth of information and best practices to stay informed and vigilant against scams"
|
|
208
|
+
// modalText="Access a wealth of information and best practices to stay informed and vigilant against scams"
|
|
209
|
+
// icon="src/assets/icons/light-carousel-img1.png"
|
|
210
|
+
// >
|
|
211
|
+
// <h3>Educational Resources</h3>
|
|
212
|
+
// <p>Access a wealth of information and best practices to stay informed and vigilant against scams.</p>
|
|
213
|
+
// </bd-carousel-item>
|
|
214
214
|
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
215
|
+
// <bd-carousel-item
|
|
216
|
+
// title="Phishing Simulator"
|
|
217
|
+
// subTitle="Simulates phishing attacks to help you recognize and respond appropriately to real threats"
|
|
218
|
+
// modalText="Simulates phishing attacks to help you recognize and respond appropriately to real threats"
|
|
219
|
+
// icon="src/assets/icons/light-carousel-img1.png"
|
|
220
|
+
// >
|
|
221
|
+
// <h3>Phishing Simulator</h3>
|
|
222
|
+
// <p>Simulates phishing attacks to help you recognize and respond appropriately to real threats.</p>
|
|
223
|
+
// </bd-carousel-item>
|
|
224
224
|
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
225
|
+
// <bd-carousel-item
|
|
226
|
+
// title="Real-Time Scam Updates"
|
|
227
|
+
// subTitle="Stay ahead with up-to-the-minute alerts on the latest scams targeting your region or industry"
|
|
228
|
+
// modalText="Stay ahead with up-to-the-minute alerts on the latest scams targeting your region or industry"
|
|
229
|
+
// icon="src/assets/icons/light-carousel-img1.png"
|
|
230
|
+
// >
|
|
231
|
+
// <h3>Real-Time Scam Updates</h3>
|
|
232
|
+
// <p>Stay ahead with up-to-the-minute alerts on the latest scams targeting your region or industry.</p>
|
|
233
|
+
// </bd-carousel-item>
|
|
234
234
|
|
|
235
|
-
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
235
|
+
// <bd-carousel-item
|
|
236
|
+
// title="Community Reporting Hub"
|
|
237
|
+
// subTitle="A platform where users can report scams and share experiences to help protect others"
|
|
238
|
+
// modalText="A platform where users can report scams and share experiences to help protect others"
|
|
239
|
+
// icon="src/assets/icons/light-carousel-img1.png"
|
|
240
|
+
// >
|
|
241
|
+
// <h3>Community Reporting Hub</h3>
|
|
242
|
+
// <p>A platform where users can report scams and share experiences to help protect others.</p>
|
|
243
|
+
// </bd-carousel-item>
|
|
244
244
|
|
|
245
|
-
|
|
246
|
-
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
245
|
+
// <bd-carousel-item
|
|
246
|
+
// title="Fraud Prevention Workshops"
|
|
247
|
+
// subTitle="Interactive workshops that educate users on identifying and avoiding scams"
|
|
248
|
+
// modalText="Interactive workshops that educate users on identifying and avoiding scams"
|
|
249
|
+
// icon="src/assets/icons/light-carousel-img1.png"
|
|
250
|
+
// >
|
|
251
|
+
// <h3>Fraud Prevention Workshops</h3>
|
|
252
|
+
// <p>Interactive workshops that educate users on identifying and avoiding scams.</p>
|
|
253
|
+
// </bd-carousel-item>
|
|
254
|
+
// </bd-carousel-section>
|
|
255
255
|
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
|
|
259
|
-
|
|
260
|
-
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
|
|
256
|
+
// <bd-toggle-radio name="group1" value="opt1" label="Toggle 1" disabled></bd-toggle-radio>
|
|
257
|
+
// <bd-toggle-radio name="group1" value="opt1" label="Toggle 1" disabled checked></bd-toggle-radio>
|
|
258
|
+
// <bd-toggle-radio name="group1" value="opt2" label="Toggle 2"></bd-toggle-radio>
|
|
259
|
+
// <bd-toggle-radio name="billing" value="yearly" label="Yearly"></bd-toggle-radio>
|
|
260
|
+
// <bd-toggle-radio name="billing" value="monthly" label="Monthly"></bd-toggle-radio>
|
|
261
|
+
// <bd-radio name="billing" value="yearly" label="Yearly"></bd-radio>
|
|
262
|
+
// <bd-radio disabled checked label="Test" value="x"></bd-radio>
|
|
263
|
+
// <bd-checkbox label="Accept terms" checked></bd-checkbox>
|
|
264
264
|
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
|
|
265
|
+
// <div style="padding: 40px 0;">
|
|
266
|
+
// <bd-divider-horizontal></bd-divider-horizontal>
|
|
267
|
+
// </div>
|
|
268
268
|
|
|
269
|
-
|
|
270
|
-
`;
|
|
269
|
+
// <bd-badge>Badge</bd-badge>
|
|
270
|
+
// `;
|