Index: /main/kofacustom.coewarri/trunk/layout/rules.xml
===================================================================
--- /main/kofacustom.coewarri/trunk/layout/rules.xml	(revision 14445)
+++ /main/kofacustom.coewarri/trunk/layout/rules.xml	(revision 14446)
@@ -102,4 +102,6 @@
           css:if-not-content="table.kofa-data-table" />
 
+    <drop css:theme="script.kofa-filterByText"
+          css:if-not-content="input.kofa-filterbox" />
 
 <!--
@@ -119,41 +121,4 @@
 -->
 
-    <!-- the language selector
-
-      quite tricky. We insert a <li> element at beginning of
-      ul.kofa-navbar-right. This <li> has a header element
-      (the 'Language' button) and the a number of <li> elements
-      representing the supported languages.
-      We change the input content of format
-
-         <a href="foo" title="Lang">Abbrev</a>
-
-      to
-
-         <a href="foo">Lang</a>
-
-      creating new nodes (<xsl:element>) with attributes copied over.
-    -->
-    <before css:theme-children="ul.kofa-navbar-right">
-      <li class="dropdown kofa-langselect">
-        <a href="#" class="dropdown-toggle"
-           data-toggle="dropdown">
-           <img src="/static/img/earth.png" />
-        </a>
-        <ul class="dropdown-menu">
-          <xsl:for-each css:select=" .language a">
-            <li class="kofa-language">
-              <xsl:element name="a">
-                <xsl:attribute name="href">
-                  <xsl:value-of select="@href" />
-                </xsl:attribute>
-                <xsl:value-of select="@title" />
-              </xsl:element>
-            </li>
-          </xsl:for-each>
-        </ul>
-      </li>
-    </before>
-
     <!-- Make all data tables responsive -->
 
Index: /main/kofacustom.coewarri/trunk/layout/theme.html
===================================================================
--- /main/kofacustom.coewarri/trunk/layout/theme.html	(revision 14445)
+++ /main/kofacustom.coewarri/trunk/layout/theme.html	(revision 14446)
@@ -318,4 +318,18 @@
                 </div>
 
+                <br><br>
+
+                <h3>Filtered Select Box</h3>
+                <br>
+                <input id="filterbox" class="kofa-filterbox form-control half"
+                       placeholder="Enter search text, then select item below."
+                       type="text" />
+                <br />
+                <select id="filteredselect" class="form-control half" size=2>
+                  <option value="1">1</option>
+                  <option value="1234567890">1234567890</option>
+                  <option value="better">better</option>
+                  <option value="world">world</option>
+                </select>
 
               </div><!-- /tab-content -->
@@ -345,4 +359,30 @@
             </div>
             <div>...content that spans the whole page.</div>
+
+            <br><br>
+            <h3>Accordions</h3>
+            <div class="panel-group" id="accordion" role="tablist"
+                 aria-multiselectable="true">
+              <div class="panel panel-default">
+                <div class="panel-heading" role="tab" id="headingTwo">
+                  <h4 class="panel-title">
+                    <a class="collapsed" data-toggle="collapse"
+                       data-parent="#accordion" href="#collapseTwo"
+                       aria-expanded="false" aria-controls="collapseTwo">
+                      Collapsible Group
+                    </a>
+                  </h4>
+                </div>
+                <div id="collapseTwo" class="panel-collapse collapse"
+                     role="tabpanel" aria-labelledby="headingTwo">
+                  <div class="panel-body">
+                    Anim pariatur cliche reprehenderit, enim eiusmod high life
+                    terry richardson ad squid. 3 wolf moon officia aute, non
+                    skateboard dolor brunch. Food truck quinoa laborum eiusmod.
+                  </div>
+                </div>
+              </div>
+            </div>
+
             <br><br>
             <h3>A Sample Data Table</h3>
@@ -528,4 +568,10 @@
               </tbody>
             </table>
+            <br>
+            <div class="documentation">
+              <a href="#" target="_blank">
+                Kofa Docs for this page
+              </a>
+            </div>
           </div> <!-- /well kofa-content-->
         </div> <!-- /kofa-content-wide -->
@@ -563,4 +609,7 @@
         src="static/js/kofa-datepicker.js">
     </script>
+    <script class="kofa-filterByText"
+        src="static/js/kofa-filterByText.js">
+    </script>
   </body>
 </html>
