Mercurial > projects > booket
comparison booket.html @ 23:69552aee9993
Use custom expander instead of details element
Use a custom expander instead of a details element which is not (yet)
universally supported.
author | Guido Berhoerster <guido+booket@berhoerster.name> |
---|---|
date | Sun, 05 Oct 2014 19:46:32 +0200 |
parents | b19db583b5f8 |
children | 6cf1ec2e8955 |
comparison
equal
deleted
inserted
replaced
22:b19db583b5f8 | 23:69552aee9993 |
---|---|
181 <li><button type="button" name="set-tag"></button><button | 181 <li><button type="button" name="set-tag"></button><button |
182 type="button" name="toggle-tag"></button></li> | 182 type="button" name="toggle-tag"></button></li> |
183 </template> | 183 </template> |
184 <template id="bookmark-template"> | 184 <template id="bookmark-template"> |
185 <li> | 185 <li> |
186 <details> | 186 <div class="expander"> |
187 <summary><p><img width="16" height="16" | 187 <div class="expander-label" tabindex="0"><p><img width="16" |
188 class="bookmark-favicon"></img> | 188 height="16" class="bookmark-favicon"></img> |
189 <a class="bookmark-link" target="_blank"></a> | 189 <a class="bookmark-link" target="_blank"></a> |
190 <span class="bookmark-hostname"></span> | 190 <span class="bookmark-hostname"></span> |
191 </p> | 191 </p> |
192 <ul class="tag-list"></ul></summary> | 192 <ul class="tag-list"></ul></div> |
193 <div class="bookmark-actions"> | 193 <div class="bookmark-actions"> |
194 <button type="button" name="edit-bookmark">Edit</button><button | 194 <button type="button" name="edit-bookmark">Edit</button><button |
195 type="button" name="delete-bookmark">Delete</button> | 195 type="button" name="delete-bookmark">Delete</button> |
196 </div> | 196 </div> |
197 <dl class="bookmark-metadata"> | 197 <dl class="bookmark-metadata"> |
200 <dt>Added</dt> | 200 <dt>Added</dt> |
201 <dd><time class="ctime"></time></dd> | 201 <dd><time class="ctime"></time></dd> |
202 <dt>Last modified</dt> | 202 <dt>Last modified</dt> |
203 <dd><time class="mtime"></time></dd> | 203 <dd><time class="mtime"></time></dd> |
204 </dl> | 204 </dl> |
205 </details> | 205 </div> |
206 </li> | 206 </li> |
207 </template> | 207 </template> |
208 </ul> | 208 </ul> |
209 </section> | 209 </section> |
210 </main> | 210 </main> |