Completely redo "Structure of HTML generated by widgets" section.
authorMike Taylor <mike@indexdata.com>
Mon, 10 Nov 2014 11:51:05 +0000 (11:51 +0000)
committerMike Taylor <mike@indexdata.com>
Mon, 10 Nov 2014 11:51:05 +0000 (11:51 +0000)
doc/mkws-manual.markdown

index 23d80c4..88738ab 100644 (file)
@@ -1195,76 +1195,73 @@ popup_autoOpen  bool    1                   Indictaes whether to pop up the wind
 Multiple `popup` widgets can co-exist on a page. In this case, different
 `popup_button` values must be used for each.
 
-The structure of the HTML generated by the MKWS widgets
--------------------------------------------------------
+Structure of HTML generated by widgets
+--------------------------------------
 
 In order to override the default CSS styles provided by the MasterKey Widget
-Set, it's necessary to understand that structure of the HTML elements that are
-generated within the widgets. This knowledge make it possible, for example,
-to style each `<div>` with class `term` but only when it occurs inside an
-element with class `mkws-facets`, so as to avoid inadvertently styling other
-elements using the same class in the non-MKWS parts of the page.
-
-The HTML structure is as follows. As in CSS, #ID indicates a unique identifier
-and .CLASS indicates an instance of a class.
-
-       #mkwsSwitch
-         a*
-
-       #mkwsLang
-         ( a | span )*
-
-       #mkwsSearch
-         form
-           input#mkwsQuery type=text
-           input#mkwsButton type=submit
-
-       #mkwsBlanket
-         (no contents -- used only for masking)
-
-       #mkwsResults
+Set, it's necessary to understand the structure of the HTML elements that are
+generated within the widgets. The HTML structure is as follows. As in CSS,
+_.class_ indicates an instance of a class. A trailing `*` indicates zero or
+more instances; a trailing `?` indicates zero or one instance.
+
+       .mkws-progress
+         span.mkws-done
+         span.mkws-waiting
+       
+       .mkws-search
+         form.mkws-search-form
+           input.mkws-query
+           input.mkws-button
+       
+       .mkws-results
          table
            tbody
              tr
-               td
-                 #mkwsTermlists
-                   div.title
-                   div.facet*
-                     div.termtitle
-                     ( a span br )*
-               td
-                 div#mkwsRanking
-                   form#mkwsSelect
-                     select#mkwsSort
-                     select#mkwsPerpage
-                 #mkwsPager
-                 #mkwsNavi
-                 #mkwsRecords
-                   div.record*
-                     span (for sequence number)
-                     a (for title)
-                     span (for other information such as author)
-                     div.details (sometimes)
+               td.mkws-facets-container-wide
+                 div.mkws-facets
+                   div.mkws-facet*
+                     div.mkws-facet-title
+                     div.mkws-term*
+                       a
+                       span
+               td.mkws-motd-container
+                 div.mkws-ranking
+                   form
+                     select.mkws-sort
+                       option*
+                     select.mkws-perpage
+                       option*
+                 div.mkws-pager
+                   div
+                   div
+                     span.mkws-prev
+                     span.mkws-current-page
+                     a*
+                     span.mkws-next
+                 div.mkws-navi
+                 div.mkws-records
+                   div.mkws-summary*
+                     div.mkws-field-data
+                       span.mkws-field-NAME*
+                     div.mkws-details?
                        table
                          tbody
                            tr*
                              th
                              td
-       #mkwsTargets
-         #mkwsBytarget
-           table
-             thead
-               tr*
-                 td*
-             tbody
-               tr*
-                 td*
-
-       #mkwsStat
-         span.head
-         span.clients
-         span.records
-
+             tr
+               td
+                 div.mkws-facets-container-narrow
+       
+       .mkws-targets
+         table
+           thead
+             tr
+               td*
+           tbody
+             tr*
+               td*
+       
 
 Appendix: compatibility roadmap
 ===============================