Skip to content

Commit 382a62d

Browse files
osfameronRayOffiah
authored andcommitted
WIP add preview config, add test for extension
Test is failing due to ID being randomly auto-generated. Will see if that feature can be suppressed, as it's desirable for static site generator to be deterministic.
1 parent 197f8bf commit 382a62d

File tree

3 files changed

+247
-0
lines changed

3 files changed

+247
-0
lines changed
File renamed without changes.
Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
override:
2+
ui:
3+
bundle:
4+
url: https://github.com/couchbase/docs-ui/releases/download/adding-anywhere-footnote-11/ui-bundle.zip
Lines changed: 243 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,243 @@
1+
2+
<div class="page-heading-title">
3+
<h1 class="page">Anywhere Footnotes</h1>
4+
5+
<div class="labels">
6+
<ul></ul>
7+
</div>
8+
9+
10+
</div>
11+
<div class="contributor-list-box">
12+
<span class="last-commit-date" id="commitdate"> </span>
13+
<ul id="contributorList"></ul>
14+
<span id="otherContributor"> + </span>
15+
</div><div id="preamble">
16+
<div class="sectionbody">
17+
<div class="paragraph">
18+
<p>One of the AsciiDoc extension extras we run on the site is Anywhere footnotes.
19+
This extension allows you to add footnotes to the page,
20+
with the block of references appearing anywhere on the page.
21+
(Regular AsciiDoc footnotes always appear right at the bottom).</p>
22+
</div>
23+
<div class="paragraph">
24+
<p>This is very handy for pages where you have multiple tables appearing on the page, like this:</p>
25+
</div>
26+
<table class="tableblock frame-all grid-all stretch">
27+
<caption class="title">Table 1. Sample Table Title</caption>
28+
<colgroup>
29+
<col style="width: 20%;">
30+
<col style="width: 40%;">
31+
<col style="width: 40%;">
32+
</colgroup>
33+
<thead>
34+
<tr>
35+
<th class="tableblock halign-left valign-top">ID</th>
36+
<th class="tableblock halign-left valign-top">Name</th>
37+
<th class="tableblock halign-left valign-top">Description</th>
38+
</tr>
39+
</thead>
40+
<tbody>
41+
<tr>
42+
<td class="tableblock halign-left valign-top"><p class="tableblock">1</p></td>
43+
<td class="tableblock halign-left valign-top"><p class="tableblock">Product A<span class="anywhere-footnote-marker"><a id="first-block-EyEQeGCN-ref"></a><a href="#first-block-EyEQeGCN-block">[1]</a></span></p></td>
44+
<td class="tableblock halign-left valign-top"><p class="tableblock">High-quality widget with advanced features<span class="anywhere-footnote-marker"><a id="first-block-w81bvhl1-ref"></a><a href="#first-block-w81bvhl1-block">[2]</a></span></p></td>
45+
</tr>
46+
<tr>
47+
<td class="tableblock halign-left valign-top"><p class="tableblock">2</p></td>
48+
<td class="tableblock halign-left valign-top"><p class="tableblock">Product B</p></td>
49+
<td class="tableblock halign-left valign-top"><p class="tableblock">Budget-friendly solution for everyday use</p></td>
50+
</tr>
51+
<tr>
52+
<td class="tableblock halign-left valign-top"><p class="tableblock">3</p></td>
53+
<td class="tableblock halign-left valign-top"><p class="tableblock">Product C</p></td>
54+
<td class="tableblock halign-left valign-top"><p class="tableblock">Premium option with extended warranty</p></td>
55+
</tr>
56+
</tbody>
57+
</table>
58+
<table class="tableblock frame-all grid-all stretch">
59+
<caption class="title">Table 2. Quarterly Sales Report 2025</caption>
60+
<colgroup>
61+
<col style="width: 16.6666%;">
62+
<col style="width: 33.3333%;">
63+
<col style="width: 16.6666%;">
64+
<col style="width: 16.6666%;">
65+
<col style="width: 16.6669%;">
66+
</colgroup>
67+
<thead>
68+
<tr>
69+
<th class="tableblock halign-left valign-top">Quarter</th>
70+
<th class="tableblock halign-left valign-top">Product</th>
71+
<th class="tableblock halign-left valign-top">Units Sold</th>
72+
<th class="tableblock halign-left valign-top">Revenue ($)</th>
73+
<th class="tableblock halign-left valign-top">Profit Margin (%)</th>
74+
</tr>
75+
</thead>
76+
<tbody>
77+
<tr>
78+
<td class="tableblock halign-left valign-top"><p class="tableblock">Q1</p></td>
79+
<td class="tableblock halign-left valign-top"><p class="tableblock">Smartphone X<span class="anywhere-footnote-marker"><a id="second-block-8LiTnzaL-ref"></a><a href="#second-block-8LiTnzaL-block">[3]</a></span></p></td>
80+
<td class="tableblock halign-left valign-top"><p class="tableblock">5,420</p></td>
81+
<td class="tableblock halign-left valign-top"><p class="tableblock">$1,084,000</p></td>
82+
<td class="tableblock halign-left valign-top"><p class="tableblock">32.5</p></td>
83+
</tr>
84+
<tr>
85+
<td class="tableblock halign-left valign-top"><p class="tableblock">Q1</p></td>
86+
<td class="tableblock halign-left valign-top"><p class="tableblock">Laptop Pro</p></td>
87+
<td class="tableblock halign-left valign-top"><p class="tableblock">1,875</p></td>
88+
<td class="tableblock halign-left valign-top"><p class="tableblock">$2,250,000</p></td>
89+
<td class="tableblock halign-left valign-top"><p class="tableblock">28.7</p></td>
90+
</tr>
91+
<tr>
92+
<td class="tableblock halign-left valign-top"><p class="tableblock">Q1</p></td>
93+
<td class="tableblock halign-left valign-top"><p class="tableblock">Smart Watch</p></td>
94+
<td class="tableblock halign-left valign-top"><p class="tableblock">3,650</p></td>
95+
<td class="tableblock halign-left valign-top"><p class="tableblock">$729,000</p></td>
96+
<td class="tableblock halign-left valign-top"><p class="tableblock">41.2</p></td>
97+
</tr>
98+
<tr>
99+
<td class="tableblock halign-left valign-top"><p class="tableblock">Q2</p></td>
100+
<td class="tableblock halign-left valign-top"><p class="tableblock">Smartphone X</p></td>
101+
<td class="tableblock halign-left valign-top"><p class="tableblock">6,780</p></td>
102+
<td class="tableblock halign-left valign-top"><p class="tableblock">$1,356,000<span class="anywhere-footnote-marker"><a id="second-block-htOZG3NA-ref"></a><a href="#second-block-htOZG3NA-block">[4]</a></span></p></td>
103+
<td class="tableblock halign-left valign-top"><p class="tableblock">33.8</p></td>
104+
</tr>
105+
<tr>
106+
<td class="tableblock halign-left valign-top"><p class="tableblock">Q2</p></td>
107+
<td class="tableblock halign-left valign-top"><p class="tableblock">Laptop Pro</p></td>
108+
<td class="tableblock halign-left valign-top"><p class="tableblock">2,140</p></td>
109+
<td class="tableblock halign-left valign-top"><p class="tableblock">$2,568,000</p></td>
110+
<td class="tableblock halign-left valign-top"><p class="tableblock">29.4</p></td>
111+
</tr>
112+
<tr>
113+
<td class="tableblock halign-left valign-top"><p class="tableblock">Q2</p></td>
114+
<td class="tableblock halign-left valign-top"><p class="tableblock">Smart Watch</p></td>
115+
<td class="tableblock halign-left valign-top"><p class="tableblock">4,290</p></td>
116+
<td class="tableblock halign-left valign-top"><p class="tableblock">$858,000</p></td>
117+
<td class="tableblock halign-left valign-top"><p class="tableblock">42.1</p></td>
118+
</tr>
119+
<tr>
120+
<td class="tableblock halign-left valign-top"><p class="tableblock">Q3</p></td>
121+
<td class="tableblock halign-left valign-top"><p class="tableblock">Smartphone X</p></td>
122+
<td class="tableblock halign-left valign-top"><p class="tableblock">7,890</p></td>
123+
<td class="tableblock halign-left valign-top"><p class="tableblock">$1,578,000</p></td>
124+
<td class="tableblock halign-left valign-top"><p class="tableblock">34.2</p></td>
125+
</tr>
126+
<tr>
127+
<td class="tableblock halign-left valign-top"><p class="tableblock">Q3</p></td>
128+
<td class="tableblock halign-left valign-top"><p class="tableblock">Laptop Pro</p></td>
129+
<td class="tableblock halign-left valign-top"><p class="tableblock">2,560</p></td>
130+
<td class="tableblock halign-left valign-top"><p class="tableblock">$3,072,000</p></td>
131+
<td class="tableblock halign-left valign-top"><p class="tableblock">30.1</p></td>
132+
</tr>
133+
<tr>
134+
<td class="tableblock halign-left valign-top"><p class="tableblock">Q3</p></td>
135+
<td class="tableblock halign-left valign-top"><p class="tableblock">Smart Watch</p></td>
136+
<td class="tableblock halign-left valign-top"><p class="tableblock">5,130</p></td>
137+
<td class="tableblock halign-left valign-top"><p class="tableblock">$1,026,000</p></td>
138+
<td class="tableblock halign-left valign-top"><p class="tableblock">43.5</p></td>
139+
</tr>
140+
</tbody>
141+
</table>
142+
</div>
143+
</div>
144+
<div class="sect1">
145+
<h2 id="first-block-of-footnotes"><a class="anchor" href="#first-block-of-footnotes"></a>First block of footnotes</h2>
146+
<div class="sectionbody">
147+
<div class="paragraph">
148+
<p><span class="anywhere-footnote-block"></span></p><div class="paragraph anywhere-footnote-hr-divider">
149+
<p></p>
150+
</div>
151+
<div class="dlist anywhere-footnote-horizontal">
152+
<dl>
153+
<dt class="hdlist1"><a href="#first-block-EyEQeGCN-ref" class="anywhere-footnote-marker">[1]</a><a id="first-block-EyEQeGCN-block"></a></dt>
154+
<dd>
155+
<p>This is the first footnote</p>
156+
</dd>
157+
<dt class="hdlist1"><a href="#first-block-w81bvhl1-ref" class="anywhere-footnote-marker">[2]</a><a id="first-block-w81bvhl1-block"></a></dt>
158+
<dd>
159+
<p>This is the second</p>
160+
</dd>
161+
</dl>
162+
</div><p></p>
163+
</div>
164+
</div>
165+
</div>
166+
<div class="sect1">
167+
<h2 id="second-block-of-footnotes"><a class="anchor" href="#second-block-of-footnotes"></a>Second block of footnotes</h2>
168+
<div class="sectionbody">
169+
<div class="paragraph">
170+
<p><span class="anywhere-footnote-block"></span></p><div class="paragraph anywhere-footnote-hr-divider">
171+
<p></p>
172+
</div>
173+
<div class="dlist anywhere-footnote-horizontal">
174+
<dl>
175+
<dt class="hdlist1"><a href="#second-block-8LiTnzaL-ref" class="anywhere-footnote-marker">[3]</a><a id="second-block-8LiTnzaL-block"></a></dt>
176+
<dd>
177+
<p>This is for the second block.</p>
178+
</dd>
179+
<dt class="hdlist1"><a href="#second-block-htOZG3NA-ref" class="anywhere-footnote-marker">[4]</a><a id="second-block-htOZG3NA-block"></a></dt>
180+
<dd>
181+
<p>Pricey!</p>
182+
</dd>
183+
</dl>
184+
</div><p></p>
185+
</div>
186+
<table class="tableblock frame-all grid-all stretch">
187+
<caption class="title">Table 3. Sample Product Comparison</caption>
188+
<colgroup>
189+
<col style="width: 25%;">
190+
<col style="width: 25%;">
191+
<col style="width: 25%;">
192+
<col style="width: 25%;">
193+
</colgroup>
194+
<thead>
195+
<tr>
196+
<th class="tableblock halign-left valign-top">Product</th>
197+
<th class="tableblock halign-left valign-top">Price ($)</th>
198+
<th class="tableblock halign-left valign-top">Rating (1-5)</th>
199+
<th class="tableblock halign-left valign-top">Stock Status</th>
200+
</tr>
201+
</thead>
202+
<tbody>
203+
<tr>
204+
<td class="tableblock halign-left valign-top"><p class="tableblock">Premium Headphones<span class="anywhere-footnote-marker"><a id="mid-block-YQRi82Xu-ref"></a><a href="#mid-block-YQRi82Xu-block">[5]</a></span></p></td>
205+
<td class="tableblock halign-left valign-top"><p class="tableblock">249.99</p></td>
206+
<td class="tableblock halign-left valign-top"><p class="tableblock">4.7</p></td>
207+
<td class="tableblock halign-left valign-top"><p class="tableblock">In Stock</p></td>
208+
</tr>
209+
<tr>
210+
<td class="tableblock halign-left valign-top"><p class="tableblock">Wireless Speaker</p></td>
211+
<td class="tableblock halign-left valign-top"><p class="tableblock">129.95</p></td>
212+
<td class="tableblock halign-left valign-top"><p class="tableblock">4.2</p></td>
213+
<td class="tableblock halign-left valign-top"><p class="tableblock">Limited</p></td>
214+
</tr>
215+
<tr>
216+
<td class="tableblock halign-left valign-top" colspan="4"><p class="tableblock"><span class="anywhere-footnote-block">
217+
218+
219+
</span></p><div class="dlist anywhere-footnote-horizontal">
220+
<dl>
221+
<dt class="hdlist1"><a href="#mid-block-YQRi82Xu-ref" class="anywhere-footnote-marker">[5]</a><a id="mid-block-YQRi82Xu-block"></a></dt>
222+
<dd>
223+
<p>Special offer!</p>
224+
</dd>
225+
</dl>
226+
</div><p></p></td>
227+
</tr>
228+
<tr>
229+
<td class="tableblock halign-left valign-top"><p class="tableblock">Smart Watch</p></td>
230+
<td class="tableblock halign-left valign-top"><p class="tableblock">199.50</p></td>
231+
<td class="tableblock halign-left valign-top"><p class="tableblock">4.5</p></td>
232+
<td class="tableblock halign-left valign-top"><p class="tableblock">In Stock</p></td>
233+
</tr>
234+
<tr>
235+
<td class="tableblock halign-left valign-top"><p class="tableblock">Bluetooth Earbuds</p></td>
236+
<td class="tableblock halign-left valign-top"><p class="tableblock">89.99</p></td>
237+
<td class="tableblock halign-left valign-top"><p class="tableblock">4.0</p></td>
238+
<td class="tableblock halign-left valign-top"><p class="tableblock">Out of Stock</p></td>
239+
</tr>
240+
</tbody>
241+
</table>
242+
</div>
243+
</div>

0 commit comments

Comments
 (0)