Difference between revisions of "Widget:GuidelinesList"
From LINKS Community Center
| Line 815: | Line 815: | ||
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" overflow="hidden" viewBox="0 0 96 96"> | <svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" overflow="hidden" viewBox="0 0 96 96"> | ||
<defs> | <defs> | ||
| − | <clipPath id=" | + | <clipPath id="tit"> |
<path d="M65 455h96v96H65z" /> | <path d="M65 455h96v96H65z" /> | ||
</clipPath> | </clipPath> | ||
</defs> | </defs> | ||
| − | <g clip-path="url(# | + | <g clip-path="url(#tit)" transform="translate(-65 -455)"> |
<path | <path | ||
d="M138 463H84v79.961h54a5.014 5.014 0 0 0 5.019-5V468a5.014 5.014 0 0 0-5.019-5Zm-52 2h6.261v75.961H86Zm55.019 72.963a3.012 3.012 0 0 1-3.019 3H94.261V465H138a3.013 3.013 0 0 1 3.019 3Z" /> | d="M138 463H84v79.961h54a5.014 5.014 0 0 0 5.019-5V468a5.014 5.014 0 0 0-5.019-5Zm-52 2h6.261v75.961H86Zm55.019 72.963a3.012 3.012 0 0 1-3.019 3H94.261V465H138a3.013 3.013 0 0 1 3.019 3Z" /> | ||
| Line 844: | Line 844: | ||
</ul> | </ul> | ||
</div> | </div> | ||
| − | + | ||
| − | + | ||
| − | + | <!-- FILTERS --> | |
| − | + | <div id="filter-bar"> | |
| − | + | <div style="display: flex; justify-content: space-between;"> | |
| − | + | <div style="flex: 1 1;"> | |
| − | + | <h2 style="margin-bottom: 1rem;">Applied Filters</h2> | |
| − | + | <div id="filter-summary">No filter. Showing all results.</div> | |
| − | + | </div> | |
| + | <div style="flex: 0 0;"> | ||
| + | <button class="large-button" type="button" onclick="toggleFilter()">Filters</button> | ||
| + | </div> | ||
</div> | </div> | ||
| − | + | <h2 style="margin-top: 2.5rem; margin-bottom: 0;">Results: <span id="result-count"></span></h2> | |
| − | + | ||
| − | + | <div id="gl-filters"> | |
| − | + | <h2 style="display: flex; justify-content: space-between;"> | |
| − | + | <div> | |
| − | + | <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> | |
| − | + | </div> | |
| − | + | <a onclick="toggleFilter()" id="close-filter-button">×</a> | |
| − | + | </h2> | |
| − | + | <div style="text-align: center;"> | |
| + | <button class="large-button" type="button" onclick="clearFilters()">Clear Filters</button> | ||
</div> | </div> | ||
| − | + | <div class="filter-wrapper"> | |
| − | + | <h4>Covers Thematic <span class="filter-toggle"><svg> | |
| − | + | <use href="#chevron-down" /> | |
| − | + | </svg></span></h4> | |
| − | + | <div class="filter-container"> | |
| − | + | <div class="filter-button-wrapper"> | |
| − | + | <button type="button" onclick="selectAll('#thematic-filter')">Select all</button> | | |
| − | + | <button type="button" onclick="deselectAll('#thematic-filter')">Clear all</button> | |
| − | + | </div> | |
| − | + | <div class="filter-content" id="thematic-filter"></div> | |
| − | |||
| − | |||
| − | |||
</div> | </div> | ||
| − | |||
</div> | </div> | ||
| − | + | <div class="filter-wrapper"> | |
| − | + | <h4>Language<span class="filter-toggle"><svg> | |
| − | + | <use href="#chevron-down" /> | |
| − | + | </svg></span></h4> | |
| − | + | <div class="filter-container"> | |
| − | + | <div class="filter-button-wrapper"> | |
| − | + | <button type="button" onclick="selectAll('#language-filter')">Select all</button> | | |
| − | + | <button type="button" onclick="deselectAll('#language-filter')">Clear all</button> | |
| − | + | </div> | |
| + | <div class="filter-content" id="language-filter"></div> | ||
</div> | </div> | ||
| − | |||
</div> | </div> | ||
| − | + | <div class="filter-wrapper"> | |
| − | + | <h4>Disaster Management Phase<span class="filter-toggle"><svg> | |
| − | + | <use href="#chevron-down" /> | |
| − | + | </svg></span></h4> | |
| − | + | <div class="filter-container"> | |
| − | + | <div class="filter-button-wrapper"> | |
| − | + | <button type="button" onclick="selectAll('#phase-filter')">Select all</button> | | |
| − | + | <button type="button" onclick="deselectAll('#phase-filter')">Clear all</button> | |
| − | + | </div> | |
| + | <div class="filter-content" id="phase-filter"></div> | ||
</div> | </div> | ||
| − | |||
</div> | </div> | ||
| − | + | <div class="filter-wrapper"> | |
| − | + | <h4>Target Audience<span class="filter-toggle"><svg> | |
| − | + | <use href="#chevron-down" /> | |
| − | + | </svg></span></h4> | |
| − | + | <div class="filter-container"> | |
| − | + | <div class="filter-button-wrapper"> | |
| − | + | <button type="button" onclick="selectAll('#target-audience-filter')">Select all</button> | | |
| − | + | <button type="button" onclick="deselectAll('#target-audience-filter')">Clear all</button> | |
| − | + | </div> | |
| + | <div class="filter-content" id="target-audience-filter"></div> | ||
</div> | </div> | ||
| − | |||
</div> | </div> | ||
| − | + | <div class="filter-wrapper"> | |
| − | + | <h4>Audience Experience Level<span class="filter-toggle"><svg> | |
| − | + | <use href="#chevron-down" /> | |
| − | + | </svg></span></h4> | |
| − | + | <div class="filter-container"> | |
| − | + | <div class="filter-button-wrapper"> | |
| − | + | <button type="button" onclick="selectAll('#audience-experience-filter')">Select all</button> | | |
| − | + | <button type="button" onclick="deselectAll('#audience-experience-filter')">Clear all</button> | |
| − | + | </div> | |
| + | <div class="filter-content" id="audience-experience-filter"></div> | ||
</div> | </div> | ||
| − | |||
</div> | </div> | ||
| − | + | <div class="filter-wrapper"> | |
| − | + | <h4>Mentions Platforms <span class="filter-toggle"><svg> | |
| − | + | <use href="#chevron-down" /> | |
| − | + | </svg></span></h4> | |
| − | + | <div class="filter-container"> | |
| − | + | <div class="filter-button-wrapper"> | |
| − | + | <button type="button" onclick="selectAll('#data-source-filter')">Select all</button> | | |
| − | + | <button type="button" onclick="deselectAll('#data-source-filter')">Clear all</button> | |
| − | + | </div> | |
| + | <div class="filter-content" id="data-source-filter"></div> | ||
</div> | </div> | ||
| − | |||
</div> | </div> | ||
| − | + | <div class="filter-wrapper"> | |
| − | + | <h4>Mentions Techologies <span class="filter-toggle"><svg> | |
| − | + | <use href="#chevron-down" /> | |
| − | + | </svg></span></h4> | |
| − | + | <div class="filter-container"> | |
| − | + | <div class="filter-button-wrapper"> | |
| − | + | <button type="button" onclick="selectAll('#tech-filter')">Select all</button> | | |
| − | + | <button type="button" onclick="deselectAll('#tech-filter')">Clear all</button> | |
| − | + | </div> | |
| + | <div class="filter-content" id="tech-filter"></div> | ||
</div> | </div> | ||
| − | |||
</div> | </div> | ||
</div> | </div> | ||
</div> | </div> | ||
| + | |||
| + | <div id="guideline-tabulator"></div> | ||
</div> | </div> | ||
| − | |||
| − | |||
| − | |||
</includeonly> | </includeonly> | ||
Revision as of 12:14, 30 November 2022
Development version of the List of Guidelines.
Not ready for production!