comparison booket.html @ 24:6cf1ec2e8955

Use expanders for action forms
author Guido Berhoerster <guido+booket@berhoerster.name>
date Sun, 05 Oct 2014 20:25:51 +0200
parents 69552aee9993
children 8c2f3e72d514
comparison
equal deleted inserted replaced
23:69552aee9993 24:6cf1ec2e8955
97 <h3>Bookmarklet</h3> 97 <h3>Bookmarklet</h3>
98 <a title="Create Bookmark" id="bookmarklet-link">Create Bookmark</a> 98 <a title="Create Bookmark" id="bookmarklet-link">Create Bookmark</a>
99 </aside> 99 </aside>
100 100
101 <form id="load-form"> 101 <form id="load-form">
102 <fieldset> 102 <fieldset class="expander">
103 <legend>Load Bookmarks</legend> 103 <legend tabindex="0" class="expander-label">Load Bookmarks</legend>
104 <label accesskey="i" class="top-label">File <input type="file" 104 <label accesskey="i" class="top-label">File <input type="file"
105 accept="application/json" required="required" 105 accept="application/json" required="required"
106 name="file"></input></label> 106 name="file"></input></label>
107 <label><input type="checkbox" name="merge"></input> Merge with existing 107 <label><input type="checkbox" name="merge"></input> Merge with existing
108 bookmarks</label> 108 bookmarks</label>
109 <button type="submit" name="load-file" accesskey="l">Load</button> 109 <button type="submit" name="load-file" accesskey="l">Load</button>
110 </fieldset> 110 </fieldset>
111 </form> 111 </form>
112 112
113 <form id="save-form"> 113 <form id="save-form">
114 <fieldset> 114 <fieldset class="expander">
115 <legend>Save Bookmarks</legend> 115 <legend tabindex="0" class="expander-label">Save Bookmarks</legend>
116 <p class="unsaved-changes-message" hidden="hidden"><strong>There are 116 <p class="unsaved-changes-message" hidden="hidden"><strong>There are
117 unsaved changes to your bookmarks.</strong></p> 117 unsaved changes to your bookmarks.</strong></p>
118 <a href="#" id="save-link" hidden="hidden" 118 <a href="#" id="save-link" hidden="hidden"
119 download="bookmarks.json"></a> 119 download="bookmarks.json"></a>
120 <button type="submit" name="save-file" 120 <button type="submit" name="save-file"
121 accesskey="s">Save&#8230;</button> 121 accesskey="s">Save&#8230;</button>
122 </fieldset> 122 </fieldset>
123 </form> 123 </form>
124 124
125 <form id="import-form"> 125 <form id="import-form">
126 <fieldset> 126 <fieldset class="expander">
127 <legend>Import Bookmarks</legend> 127 <legend tabindex="0" class="expander-label">Import Bookmarks</legend>
128 <label accesskey="e" class="top-label">File <input type="file" 128 <label accesskey="e" class="top-label">File <input type="file"
129 accept="text/html" required="required" name="file"></input></label> 129 accept="text/html" required="required" name="file"></input></label>
130 <label><input type="checkbox" name="merge"></input> Merge with existing 130 <label><input type="checkbox" name="merge"></input> Merge with existing
131 bookmarks</label> 131 bookmarks</label>
132 <button type="submit" name="import-file" accesskey="m">Import</button> 132 <button type="submit" name="import-file" accesskey="m">Import</button>
133 </fieldset> 133 </fieldset>
134 </form> 134 </form>
135 135
136 <form id="export-form"> 136 <form id="export-form">
137 <fieldset> 137 <fieldset class="expander">
138 <legend>Export Bookmarks</legend> 138 <legend tabindex="0" class="expander-label">Export Bookmarks</legend>
139 <a href="#" id="export-link" hidden="hidden" 139 <a href="#" id="export-link" hidden="hidden"
140 download="bookmarks.html"></a> 140 download="bookmarks.html"></a>
141 <button type="submit" name="export-file" 141 <button type="submit" name="export-file"
142 accesskey="x">Export&#8230;</button> 142 accesskey="x">Export&#8230;</button>
143 </fieldset> 143 </fieldset>