@alpinejs/docs 3.6.1-revision.2 → 3.6.1-revision.3
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/package.json +1 -1
- package/src/en/plugins/portal.md +7 -7
package/package.json
CHANGED
package/src/en/plugins/portal.md
CHANGED
|
@@ -79,7 +79,7 @@ Here's a contrived modal example using portals:
|
|
|
79
79
|
<div x-data="{ open: false }">
|
|
80
80
|
<button @click="open = ! open">Toggle Modal</button>
|
|
81
81
|
|
|
82
|
-
<template x-portal="
|
|
82
|
+
<template x-portal="modals1">
|
|
83
83
|
<div x-show="open">
|
|
84
84
|
Modal contents...
|
|
85
85
|
</div>
|
|
@@ -88,7 +88,7 @@ Here's a contrived modal example using portals:
|
|
|
88
88
|
<div class="py-4">Some other content...</div>
|
|
89
89
|
</div>
|
|
90
90
|
|
|
91
|
-
<template x-portal-target="
|
|
91
|
+
<template x-portal-target="modals1"></template>
|
|
92
92
|
</div>
|
|
93
93
|
<!-- END_VERBATIM -->
|
|
94
94
|
|
|
@@ -123,7 +123,7 @@ To make this experience more seemless, you can "forward" events by simply regist
|
|
|
123
123
|
<div x-data="{ open: false }">
|
|
124
124
|
<button @click="open = ! open">Toggle Modal</button>
|
|
125
125
|
|
|
126
|
-
<template x-portal="
|
|
126
|
+
<template x-portal="modals2" @click="open = false">
|
|
127
127
|
<div x-show="open">
|
|
128
128
|
Modal contents...<br>
|
|
129
129
|
(click to close)
|
|
@@ -131,7 +131,7 @@ To make this experience more seemless, you can "forward" events by simply regist
|
|
|
131
131
|
</template>
|
|
132
132
|
</div>
|
|
133
133
|
|
|
134
|
-
<template x-portal-target="
|
|
134
|
+
<template x-portal-target="modals2"></template>
|
|
135
135
|
</div>
|
|
136
136
|
<!-- END_VERBATIM -->
|
|
137
137
|
|
|
@@ -173,14 +173,14 @@ Portals are especially helpful if you are trying to nest one modal within anothe
|
|
|
173
173
|
<div x-data="{ open: false }">
|
|
174
174
|
<button @click="open = ! open">Toggle Modal</button>
|
|
175
175
|
|
|
176
|
-
<template x-portal="
|
|
176
|
+
<template x-portal="modals3">
|
|
177
177
|
<div x-show="open">
|
|
178
178
|
<div class="py-4">Modal contents...</div>
|
|
179
179
|
|
|
180
180
|
<div x-data="{ open: false }">
|
|
181
181
|
<button @click="open = ! open">Toggle Nested Modal</button>
|
|
182
182
|
|
|
183
|
-
<template x-portal="
|
|
183
|
+
<template x-portal="modals3">
|
|
184
184
|
<div class="pt-4" x-show="open">
|
|
185
185
|
Nested modal contents...
|
|
186
186
|
</div>
|
|
@@ -190,7 +190,7 @@ Portals are especially helpful if you are trying to nest one modal within anothe
|
|
|
190
190
|
</template>
|
|
191
191
|
</div>
|
|
192
192
|
|
|
193
|
-
<template x-portal-target="
|
|
193
|
+
<template x-portal-target="modals3"></template>
|
|
194
194
|
</div>
|
|
195
195
|
<!-- END_VERBATIM -->
|
|
196
196
|
|