maverick-wave 5.30.0 → 5.32.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/README.md +2 -2
- package/maverick-wave.min.css +2 -2
- package/package.json +8 -2
- package/src/scss/abstracts/_variables.scss +2 -0
- package/src/scss/components/_modals.scss +23 -9
- package/src/scss/components/_testimonial.scss +2 -0
- package/src/scss/layout/_home.scss +46 -0
- package/src/scss/layout/_main.scss +20 -0
- package/src/scss/layout/_parallax.scss +2 -2
- package/src/scss/main-lean.scss +8 -3
- package/.claude/settings.local.json +0 -43
- package/.claude/skills/mw-maverick-wave/SKILL.md +0 -532
- package/.claude/skills/mw-maverick-wave/examples/angular-form.md +0 -279
- package/.claude/skills/mw-maverick-wave/examples/angular-list-page.md +0 -309
- package/.claude/skills/mw-maverick-wave/examples/angular-services.md +0 -538
- package/.claude/skills/mw-maverick-wave/examples/static-landing-page.md +0 -530
- package/.claude/skills/mw-maverick-wave/references/components.md +0 -2170
- package/.claude/skills/mw-maverick-wave/references/forms.md +0 -358
- package/.claude/skills/mw-maverick-wave/references/javascript.md +0 -164
- package/.claude/skills/mw-maverick-wave/references/layout.md +0 -764
- package/.claude/skills/mw-maverick-wave/references/theming.md +0 -530
- package/.github/workflows/ci.yml +0 -41
- package/.idea/codeStyles/Project.xml +0 -59
- package/.idea/codeStyles/codeStyleConfig.xml +0 -5
- package/.idea/maverick-wave.iml +0 -12
- package/.idea/modules.xml +0 -8
- package/.idea/prettier.xml +0 -6
- package/.idea/vcs.xml +0 -6
- package/.prettierignore +0 -8
- package/.prettierrc.json +0 -7
- package/CHANGELOG.md +0 -956
- package/CLAUDE.md +0 -60
- package/gulpfile.js +0 -167
- package/index.html +0 -1730
- package/release.sh +0 -31
- package/scripts/verify.js +0 -252
- package/src/assets/favicon/apple-touch-icon.png +0 -0
- package/src/assets/favicon/favicon-96x96.png +0 -0
- package/src/assets/favicon/favicon.svg +0 -1
- package/src/assets/favicon/site.webmanifest +0 -37
- package/src/assets/favicon/web-app-manifest-192x192.png +0 -0
- package/src/assets/favicon/web-app-manifest-512x512.png +0 -0
- package/src/assets/favicon.ico +0 -0
- package/src/assets/header-logo.svg +0 -24
- package/src/assets/images/gallery-city.svg +0 -49
- package/src/assets/images/gallery-desert.svg +0 -25
- package/src/assets/images/gallery-forest.svg +0 -46
- package/src/assets/images/gallery-lake.svg +0 -26
- package/src/assets/images/gallery-mountain.svg +0 -19
- package/src/assets/images/gallery-ocean.svg +0 -26
- package/src/assets/images/gallery-oldtown.svg +0 -41
- package/src/assets/images/gallery-snow.svg +0 -39
- package/src/assets/images/photo-balloon.svg +0 -35
- package/src/assets/images/photo-forest-path.svg +0 -31
- package/src/assets/images/photo-lighthouse.svg +0 -42
- package/src/assets/images/photo-palm.svg +0 -27
- package/src/assets/images/photo-peak.svg +0 -27
- package/src/assets/images/photo-tower.svg +0 -34
- package/src/assets/images/photo-waterfall.svg +0 -32
- package/src/assets/images/slider-field.svg +0 -124
- package/src/assets/images/slider-forest.svg +0 -33
- package/src/assets/images/slider-lake.svg +0 -35
- package/src/assets/images/slider-mountains.svg +0 -29
- package/src/assets/images/slider-trees.svg +0 -41
- package/src/assets/images/story-aurora.svg +0 -36
- package/src/assets/images/story-beach.svg +0 -34
- package/src/assets/images/story-stars.svg +0 -35
- package/src/assets/images/tile-analytics.svg +0 -22
- package/src/assets/images/tile-cloud.svg +0 -19
- package/src/assets/images/tile-ecommerce.svg +0 -14
- package/src/assets/images/tile-enterprise.svg +0 -22
- package/src/assets/images/tile-marketing.svg +0 -16
- package/src/assets/media/demo-chime.wav +0 -0
- package/src/assets/media/story-sunrise.jpg +0 -0
- package/src/assets/media/story-sunrise.mp4 +0 -0
- package/src/partials/accordions-container.html +0 -179
- package/src/partials/alerts-container.html +0 -151
- package/src/partials/announcement-container.html +0 -67
- package/src/partials/avatars-container.html +0 -229
- package/src/partials/badges-container.html +0 -114
- package/src/partials/blog-posts-container.html +0 -158
- package/src/partials/breadcrumbs-container.html +0 -126
- package/src/partials/button-bar-container.html +0 -175
- package/src/partials/buttons-container.html +0 -272
- package/src/partials/calendar-container.html +0 -203
- package/src/partials/cards-container.html +0 -727
- package/src/partials/code-container.html +0 -194
- package/src/partials/colors-container.html +0 -263
- package/src/partials/coming-soon-container.html +0 -10
- package/src/partials/contact-container.html +0 -85
- package/src/partials/content-slider-container.html +0 -36
- package/src/partials/divider-container.html +0 -70
- package/src/partials/documentation-container.html +0 -204
- package/src/partials/dropdown-container.html +0 -119
- package/src/partials/empty-state-container.html +0 -79
- package/src/partials/feed-container.html +0 -506
- package/src/partials/footer-container.html +0 -113
- package/src/partials/form-container.html +0 -262
- package/src/partials/form-elements-container.html +0 -616
- package/src/partials/form-field-container.html +0 -166
- package/src/partials/gallery-container.html +0 -62
- package/src/partials/get-started-container.html +0 -423
- package/src/partials/grid-container.html +0 -191
- package/src/partials/header-container.html +0 -69
- package/src/partials/header-utilities-container.html +0 -331
- package/src/partials/highlights-container.html +0 -71
- package/src/partials/history-container.html +0 -67
- package/src/partials/home-container.html +0 -31
- package/src/partials/html-lists-container.html +0 -63
- package/src/partials/info-container.html +0 -104
- package/src/partials/input-group-container.html +0 -299
- package/src/partials/item-lists-container.html +0 -368
- package/src/partials/kanban-container.html +0 -459
- package/src/partials/kbd-container.html +0 -63
- package/src/partials/leader-row-container.html +0 -139
- package/src/partials/login-container.html +0 -65
- package/src/partials/lunch-menu-container.html +0 -341
- package/src/partials/media-container.html +0 -27
- package/src/partials/meta-info-container.html +0 -21
- package/src/partials/modals-container.html +0 -199
- package/src/partials/mosaic-container.html +0 -173
- package/src/partials/page-header-container.html +0 -78
- package/src/partials/pagination-container.html +0 -64
- package/src/partials/palette-container.html +0 -480
- package/src/partials/panels-container.html +0 -126
- package/src/partials/parallax-container.html +0 -147
- package/src/partials/portrait-gallery-container.html +0 -175
- package/src/partials/preview-container.html +0 -136
- package/src/partials/pricing-container.html +0 -523
- package/src/partials/progress-container.html +0 -230
- package/src/partials/prose-container.html +0 -43
- package/src/partials/ratings-container.html +0 -104
- package/src/partials/section-head-container.html +0 -77
- package/src/partials/segmented-container.html +0 -66
- package/src/partials/skeleton-container.html +0 -87
- package/src/partials/spinners-container.html +0 -96
- package/src/partials/stepper-container.html +0 -111
- package/src/partials/stories-container.html +0 -182
- package/src/partials/tables-container.html +0 -309
- package/src/partials/tabs-container.html +0 -290
- package/src/partials/tags-container.html +0 -242
- package/src/partials/techstack-bucket-container.html +0 -187
- package/src/partials/testimonials-container.html +0 -88
- package/src/partials/tiles-container.html +0 -247
- package/src/partials/timelines-container.html +0 -196
- package/src/partials/typography-container.html +0 -74
- package/src/partials/utilities-container.html +0 -553
|
@@ -1,204 +0,0 @@
|
|
|
1
|
-
<div class="mw-card mw-card-simple">
|
|
2
|
-
<h3>Table of Contents</h3>
|
|
3
|
-
|
|
4
|
-
<ul class="mw-list mw-list-link">
|
|
5
|
-
<li>
|
|
6
|
-
<a href="#foundations">Foundations</a>
|
|
7
|
-
</li>
|
|
8
|
-
<ul class="mw-list mw-list-link">
|
|
9
|
-
<li>
|
|
10
|
-
<a href="#typography">Typography</a>
|
|
11
|
-
</li>
|
|
12
|
-
<li>
|
|
13
|
-
<a href="#colors">Colors</a>
|
|
14
|
-
</li>
|
|
15
|
-
<li>
|
|
16
|
-
<a href="#utilities">Utilities</a>
|
|
17
|
-
</li>
|
|
18
|
-
<li>
|
|
19
|
-
<a href="#header-utilities">Header Utilities</a>
|
|
20
|
-
</li>
|
|
21
|
-
<li>
|
|
22
|
-
<a href="#coming-soon">Coming Soon Banner</a>
|
|
23
|
-
</li>
|
|
24
|
-
<li>
|
|
25
|
-
<a href="#divider">Divider</a>
|
|
26
|
-
</li>
|
|
27
|
-
</ul>
|
|
28
|
-
<!-- seperator -->
|
|
29
|
-
<li>
|
|
30
|
-
<a href="#layout">Layout</a>
|
|
31
|
-
</li>
|
|
32
|
-
<ul class="mw-list mw-list-link">
|
|
33
|
-
<li>
|
|
34
|
-
<a href="#grid">Grid System</a>
|
|
35
|
-
</li>
|
|
36
|
-
<li>
|
|
37
|
-
<a href="#cards">Cards</a>
|
|
38
|
-
</li>
|
|
39
|
-
<li>
|
|
40
|
-
<a href="#panels">Panels</a>
|
|
41
|
-
</li>
|
|
42
|
-
<li>
|
|
43
|
-
<a href="#tabs">Tabs</a>
|
|
44
|
-
</li>
|
|
45
|
-
<li>
|
|
46
|
-
<a href="#accordions">Accordions</a>
|
|
47
|
-
</li>
|
|
48
|
-
<li>
|
|
49
|
-
<a href="#tiles">Tiles</a>
|
|
50
|
-
</li>
|
|
51
|
-
<li>
|
|
52
|
-
<a href="#breadcrumbs">Breadcrumbs</a>
|
|
53
|
-
</li>
|
|
54
|
-
<li>
|
|
55
|
-
<a href="#modals">Modals</a>
|
|
56
|
-
</li>
|
|
57
|
-
<li>
|
|
58
|
-
<a href="#html-lists">HTML Lists</a>
|
|
59
|
-
</li>
|
|
60
|
-
<li>
|
|
61
|
-
<a href="#item-lists">Item Lists</a>
|
|
62
|
-
<a href="#leader-row">Leader Row</a>
|
|
63
|
-
</li>
|
|
64
|
-
<li>
|
|
65
|
-
<a href="#stepper">Stepper</a>
|
|
66
|
-
</li>
|
|
67
|
-
</ul>
|
|
68
|
-
<!-- seperator -->
|
|
69
|
-
<li>
|
|
70
|
-
<a href="#components">Components</a>
|
|
71
|
-
</li>
|
|
72
|
-
<ul class="mw-list mw-list-link">
|
|
73
|
-
<li>
|
|
74
|
-
<a href="#buttons">Buttons</a>
|
|
75
|
-
</li>
|
|
76
|
-
<li>
|
|
77
|
-
<a href="#button-bar">Button Bar</a>
|
|
78
|
-
</li>
|
|
79
|
-
<li>
|
|
80
|
-
<a href="#progress">Progress Bars</a>
|
|
81
|
-
</li>
|
|
82
|
-
<li>
|
|
83
|
-
<a href="#spinners">Loading Spinners</a>
|
|
84
|
-
</li>
|
|
85
|
-
<li>
|
|
86
|
-
<a href="#avatars">Avatars</a>
|
|
87
|
-
</li>
|
|
88
|
-
<li>
|
|
89
|
-
<a href="#tags">Tags</a>
|
|
90
|
-
</li>
|
|
91
|
-
<li>
|
|
92
|
-
<a href="#badges">Badges</a>
|
|
93
|
-
</li>
|
|
94
|
-
<li>
|
|
95
|
-
<a href="#dropdown">Dropdown</a>
|
|
96
|
-
</li>
|
|
97
|
-
<li>
|
|
98
|
-
<a href="#kbd">Keyboard Keys</a>
|
|
99
|
-
</li>
|
|
100
|
-
<li>
|
|
101
|
-
<a href="#ratings">Ratings</a>
|
|
102
|
-
</li>
|
|
103
|
-
<li>
|
|
104
|
-
<a href="#info">Info</a>
|
|
105
|
-
</li>
|
|
106
|
-
<li>
|
|
107
|
-
<a href="#alerts">Alerts</a>
|
|
108
|
-
</li>
|
|
109
|
-
<li>
|
|
110
|
-
<a href="#announcement">Announcement</a>
|
|
111
|
-
</li>
|
|
112
|
-
<li>
|
|
113
|
-
<a href="#code">Code</a>
|
|
114
|
-
</li>
|
|
115
|
-
<li>
|
|
116
|
-
<a href="#skeleton">Skeleton Loader</a>
|
|
117
|
-
</li>
|
|
118
|
-
<li>
|
|
119
|
-
<a href="#empty-state">Empty State</a>
|
|
120
|
-
</li>
|
|
121
|
-
<li>
|
|
122
|
-
<a href="#pricing">Pricing</a>
|
|
123
|
-
</li>
|
|
124
|
-
</ul>
|
|
125
|
-
<!-- seperator -->
|
|
126
|
-
<li>
|
|
127
|
-
<a href="#forms">Forms</a>
|
|
128
|
-
</li>
|
|
129
|
-
<ul class="mw-list mw-list-link">
|
|
130
|
-
<li>
|
|
131
|
-
<a href="#form-elements">Form Elements</a>
|
|
132
|
-
</li>
|
|
133
|
-
<li>
|
|
134
|
-
<a href="#input-group">Input Group</a>
|
|
135
|
-
</li>
|
|
136
|
-
<li>
|
|
137
|
-
<a href="#segmented">Segmented Control</a>
|
|
138
|
-
</li>
|
|
139
|
-
<li>
|
|
140
|
-
<a href="#form-field">Field Pattern</a>
|
|
141
|
-
</li>
|
|
142
|
-
<li>
|
|
143
|
-
<a href="#form">Form</a>
|
|
144
|
-
</li>
|
|
145
|
-
<li>
|
|
146
|
-
<a href="#login">Login</a>
|
|
147
|
-
</li>
|
|
148
|
-
</ul>
|
|
149
|
-
<!-- seperator -->
|
|
150
|
-
<li>
|
|
151
|
-
<a href="#data-display">Data & Display</a>
|
|
152
|
-
</li>
|
|
153
|
-
<ul class="mw-list mw-list-link">
|
|
154
|
-
<li>
|
|
155
|
-
<a href="#page-header">Page Header</a>
|
|
156
|
-
</li>
|
|
157
|
-
<li>
|
|
158
|
-
<a href="#meta-info">Meta Info</a>
|
|
159
|
-
</li>
|
|
160
|
-
<li>
|
|
161
|
-
<a href="#tables">Tables</a>
|
|
162
|
-
</li>
|
|
163
|
-
<li>
|
|
164
|
-
<a href="#kanban">Kanban</a>
|
|
165
|
-
</li>
|
|
166
|
-
<li>
|
|
167
|
-
<a href="#calendar">Calendar</a>
|
|
168
|
-
<a href="#lunch-menu">Lunch Menu</a>
|
|
169
|
-
<a href="#contact">Contact</a>
|
|
170
|
-
</li>
|
|
171
|
-
<li>
|
|
172
|
-
<a href="#pagination">Pagination</a>
|
|
173
|
-
</li>
|
|
174
|
-
<li>
|
|
175
|
-
<a href="#timelines">Timelines</a>
|
|
176
|
-
</li>
|
|
177
|
-
<li>
|
|
178
|
-
<a href="#gallery">Image Gallery</a>
|
|
179
|
-
</li>
|
|
180
|
-
<li>
|
|
181
|
-
<a href="#techstack-bucket">Techstack Bucket</a>
|
|
182
|
-
</li>
|
|
183
|
-
<li>
|
|
184
|
-
<a href="#content-slider">Content Slider</a>
|
|
185
|
-
</li>
|
|
186
|
-
<li>
|
|
187
|
-
<a href="#testimonials">Testimonials</a>
|
|
188
|
-
</li>
|
|
189
|
-
<li>
|
|
190
|
-
<a href="#prose">Prose</a>
|
|
191
|
-
</li>
|
|
192
|
-
<li>
|
|
193
|
-
<a href="#media">Media</a>
|
|
194
|
-
</li>
|
|
195
|
-
<li>
|
|
196
|
-
<a href="#blog-posts">Blog Posts</a>
|
|
197
|
-
</li>
|
|
198
|
-
</ul>
|
|
199
|
-
<!-- seperator -->
|
|
200
|
-
<li>
|
|
201
|
-
<a href="#history">History</a>
|
|
202
|
-
</li>
|
|
203
|
-
</ul>
|
|
204
|
-
</div>
|
|
@@ -1,119 +0,0 @@
|
|
|
1
|
-
<h3 class="mw-section-subtitle">Dropdown</h3>
|
|
2
|
-
|
|
3
|
-
<p class="mw-text-muted mw-text-measure">
|
|
4
|
-
Built on <code><details></code> and <code><summary></code> rather
|
|
5
|
-
than a <code>div</code> and a click handler. That buys the whole keyboard
|
|
6
|
-
contract for free: the trigger is focusable, Enter and Space toggle it, the
|
|
7
|
-
open state lives in the DOM where a screen reader can see it, and the menu
|
|
8
|
-
still opens with JavaScript switched off. The framework script only adds what
|
|
9
|
-
markup cannot express - closing on <kbd>Esc</kbd> and on a click elsewhere.
|
|
10
|
-
</p>
|
|
11
|
-
|
|
12
|
-
<div class="mw-grid-2 mw-gap-6">
|
|
13
|
-
<div>
|
|
14
|
-
<h3 class="mw-card-title mw-mb-4">Actions menu</h3>
|
|
15
|
-
<div class="mw-card mw-card-simple mw-grid-1 mw-gap-6">
|
|
16
|
-
<div>
|
|
17
|
-
<h4 class="mw-text-medium mw-mb-2">Default</h4>
|
|
18
|
-
<details class="mw-dropdown">
|
|
19
|
-
<summary class="mw-btn mw-btn-primary">
|
|
20
|
-
Actions <i class="fas fa-chevron-down mw-dropdown-caret"></i>
|
|
21
|
-
</summary>
|
|
22
|
-
<div class="mw-dropdown-menu">
|
|
23
|
-
<div class="mw-dropdown-label">Manage</div>
|
|
24
|
-
<button class="mw-dropdown-item">
|
|
25
|
-
<i class="fas fa-pen"></i> Edit
|
|
26
|
-
</button>
|
|
27
|
-
<button class="mw-dropdown-item">
|
|
28
|
-
<i class="fas fa-copy"></i> Duplicate
|
|
29
|
-
</button>
|
|
30
|
-
<button class="mw-dropdown-item" disabled>
|
|
31
|
-
<i class="fas fa-arrow-right"></i> Move
|
|
32
|
-
</button>
|
|
33
|
-
<hr class="mw-dropdown-divider" />
|
|
34
|
-
<button class="mw-dropdown-item mw-dropdown-item-danger">
|
|
35
|
-
<i class="fas fa-trash"></i> Delete
|
|
36
|
-
</button>
|
|
37
|
-
</div>
|
|
38
|
-
</details>
|
|
39
|
-
</div>
|
|
40
|
-
|
|
41
|
-
<div>
|
|
42
|
-
<h4 class="mw-text-medium mw-mb-2">As a picker</h4>
|
|
43
|
-
<details class="mw-dropdown">
|
|
44
|
-
<summary class="mw-btn mw-btn-outline">
|
|
45
|
-
Sort by: Newest
|
|
46
|
-
<i class="fas fa-chevron-down mw-dropdown-caret"></i>
|
|
47
|
-
</summary>
|
|
48
|
-
<div class="mw-dropdown-menu">
|
|
49
|
-
<button class="mw-dropdown-item mw-active" aria-checked="true">
|
|
50
|
-
Newest first
|
|
51
|
-
</button>
|
|
52
|
-
<button class="mw-dropdown-item">Oldest first</button>
|
|
53
|
-
<button class="mw-dropdown-item">Name A - Z</button>
|
|
54
|
-
<button class="mw-dropdown-item">Name Z - A</button>
|
|
55
|
-
</div>
|
|
56
|
-
</details>
|
|
57
|
-
<p class="mw-text-muted mw-text-sm mw-mt-3 mw-mb-0">
|
|
58
|
-
<code>mw-active</code> marks the current choice, for a menu that picks
|
|
59
|
-
rather than acts.
|
|
60
|
-
</p>
|
|
61
|
-
</div>
|
|
62
|
-
</div>
|
|
63
|
-
</div>
|
|
64
|
-
|
|
65
|
-
<div>
|
|
66
|
-
<h3 class="mw-card-title mw-mb-4">Alignment</h3>
|
|
67
|
-
<div class="mw-card mw-card-simple mw-grid-1 mw-gap-6">
|
|
68
|
-
<div class="mw-row-split mw-row-split-center">
|
|
69
|
-
<span class="mw-text-muted mw-text-sm">Start (default)</span>
|
|
70
|
-
<details class="mw-dropdown">
|
|
71
|
-
<summary class="mw-btn mw-btn-sm mw-btn-outline">
|
|
72
|
-
Menu <i class="fas fa-chevron-down mw-dropdown-caret"></i>
|
|
73
|
-
</summary>
|
|
74
|
-
<div class="mw-dropdown-menu">
|
|
75
|
-
<button class="mw-dropdown-item">One</button>
|
|
76
|
-
<button class="mw-dropdown-item">Two</button>
|
|
77
|
-
</div>
|
|
78
|
-
</details>
|
|
79
|
-
</div>
|
|
80
|
-
|
|
81
|
-
<div class="mw-row-split mw-row-split-center">
|
|
82
|
-
<span class="mw-text-muted mw-text-sm"
|
|
83
|
-
><code>mw-dropdown-end</code></span
|
|
84
|
-
>
|
|
85
|
-
<details class="mw-dropdown mw-dropdown-end">
|
|
86
|
-
<summary class="mw-btn mw-btn-sm mw-btn-outline">
|
|
87
|
-
Menu <i class="fas fa-chevron-down mw-dropdown-caret"></i>
|
|
88
|
-
</summary>
|
|
89
|
-
<div class="mw-dropdown-menu">
|
|
90
|
-
<button class="mw-dropdown-item">One</button>
|
|
91
|
-
<button class="mw-dropdown-item">Two</button>
|
|
92
|
-
</div>
|
|
93
|
-
</details>
|
|
94
|
-
</div>
|
|
95
|
-
|
|
96
|
-
<div class="mw-row-split mw-row-split-center">
|
|
97
|
-
<span class="mw-text-muted mw-text-sm"
|
|
98
|
-
><code>mw-dropdown-up</code></span
|
|
99
|
-
>
|
|
100
|
-
<details class="mw-dropdown mw-dropdown-up mw-dropdown-end">
|
|
101
|
-
<summary class="mw-btn mw-btn-sm mw-btn-outline">
|
|
102
|
-
Menu <i class="fas fa-chevron-down mw-dropdown-caret"></i>
|
|
103
|
-
</summary>
|
|
104
|
-
<div class="mw-dropdown-menu">
|
|
105
|
-
<button class="mw-dropdown-item">One</button>
|
|
106
|
-
<button class="mw-dropdown-item">Two</button>
|
|
107
|
-
</div>
|
|
108
|
-
</details>
|
|
109
|
-
</div>
|
|
110
|
-
|
|
111
|
-
<p class="mw-text-muted mw-text-sm mw-mb-0">
|
|
112
|
-
The menu is absolutely positioned, so an ancestor that hides its
|
|
113
|
-
overflow clips it. The framework's own containers lift that clip while a
|
|
114
|
-
menu is open; on your own, one line does the same:
|
|
115
|
-
<code>:has(.mw-dropdown[open]) { overflow: visible }</code>.
|
|
116
|
-
</p>
|
|
117
|
-
</div>
|
|
118
|
-
</div>
|
|
119
|
-
</div>
|
|
@@ -1,79 +0,0 @@
|
|
|
1
|
-
<h3 class="mw-section-subtitle">Empty State</h3>
|
|
2
|
-
<p class="mw-text-muted mw-text-measure">
|
|
3
|
-
What a list shows when it holds nothing. An icon, a line saying what is
|
|
4
|
-
missing and, ideally, the action that fills it. The parts are
|
|
5
|
-
<code>-icon</code>, <code>-title</code> and <code>-desc</code>.
|
|
6
|
-
</p>
|
|
7
|
-
|
|
8
|
-
<div class="mw-grid-2-lg">
|
|
9
|
-
<div>
|
|
10
|
-
<h3 class="mw-card-title mw-mb-4">Basic & Color Variants</h3>
|
|
11
|
-
<div class="mw-card mw-card-simple">
|
|
12
|
-
<h4 class="mw-text-medium mw-mb-2">Default</h4>
|
|
13
|
-
<div class="mw-empty-state">
|
|
14
|
-
<div class="mw-empty-state-icon"><i class="fas fa-inbox"></i></div>
|
|
15
|
-
<p class="mw-empty-state-title">Nothing here yet</p>
|
|
16
|
-
<p class="mw-empty-state-desc">
|
|
17
|
-
Start by adding your first item to see it appear here.
|
|
18
|
-
</p>
|
|
19
|
-
<button class="mw-btn mw-btn-primary">Add Item</button>
|
|
20
|
-
</div>
|
|
21
|
-
</div>
|
|
22
|
-
|
|
23
|
-
<div class="mw-card mw-card-simple mw-mt-4">
|
|
24
|
-
<h4 class="mw-text-medium mw-mb-2">Warning</h4>
|
|
25
|
-
<div class="mw-empty-state mw-empty-state-warning mw-empty-state-sm">
|
|
26
|
-
<div class="mw-empty-state-icon">
|
|
27
|
-
<i class="fas fa-exclamation-triangle"></i>
|
|
28
|
-
</div>
|
|
29
|
-
<p class="mw-empty-state-title">No results found</p>
|
|
30
|
-
<p class="mw-empty-state-desc">
|
|
31
|
-
Try adjusting your search or filter to find what you're looking for.
|
|
32
|
-
</p>
|
|
33
|
-
<button class="mw-btn mw-btn-outline">Clear Filters</button>
|
|
34
|
-
</div>
|
|
35
|
-
</div>
|
|
36
|
-
</div>
|
|
37
|
-
|
|
38
|
-
<div>
|
|
39
|
-
<h3 class="mw-card-title mw-mb-4">More Variants</h3>
|
|
40
|
-
<div class="mw-card mw-card-simple">
|
|
41
|
-
<h4 class="mw-text-medium mw-mb-2">Success</h4>
|
|
42
|
-
<div class="mw-empty-state mw-empty-state-success mw-empty-state-sm">
|
|
43
|
-
<div class="mw-empty-state-icon">
|
|
44
|
-
<i class="fas fa-check-circle"></i>
|
|
45
|
-
</div>
|
|
46
|
-
<p class="mw-empty-state-title">All done!</p>
|
|
47
|
-
<p class="mw-empty-state-desc">
|
|
48
|
-
You've completed all your tasks. Enjoy the rest of the day.
|
|
49
|
-
</p>
|
|
50
|
-
</div>
|
|
51
|
-
</div>
|
|
52
|
-
|
|
53
|
-
<div class="mw-card mw-card-simple mw-mt-4">
|
|
54
|
-
<h4 class="mw-text-medium mw-mb-2">Primary (small)</h4>
|
|
55
|
-
<div class="mw-empty-state mw-empty-state-primary mw-empty-state-sm">
|
|
56
|
-
<div class="mw-empty-state-icon"><i class="fas fa-search"></i></div>
|
|
57
|
-
<p class="mw-empty-state-title">No items match</p>
|
|
58
|
-
<p class="mw-empty-state-desc">
|
|
59
|
-
We couldn't find anything matching your query.
|
|
60
|
-
</p>
|
|
61
|
-
<button class="mw-btn mw-btn-primary mw-btn-sm">Try Again</button>
|
|
62
|
-
</div>
|
|
63
|
-
</div>
|
|
64
|
-
|
|
65
|
-
<div class="mw-card mw-card-simple mw-mt-4">
|
|
66
|
-
<h4 class="mw-text-medium mw-mb-2">Danger</h4>
|
|
67
|
-
<div class="mw-empty-state mw-empty-state-danger mw-empty-state-sm">
|
|
68
|
-
<div class="mw-empty-state-icon">
|
|
69
|
-
<i class="fas fa-times-circle"></i>
|
|
70
|
-
</div>
|
|
71
|
-
<p class="mw-empty-state-title">Failed to load</p>
|
|
72
|
-
<p class="mw-empty-state-desc">
|
|
73
|
-
Something went wrong while fetching the data.
|
|
74
|
-
</p>
|
|
75
|
-
<button class="mw-btn mw-btn-sm mw-btn-outline">Retry</button>
|
|
76
|
-
</div>
|
|
77
|
-
</div>
|
|
78
|
-
</div>
|
|
79
|
-
</div>
|