Widget: DCTList: Difference between revisions

Revision as of 15:18, 6 September 2022

Development verstion of the DCT List.
Not ready for production!

@@ Line 533: / Line 533: @@
          </div>
          <div id="filter-bar">
-             <button class="large-button" type="button" onclick="">Filters</button>
+             <div style="display: flex; justify-content: space-between;">
-        </div>
+                 <span style="visibility: hidden;">Test</span>
-        <div id="dct-filters">
+                 <button class="large-button" type="button" onclick="">Filters</button>
-            <h2>
-                <svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" overflow="hidden" viewBox="0 0 96 96">
-                    <defs>
-                        <clipPath id="b">
-                            <path d="M592 312h96v96h-96z" />
-                        </clipPath>
-                    </defs>
-                    <g clip-path="url(#b)" transform="translate(-592 -312)">
-                        <path
-                            d="M636 356.012v38.011l8-8v-30.011L674 326h-68Zm6.588-1.412-.588.584v30.008l-4 4v-34.008l-.585-.586L610.828 328h58.348Z" />
-                    </g>
-                </svg>
-                 <span>Filters</span>
-            </h2>
-            <div style="text-align: center;">
-                 <button class="large-button" type="button" onclick="clearFilters()">Clear Filters</button>
              </div>
-             <div class="filter-wrapper">
-                 <h3>Functions</h3>
+             <div id="dct-filters">
-                <div class="filter-button-wrapper">
+                 <h2>
-                    <button type="button" onclick="selectAll('#functions-filter')">Select all</button> |
+                    <svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" overflow="hidden" viewBox="0 0 96 96">
-                     <button type="button" onclick="deselectAll('#functions-filter')">Deselect all</button>
+                        <defs>
+                            <clipPath id="b">
+                                <path d="M592 312h96v96h-96z" />
+                            </clipPath>
+                        </defs>
+                        <g clip-path="url(#b)" transform="translate(-592 -312)">
+                            <path
+                                d="M636 356.012v38.011l8-8v-30.011L674 326h-68Zm6.588-1.412-.588.584v30.008l-4 4v-34.008l-.585-.586L610.828 328h58.348Z" />
+                        </g>
+                    </svg>
+                    <span>Filters</span>
+                </h2>
+                <div style="text-align: center;">
+                     <button class="large-button" type="button" onclick="clearFilters()">Clear Filters</button>
                  </div>
-                 <div class="filter-content" id="functions-filter"></div>
+                 <div class="filter-wrapper">
-            </div>
+                    <h3>Functions</h3>
-            <div class="filter-wrapper">
+                    <div class="filter-button-wrapper">
-                <h3>Supported Platforms</h3>
+                        <button type="button" onclick="selectAll('#functions-filter')">Select all</button> |
-                <div class="filter-button-wrapper">
+                        <button type="button" onclick="deselectAll('#functions-filter')">Deselect all</button>
-                    <button type="button" onclick="selectAll('#data-source-filter')">Select all</button> |
+                    </div>
-                    <button type="button" onclick="deselectAll('#data-source-filter')">Deselect all</button>
+                    <div class="filter-content" id="functions-filter"></div>
+                </div>
+                <div class="filter-wrapper">
+                    <h3>Supported Platforms</h3>
+                    <div class="filter-button-wrapper">
+                        <button type="button" onclick="selectAll('#data-source-filter')">Select all</button> |
+                        <button type="button" onclick="deselectAll('#data-source-filter')">Deselect all</button>
+                    </div>
+                    <div class="filter-content" id="data-source-filter"></div>
                  </div>
-                <div class="filter-content" id="data-source-filter"></div>
              </div>
          </div>