Widget: DCTList: Difference between revisions

From LINKS Community Center
Jump to: navigation, search
Marterer (talk | contribs)
No edit summary
Marterer (talk | contribs)
No edit summary
 
(5 intermediate revisions by the same user not shown)
Line 6: Line 6:


     <!-- STYLES BEGIN -->
     <!-- STYLES BEGIN -->
<link rel="stylesheet" href="https://www.safetyinnovation.center/lcc/dct_list/styles.css">
<link rel="stylesheet" href="https://assets.links.communitycenter.eu/v2/links/lib?q=dct_list.css">
<!-- STYLES END -->
<!-- STYLES END -->


     <!-- SCRIPT BEGIN -->
     <!-- SCRIPT BEGIN -->
     <script type="text/javascript" src="https://www.safetyinnovation.center/lcc/dct_list/script.js"></script>
     <script type="text/javascript" src="https://assets.links.communitycenter.eu/v2/links/lib?q=dct_list.js"></script>
     <!-- SCRIPT END -->
     <!-- SCRIPT END -->


     <!-- Icon definitons -->
     <!-- Icon definitons -->
     <svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" overflow="hidden" style="display:none;">
     <!--<img src="https://assets.links.communitycenter.eu/v2/links/lib?q=unknown.svg">-->
        <defs>
            <symbol id="chevron-down" viewBox="0 0 96 96">
                <clipPath id="chev">
                    <path d="M592 312h96v96h-96z" />
                </clipPath>
                <g clip-path="url(#chev)" transform="translate(-592 -312)">
                    <path
                        d="m640 370.586-25.293-25.293-1.414 1.414L640 373.414l26.707-26.707-1.414-1.414L640 370.586Z" />
                </g>
            </symbol>
        </defs>
    </svg>


     <div id="dct-list-wrapper">
     <div id="dct-list-wrapper">
         <h1>
         <h1>
             <svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" overflow="hidden" viewBox="0 0 96 96">
             <img src="https://assets.links.communitycenter.eu/v2/links/lib?q=1-dct_list.svg">
                <defs>
                    <clipPath id="a">
                        <path d="M65 334h96v96H65z" />
                    </clipPath>
                </defs>
                <g clip-path="url(#a)" transform="translate(-65 -334)">
                    <path d="m142 395.981.004-35.993H84.001v36.01Zm-55.999-33.993h54.003L140 393.981l-53.999.017Z" />
                    <path
                        d="M81.001 358.987a2.002 2.002 0 0 1 2-2h60.003a2.002 2.002 0 0 1 2 2V400h2v-41.013a4.003 4.003 0 0 0-4-4H83.001a4.003 4.003 0 0 0-4 4V400h2ZM118.003 402.981v2h-10.001v-2H67v1.999a5.006 5.006 0 0 0 5 5.001h82.004a5.006 5.006 0 0 0 5.001-5.001v-1.999Zm36.001 5H72a3.004 3.004 0 0 1-3-3h37.002a1.934 1.934 0 0 0 2 2h10.001a1.934 1.934 0 0 0 2-2h37.002a3.005 3.005 0 0 1-3.001 3Z" />
                    <path
                        d="M113 365c-7.18 0-13 5.82-13 13s5.82 13 13 13 13-5.82 13-13c-.008-7.176-5.824-12.992-13-13Zm10.949 12h-3.518a14.167 14.167 0 0 0-4.176-9.508 11.023 11.023 0 0 1 7.694 9.508ZM112 368.226V377h-4.426c.254-3.771 1.929-7.06 4.426-8.774ZM112 379v8.775c-2.494-1.717-4.17-5.017-4.425-8.775Zm2 8.774V379h4.425c-.255 3.754-1.932 7.056-4.425 8.774ZM114 377v-8.773c2.492 1.718 4.17 5.019 4.425 8.773Zm-4.273-9.502a14.124 14.124 0 0 0-4.158 9.502h-3.518a11.02 11.02 0 0 1 7.676-9.502ZM102.051 379h3.518a14.157 14.157 0 0 0 4.173 9.507 11.022 11.022 0 0 1-7.691-9.507Zm14.205 9.508a14.168 14.168 0 0 0 4.175-9.508h3.518a11.023 11.023 0 0 1-7.693 9.508Z" />
                </g>
            </svg>
             <div>
             <div>
                 <div>Technologies</div>
                 <div>Technologies</div>
                 <div style="font-size:small; letter-spacing:.03em; margin-left: .6em;">Social Media and Crowdsourcing
                 <div style="font-size:small; letter-spacing:.03em; margin-left: .6em;">Social Media and Crowdsourcing Library</div>
                    Library</div>
             </div>
             </div>
         </h1>
         </h1>
Line 53: Line 27:
             <p>The overall goal of the Social Media and Crowdsourcing (SMCS) Technologies Library is to face the growing
             <p>The overall goal of the Social Media and Crowdsourcing (SMCS) Technologies Library is to face the growing
                 heterogeneous use of technologies in disasters and the overwhelming number of technologies on the
                 heterogeneous use of technologies in disasters and the overwhelming number of technologies on the
                 market. It
                 market. It gathers and structures information about existing technologies to provide an up-to-date overview and
                gathers and structures information about existing technologies to provide an up-to-date overview and
                 thus support the selection of suitable technologies.
                 thus
                support the selection of suitable technologies.
             </p>
             </p>
             <p>
             <p>
                 You can use the filters to identify relevant technologies according to your needs and then click on the
                 You can use the filters to identify relevant technologies according to your needs and then click on the
                 name of
                 name of the technology to get further information.
                the technology to get further information.
             </p>
             </p>
         </div>
         </div>
Line 72: Line 43:
                 </div>
                 </div>
                 <div>
                 <div>
                     <button class="large-button open-filters" type="button" onclick="toggleFilter()">Open
                     <button class="large-button open-filters" type="button" onclick="toggleFilter()">Open Filters</button>
                        Filters</button>
                 </div>
                 </div>
             </div>
             </div>
Line 83: Line 53:


             <div id="dct-filters">
             <div id="dct-filters">
                 <h2 style="display: flex; justify-content: space-between;">
                 <h2 style="display: flex; justify-content: space-between;">
                     <div>
                     <div>
                         <svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" overflow="hidden"
                         <img src="https://www.safetyinnovation.center/lcc/dct_list/img/filters.svg">
                            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>
                         <span>Filters</span>
                     </div>
                     </div>
                     <a onclick="toggleFilter()" id="close-filter-button">&times;</a>
                     <a onclick="toggleFilter()" id="close-filter-button">&times;</a>
                 </h2>
                 </h2>
                 <div style="text-align: center;">
                 <div style="text-align: center;">
                     <button class="large-button" type="button" onclick="clearFilters()">Clear Filters</button>
                     <button class="large-button" type="button" onclick="clearFilters()">Clear Filters</button>
                 </div>
                 </div>
                 <div class="filter-wrapper">
                 <div class="filter-wrapper">
                     <h4 class="filter-toggle">Functions <div class="plus icon"></div>
                     <h4 class="filter-toggle">Functions <div class="plus icon"></div>
Line 115: Line 77:
                     </div>
                     </div>
                 </div>
                 </div>
                 <div class="filter-wrapper">
                 <div class="filter-wrapper">
                     <h4 class="filter-toggle">Supported Platforms <div class="plus icon"></div>
                     <h4 class="filter-toggle">Supported Platforms <div class="plus icon"></div>
Line 126: Line 89:
                     </div>
                     </div>
                 </div>
                 </div>
                 <div class="filter-wrapper">
                 <div class="filter-wrapper">
                     <h4 class="filter-toggle">Pricing <div class="plus icon"></div>
                     <h4 class="filter-toggle">Pricing <div class="plus icon"></div>
Line 137: Line 101:
                     </div>
                     </div>
                 </div>
                 </div>
                 <!-- <div class="filter-wrapper">
                 <!-- <div class="filter-wrapper">
                     <h4 class="filter-toggle">Used by Practitioners <div class="plus icon"></div>
                     <h4 class="filter-toggle">Used by Practitioners <div class="plus icon"></div>
Line 148: Line 113:
                     </div>
                     </div>
                 </div> -->
                 </div> -->
                 <div id="bool-filters"
                 <div id="bool-filters"
                     style="border-top: 1px solid var(--links-blue); margin-top: 1em; padding-top: 1em;">
                     style="border-top: 1px solid var(--links-blue); margin-top: 1em; padding-top: 1em;">
Line 163: Line 129:
                     </div>
                     </div>
                 </div>
                 </div>
             </div>
             </div>
         </div>
         </div>

Latest revision as of 09:46, 2 October 2024

DCT list widget.
Currently in use – do not modify!