Widget: DCTList: Difference between revisions

From LINKS Community Center
Jump to: navigation, search
Eschmidt (talk | contribs)
No edit summary
Marterer (talk | contribs)
No edit summary
 
(372 intermediate revisions by 3 users not shown)
Line 1: Line 1:
<noinclude>Development verstion of the DCT Homepage.<br><span style="color: red; font-weight: bold;">Not ready for production!</span></noinclude>
<noinclude>DCT list widget.<br><span style="color: red; font-weight: bold;">Currently in use &ndash; do not modify!</span></noinclude>
<includeonly><style>
        #hp-wrapper {
            --hp-border: 1px solid rgba(0, 0, 0, .5);
            font-family: 'Open Sans';
        }
        #hp-wrapper h1,  #hp-wrapper h2,  #hp-wrapper h3 {
            font-family: 'Raleway';
            font-weight: 300;
            letter-spacing: .06em;
        }
        #hp-heading {
            padding: 1em;
            margin-bottom: 4em;
            background:
                linear-gradient(125deg, #FFFFFF 0%, #222222 100%),
                linear-gradient(200deg, #d5dde3 0%, #d5dde3 50%, #acbac8 calc(50% + 1px), #acbac8 60%, #5d758c calc(60% + 1px), #5d758c 75%, #415262 calc(75% + 1px), #415262 100%),
                linear-gradient(113deg, #d5dde3 0%, #d5dde3 40%, #acbac8 calc(40% + 1px), #acbac8 50%, #5d758c calc(50% + 1px), #5d758c 70%, #415262 calc(70% + 1px), #415262 100%);
            /* background:
                linear-gradient(125deg, #FFFFFF 0%, #000000 100%),
                linear-gradient(200deg, #D0F2F2 0%, #D0F2F2 50%, #34B8B8 calc(50% + 1px), #34B8B8 60%, #166EA9 calc(60% + 1px), #166EA9 75%, #125887 calc(75% + 1px), #125887 100%),
                linear-gradient(113deg, #D0F2F2 0%, #D0F2F2 40%, #34B8B8 calc(40% + 1px), #34B8B8 50%, #166EA9 calc(50% + 1px), #166EA9 70%, #125887 calc(70% + 1px), #125887 100%); */
            background-blend-mode: overlay, overlay, normal;
            clip-path: inset(0 100% 100% 0);
            transition: all 500ms ease-in-out;
        }
        .loaded #hp-heading { clip-path: inset(0); }
        #hp-heading h1 { font-size: 3.4em; margin-bottom: .5em; color: var(--links-grey); }
        #hp-heading h1 span {
            display: block;
            white-space: nowrap;
            opacity: 0;
            transform: translateX(-1em);
            transition: all 500ms ease-in-out;
        }
        .loaded #hp-heading h1 span { opacity: .95; transform: translateX(0);}
        #hp-heading h1 span:nth-child(1) { font-weight: 800; letter-spacing: .06em; transition-delay: 300ms; }
        #hp-heading h1 span:nth-child(2) { font-weight: 500; transition-delay: 400ms; }
        #hp-heading h1 span:nth-child(3) { font-weight: 100; transition-delay: 500ms; }
        #hp-heading .hp-lead { font-size: 1.4em; font-weight: 300; margin-bottom: 2em; opacity: 0; transition: all 500ms ease-in-out 1000ms; }
        .loaded #hp-heading .hp-lead { opacity: .95; }
        .hp-button-wrapper { text-align: center; }
        .hp-large-button {
            display: inline-block;
            font-weight: 600;
            font-size: 1.3em;
            padding: .5em;
            border: var(--hp-border);
            opacity: 0;
            transition: all 500ms ease-in-out 1300ms;
            text-decoration: none;
            cursor: pointer;
        }
        .hp-large-button:hover { text-decoration: none; }
        .loaded .hp-large-button { opacity: 1; }
        .hp-search { margin-bottom: 4em; }
        .hp-areas { margin-bottom: 8em; }
        .hp-areas *, #hp-collections * { transition: all 400ms ease-in-out; }
        .hp-areas h2 { text-align: center; margin-bottom: 1.5em; }
        .hp-area { display: flex; flex-direction: column; align-items: center; margin-bottom: 2em; text-decoration: none; cursor: pointer; }
        .hp-area h3 { text-align: center; }
        .hp-area:hover { text-decoration: none; }
        .hp-area:hover h3 { font-weight: 700 !important; }
        .hp-area-icon { flex: 1 0; margin-right: 1em; user-select: none; }
        .hp-area-icon svg { width: 100px; height: 100px; }
        .hp-area-text { flex: 1 1 75%; }
        .hp-area-text p { font-size: 1.2em; margin: 0 0 0 .1em; }
        .hp-area-arrow { display: none; }
        .hp-compass {
            border-top: var(--hp-border);
            border-bottom: var(--hp-border);
            padding: 2em 1em;
            display: flex;
            justify-content: center;
        }
        #hp-resources, #hp-networks { padding: 2em 1em; }
        #hp-resources { border-top: var(--hp-border); }
        #hp-resources .hp-area, #hp-networks .hp-area { margin-bottom: 0 !important; }
        #hp-recent h3 { margin-bottom: 1em; }
        #forum-topics { padding: 2em 1em; }
        #hp-changes { border-top: var(--hp-border); padding: 2em 1em; }
        .blue * {
            color: var(--links-blue);
            border-color: var(--links-blue);
            fill: var(--links-blue);
        }
        .orange * {
            color: var(--links-orange);
            border-color: var(--links-orange);
            fill: var(--links-orange);
        }
        .grey * {
            color: var(--links-grey);
            border-color: var(--links-grey);
            fill: var(--links-grey);
        }
        .cyan * {
            color: var(--links-cyan);
            border-color: var(--links-cyan);
            fill: var(--links-cyan);
        }


        /* Quick fix for removed Compass. Delete when Compass is restored. */
<includeonly>
        #forum-topics { border-top: var(--hp-border); }
    <link href="/resources/assets/tabulator/dist/css/tabulator.min.css" rel="stylesheet">
    <script type="text/javascript" src="/resources/assets/tabulator/dist/js/tabulator.min.js"></script>


        @media screen and (min-width: 992px) {
    <!-- STYLES BEGIN -->
            #hp-heading { padding: 3em; margin-bottom: 8em; }
<link rel="stylesheet" href="https://assets.links.communitycenter.eu/v2/links/lib?q=dct_list.css">
            #hp-heading h1 { font-size: 5em; }
<!-- STYLES END -->
            #hp-heading .hp-lead { max-width: 50%; font-size: 2em; }
            .hp-button-wrapper { text-align: left; }
            .hp-large-button { font-size: 1.6em; }
            #hp-main { width: 75%; margin: auto; }
            .hp-search { margin-bottom: 8em; }
            .hp-area { flex-direction: row; }
            .hp-area h3 { text-align: left; }
            .hp-areas h2 { margin-bottom: 2em; }
            .hp-area-icon svg { width: 130px; height: 130px; }
            .hp-area-arrow { display: block; flex: 1 0; font-size: 3em; margin-left: 1em; user-select: none; }
            .hp-area:hover .hp-area-arrow { transform: translateX(1em); }
            .hp-compass { padding: 5em; }
            #hp-collections { border-top: var(--hp-border); }
            #hp-resources { border-top: 0 none; }
            #forum-topics, #hp-resources { padding: 4em 1em 4em 0; border-right: var(--hp-border); }
            #hp-changes, #hp-networks { padding: 4em 0 4em 1em; border-top: 0 none; }
            .hp-compass .hp-area-text h2 { font-size: 3em; }
            .hp-compass .hp-area-text p { font-size: 1.8em; font-weight: 300 !important; }
            .hp-compass svg { width: 200px; height: 200px; }


            /* Quick fix for removed Compass. Delete when Compass is restored. */
    <!-- SCRIPT BEGIN -->
            #hp-resources {border-right: 0 none; }
    <script type="text/javascript" src="https://assets.links.communitycenter.eu/v2/links/lib?q=dct_list.js"></script>
            #hp-changes { border-top: var(--hp-border); }
    <!-- SCRIPT END -->
        }
    </style>


     <script>
     <!-- Icon definitons -->
        function search(event) {
    <!--<img src="https://assets.links.communitycenter.eu/v2/links/lib?q=unknown.svg">-->
            event.preventDefault();
            const searchString = document.getElementById('hp-search-input').value;
            window.location.assign('/index.php?search=' + encodeURIComponent(searchString) + '&title=Special%3ASearch&profile=default&fulltext=1');
        }
    </script>


     <div id="hp-wrapper">
     <div id="dct-list-wrapper">
         <div id="hp-heading">
         <h1>
             <h1>
             <img src="https://assets.links.communitycenter.eu/v2/links/lib?q=1-dct_list.svg">
                <span>LINKS</span>
             <div>
                <span>Community</span>
                <div>Technologies</div>
                <span>Center</span>
                 <div style="font-size:small; letter-spacing:.03em; margin-left: .6em;">Social Media and Crowdsourcing Library</div>
             </h1>
            <p class="hp-lead">Strengthening links between technologies and&nbsp;society for&nbsp;European disaster resilience.</p>
            <div class="hp-button-wrapper">
                 <a class="hp-large-button" href="https://links.communitycenter.eu/index.php/Getting_started">Get Started</a>
             </div>
             </div>
        </h1>
        <div id="dct-intro">
            <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
                market. It gathers and structures information about existing technologies to provide an up-to-date overview and
                thus support the selection of suitable technologies.
            </p>
            <p>
                You can use the filters to identify relevant technologies according to your needs and then click on the
                name of the technology to get further information.
            </p>
         </div>
         </div>


         <div id="hp-main">
         <div id="filter-bar">
             <form class="hp-search" onsubmit="search(event)">
             <div style="display: flex; justify-content: space-between;">
                <input id="hp-search-input" class="form-control form-control-lg" type="text" placeholder="Search" aria-label="Search">
                <div style="flex: 1 1;">
             </form>
                    <h2 style="margin-bottom: 1rem;">Selected Filters</h2>
                    <div id="filter-summary">No filter. Showing all results.</div>
                </div>
                <div>
                    <button class="large-button open-filters" type="button" onclick="toggleFilter()">Open Filters</button>
                </div>
             </div>


             <div class="hp-areas">
             <div style="display: flex; justify-content: space-between; align-items: center; margin-top: 2.5rem;">
                 <h2>
                 <h2 style="margin-bottom: 0;">Results: <span id="result-count"></span></h2>
                     Social Media and Crowdsourcing Libraries
                <div><a href="/index.php/Form:Disaster_Community_Technology" style="color: var(--links-blue); font-size: 1.5em; font-variant:small-caps">Add new technology</a></div>
            </div>
 
            <div id="dct-filters">
 
                <h2 style="display: flex; justify-content: space-between;">
                    <div>
                        <img src="https://www.safetyinnovation.center/lcc/dct_list/img/filters.svg">
                        <span>Filters</span>
                    </div>
                     <a onclick="toggleFilter()" id="close-filter-button">&times;</a>
                 </h2>
                 </h2>
                <a class="hp-area blue" href="https://links.communitycenter.eu/index.php/List_of_Disaster_Community_Technologies">
                    <div class="hp-area-icon">
                        <svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" overflow="hidden" viewBox="0 0 96 96"><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 class="hp-area-text">
                        <h3>Technologies</h3>
                        <p>
                            Software for&nbsp;interaction with, within or&nbsp;among communities in&nbsp;case of a&nbsp;disaster and for&nbsp;analysis of&nbsp;these interactions.​
                        </p>
                    </div>
                    <div class="hp-area-arrow">&rarr;</div>
                </a>


                 <a class="hp-area orange" href="https://links.communitycenter.eu/index.php/List_of_Guidelines">
                 <div style="text-align: center;">
                     <div class="hp-area-icon">
                     <button class="large-button" type="button" onclick="clearFilters()">Clear Filters</button>
                        <svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" overflow="hidden" viewBox="0 0 96 96"><defs><clipPath id="b"><path d="M65 455h96v96H65z"/></clipPath></defs><g clip-path="url(#b)" transform="translate(-65 -455)"><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"/><path d="M104 489h28v2h-28ZM110 500h16v2h-16Z"/></g></svg>
                </div>
 
                <div class="filter-wrapper">
                    <h4 class="filter-toggle">Functions <div class="plus icon"></div>
                    </h4>
                    <div class="filter-container">
                        <div class="filter-button-wrapper">
                            <button type="button" onclick="selectAll('#functions-filter')">Select all</button> |
                            <button type="button" onclick="deselectAll('#functions-filter')">Clear all</button>
                        </div>
                        <div class="filter-content loose" id="functions-filter"></div>
                     </div>
                     </div>
                    <div class="hp-area-text">
                 </div>
                        <h3>Guidelines</h3>
                        <p>
                            Expert guidelines for&nbsp;usage of&nbsp;social media and&nbsp;crowdsourcing in&nbsp;disasters.​
                        </p>
                    </div>
                    <div class="hp-area-arrow">&rarr;</div>
                 </a>
            </div>
        </div>


        <div id="hp-collections" class="container-fluid">
                <div class="filter-wrapper">
            <div class="row">
                    <h4 class="filter-toggle">Supported Platforms <div class="plus icon"></div>
                <div id="hp-resources" class="col-12 col-lg-6">
                    </h4>
                     <a class="hp-area grey" href="https://links.communitycenter.eu/index.php/Helpful_resources">
                     <div class="filter-container">
                         <div class="hp-area-icon">
                         <div class="filter-button-wrapper">
                             <svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" overflow="hidden" viewBox="0 0 96 96"><defs><clipPath id="res"><path d="M592 312h96v96h-96z"/></clipPath></defs><g clip-path="url(#res)" transform="translate(-592 -312)"><path d="m675 366-10-10h-24v-35a1 1 0 0 0-2 0v11h-24l-10 10 10 10h24v48h2v-24h24Zm-59.172-16-8-8 8-8H639v16ZM641 374v-16h23.172l8 8-8 8Z"/></g></svg>
                             <button type="button" onclick="selectAll('#data-source-filter')">Select all</button> |
                            <button type="button" onclick="deselectAll('#data-source-filter')">Clear all</button>
                         </div>
                         </div>
                         <div class="hp-area-text">
                         <div class="filter-content loose" id="data-source-filter"></div>
                            <h3>Collection of Helpful Resources</h3>
                     </div>
                            <p>
                                Browse some interesting or&nbsp;relevant websites and&nbsp;apps.​
                            </p>
                        </div>
                     </a>
                 </div>
                 </div>
                 <div id="hp-networks" class="col-12 col-lg-6">
 
                     <a class="hp-area grey" href="https://links.communitycenter.eu/index.php/Overview_of_Networks">
                 <div class="filter-wrapper">
                        <div class="hp-area-icon">
                     <h4 class="filter-toggle">Pricing <div class="plus icon"></div>
                            <svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" overflow="hidden" viewBox="0 0 96 96"><defs><clipPath id="net"><path d="M244 176h96v96h-96z"/></clipPath></defs><g clip-path="url(#net)" transform="translate(-244 -176)"><path d="M326.8 215c-.8 0-1.5.1-2.3.3l-2.2-6.7c6.1-3.2 8.5-10.7 5.3-16.8-3.2-6.1-10.7-8.5-16.8-5.3-3.3 1.7-5.7 4.9-6.5 8.5l-8.8-.8c-.1-4.6-3.8-8.2-8.4-8.1-4.6.1-8.2 3.8-8.1 8.4 0 1.7.6 3.3 1.5 4.7l-11 10.9c-5.2-4.5-13.1-4-17.6 1.2-4.5 5.2-4.1 13.1 1.1 17.6 2.3 2 5.2 3.1 8.2 3.1h.9l2.7 14.4c-4.4 1.3-6.8 5.9-5.5 10.3 1.3 4.4 5.9 6.8 10.3 5.5 4.4-1.3 6.8-5.9 5.5-10.3l-.6-1.5 8.9-4.5c4.9 6.7 14.3 8.1 20.9 3.2 5.1-3.8 7.3-10.3 5.5-16.4l9.7-5.3c2.3 3.9 7.3 5.3 11.3 3 3.9-2.3 5.3-7.3 3-11.3-1.4-2.5-4.1-4.1-7-4.1Zm-16.4-8.9c.3-3.3 3.3-5.8 6.6-5.5 2.9.3 5.2 2.6 5.5 5.5-3.6 2.5-8.4 2.5-12.1 0Zm3.3-10.3c0-1.5 1.2-2.8 2.8-2.8 1.6 0 2.8 1.2 2.8 2.8 0 1.5-1.2 2.8-2.8 2.8-1.5 0-2.8-1.3-2.8-2.8Zm2.8-8.8c5.8 0 10.5 4.7 10.5 10.5 0 2.6-1 5.1-2.7 7.1-.6-2.3-2.3-4.3-4.5-5.3 1.9-1.8 2-4.8.2-6.8-1.8-1.9-4.8-2-6.8-.2s-2 4.8-.2 6.8l.2.2c-2.2 1-3.9 2.9-4.5 5.3-3.9-4.3-3.6-10.9.7-14.8 2-1.8 4.5-2.8 7.1-2.8Zm-6.7 21.1-8.1 15.3c-7.1-3.3-15.4-.6-19.2 6.2l-9.7-5.3c1.8-4.3 1-9.2-1.9-12.8l11-11c3.4 3 8.6 2.6 11.6-.9.9-1 1.5-2.2 1.8-3.5l8.8.8v.6c-.1 4.3 2.1 8.3 5.7 10.6Zm-23.9-14.9c0-.8.6-1.4 1.4-1.4.8 0 1.4.6 1.4 1.4 0 .8-.6 1.4-1.4 1.4-.8-.1-1.4-.7-1.4-1.4Zm1.4 3.3c1.7 0 3.1 1.2 3.4 2.9-2.1 1.4-4.7 1.4-6.8 0 .2-1.6 1.6-2.8 3.4-2.9Zm0-8.5c3.4 0 6.2 2.8 6.3 6.2 0 1.3-.4 2.6-1.2 3.7-.5-1.1-1.3-2.1-2.4-2.7.5-.6.7-1.3.7-2.1 0-1.9-1.5-3.4-3.4-3.4s-3.4 1.5-3.4 3.4c0 .8.3 1.5.7 2.1-1.1.6-1.9 1.5-2.4 2.7-2-2.8-1.4-6.7 1.3-8.7 1.1-.8 2.4-1.2 3.8-1.2Zm-36.5 31.5c0-5.8 4.7-10.5 10.5-10.5s10.5 4.7 10.5 10.5c0 2.6-1 5.1-2.7 7.1-.6-2.3-2.3-4.3-4.5-5.3 1.9-1.8 2-4.8.2-6.8s-4.8-2-6.8-.2c-1.9 1.8-2 4.8-.2 6.8l.2.2c-2.2 1-3.9 2.9-4.5 5.3-1.8-2-2.7-4.5-2.7-7.1Zm7.7-1.7c0-1.5 1.2-2.8 2.8-2.8 1.6 0 2.8 1.2 2.8 2.8 0 1.5-1.2 2.8-2.8 2.8-1.6 0-2.8-1.3-2.8-2.8Zm-3.3 10.3c.3-3.3 3.3-5.8 6.6-5.5 2.9.3 5.2 2.6 5.5 5.5-3.6 2.5-8.5 2.5-12.1 0Zm8.6 31.4c.3-1.9 2-3.2 3.9-2.9 1.5.2 2.7 1.4 2.9 2.9-2 1.3-4.7 1.3-6.8 0Zm2.1-6.3c0-.8.6-1.4 1.4-1.4.8 0 1.4.6 1.4 1.4 0 .8-.6 1.4-1.4 1.4-.8-.1-1.4-.7-1.4-1.4Zm6.4 4.7c-.5-1.1-1.3-2.1-2.4-2.7.5-.6.7-1.3.7-2.1 0-1.9-1.5-3.4-3.4-3.4s-3.4 1.5-3.4 3.4c0 .8.3 1.5.7 2.1-1.1.6-1.9 1.5-2.4 2.7-2-2.8-1.4-6.7 1.4-8.7 2.8-2 6.7-1.4 8.7 1.4 1.7 2.1 1.7 5.1.1 7.3Zm1-9.2c-1.5-1.7-3.7-2.7-6-2.7h-.4l-2.7-14.4c3.2-.8 6-2.8 7.7-5.6l9.7 5.3c-1.7 4.2-1.4 8.9.7 12.8l-9 4.6Zm14.6-1.2c.3-4.2 4-7.3 8.2-7 3.7.3 6.7 3.3 7 7-4.5 3.3-10.7 3.3-15.2 0Zm4-12.6c0-2 1.6-3.6 3.6-3.6s3.6 1.6 3.6 3.6-1.6 3.6-3.6 3.6-3.6-1.6-3.6-3.6Zm13 11.1c-.7-3.1-2.9-5.6-5.8-6.8 2.4-2 2.7-5.5.7-7.9-2-2.4-5.5-2.7-7.9-.7-2.4 2-2.7 5.5-.7 7.9.2.3.5.5.7.7-2.9 1.2-5.1 3.7-5.8 6.8-5-5.2-4.8-13.4.4-18.4 5.2-5 13.4-4.8 18.4.4 4.8 5 4.8 13 0 18Zm4.2-15.2c-1.2-2.7-3.2-4.9-5.6-6.5l8.1-15.3c2.8 1.2 5.9 1.3 8.8.4l2.2 6.7c-3.3 1.9-4.9 5.8-3.8 9.4l-9.7 5.3Zm14.2-2.3c.3-1.9 2-3.2 3.9-2.9 1.5.2 2.7 1.4 2.9 2.9-2 1.3-4.7 1.3-6.8 0Zm2.1-6.3c0-.8.6-1.4 1.4-1.4.8 0 1.4.6 1.4 1.4 0 .8-.6 1.4-1.4 1.4-.8-.1-1.4-.7-1.4-1.4Zm6.4 4.7c-.5-1.1-1.3-2.1-2.4-2.7.5-.6.7-1.3.7-2.1 0-1.9-1.5-3.4-3.4-3.4s-3.4 1.5-3.4 3.4c0 .8.3 1.5.7 2.1-1.1.6-1.9 1.5-2.4 2.7-2-2.8-1.4-6.7 1.4-8.7 2.8-2 6.7-1.4 8.7 1.4 1.7 2.1 1.7 5.1.1 7.3Z"/></g></svg>
                    </h4>
                    <div class="filter-container">
                        <div class="filter-button-wrapper">
                            <button type="button" onclick="selectAll('#business-model-filter')">Select all</button> |
                            <button type="button" onclick="deselectAll('#business-model-filter')">Clear all</button>
                         </div>
                         </div>
                         <div class="hp-area-text">
                         <div class="filter-content" id="business-model-filter"></div>
                            <h3>Collection of Networks</h3>
                     </div>
                            <p>
                                Communities and&nbsp;interest groups relevant for&nbsp;the context of&nbsp;social media in&nbsp;disaster management.​
                            </p>
                        </div>
                     </a>
                 </div>
                 </div>
            </div>
        </div>


                <!-- <div class="filter-wrapper">
                    <h4 class="filter-toggle">Used by Practitioners <div class="plus icon"></div>
                    </h4>
                    <div class="filter-container">
                        <div class="filter-button-wrapper">
                            <button type="button" onclick="selectAll('#dm-use-filter')">Select all</button> |
                            <button type="button" onclick="deselectAll('#dm-use-filter')">Clear all</button>
                        </div>
                        <div class="filter-content" id="dm-use-filter"></div>
                    </div>
                </div> -->


        <!--kie: comment out until it is available.-->
                <div id="bool-filters"
        <!-- <div class="hp-compass cyan">
                    style="border-top: 1px solid var(--links-blue); margin-top: 1em; padding-top: 1em;">
            <div class="d-flex align-items-center">
                    <div>
                <div class="hp-area-icon">
                        <input type="checkbox" id="used-by-practitioners" value="yes">
                    <svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" overflow="hidden" viewBox="0 0 96 96"><defs><clipPath id="c"><path d="M199 603h96v96h-96z"/></clipPath></defs><g clip-path="url(#c)" transform="translate(-199 -603)"><path d="m277.516 645.583 2.136.654c-2.126-14.416-13.438-25.741-27.852-27.884l.691 2.143a31.072 31.072 0 0 1 25.025 25.087ZM214.36 646.146l2.14-.646a31.07 31.07 0 0 1 25.02-25l.655-2.139c-14.368 2.147-25.652 13.42-27.815 27.785ZM241.386 681.481a31.073 31.073 0 0 1-24.87-24.881l-2.151-.7a33.075 33.075 0 0 0 27.679 27.727ZM279.654 655.746l-2.141.691a31.072 31.072 0 0 1-25.032 25.068l-.691 2.143c14.424-2.14 25.744-13.475 27.864-27.902Z"/><path d="m274.8 647.888-15.134-4.924 4.837-9.38-9.431 4.806-4.872-15.208-2-6.2-1.2-3.9-1.3 4-1.9 6.2-4.784 15.134-9.416-4.832 4.82 9.429-15.12 4.776-6.3 1.9-4 1.3 4 1.3 6.1 2 15.248 4.8-4.848 9.405 9.386-4.947L243.7 678.8l1.9 6.2 1.3 4 1.3-4 2-6.2 4.9-15.3 9.4 4.9-4.828-9.351 15.028-4.859 6.2-2 4-1.3-3.9-1.1Zm-.714 4.4-15.341 4.954-2.01-3.893a9.925 9.925 0 0 1-.951 2.519l4.045 7.832-7.723-4.027a9.93 9.93 0 0 1-2.361 1.027l3.555 1.854-5 15.629-1.382 4.283-1.308-4.271-4.925-15.595 3.594-1.894a9.95 9.95 0 0 1-2.36-1.017l-7.73 4.074 4.051-7.863a9.91 9.91 0 0 1-.959-2.505l-2 3.885-15.557-4.89-4.194-1.375 4.37-1.315 15.441-4.877 1.967 3.847a9.938 9.938 0 0 1 .981-2.475l-4.088-8 8.016 4.113a9.958 9.958 0 0 1 2.523-.953l-3.92-2.013 4.894-15.474 1.27-4.148 1.316 4.072 4.966 15.518-4.011 2.044a9.922 9.922 0 0 1 2.53.955l8.1-4.125-4.147 8.043c.433.78.76 1.614.971 2.481l2.033-3.943 15.475 5.035 3.883 1.192Z"/><path d="M247 644.088a7 7 0 1 0 7 7 7.009 7.009 0 0 0-7-7Zm0 12a5 5 0 1 1 5-5 5.007 5.007 0 0 1-5 5.003Z"/></g></svg>
                        <label for="used-by-practitioners">Used by practitioners</label>
                </div>
                    </div>
                <div class="hp-area-text">
                    <div>
                    <h2>Want to be guided?</h2>
                        <input type="checkbox" id="has-use-case" value="yes">
                    <p>
                        <label for="has-use-case">Use case available</label>
                        Try the compass!
                    </div>
                     </p>
                    <div>
                        <input type="checkbox" id="show-archived" value="yes">
                        <label for="show-archived">Show archived</label>
                     </div>
                 </div>
                 </div>
             </div>
             </div>
         </div> -->
         </div>
        <div id="dct-tabulator"></div>
    </div>


        <div id="hp-recent" class="container-fluid">
</includeonly>
            <div class="row">
                <div id="forum-topics" class="col-12 col-lg-6">
                    <h3 class="text-center">Latest Discussions</h3>
                    <script src="https://forum.links.communitycenter.eu/javascripts/embed-topics.js"></script>
                    <d-topics-list discourse-url="https://forum.links.communitycenter.eu" per-page="5" order="latest" sort-ascending="false" template="complete"></d-topics-list>
                </div>
                <div id="hp-changes" class="col-12 col-lg-6">
                    <h3 class="text-center">News and Activities</h3>
                    <div class="h-100">
                        <div id="recent-changes"></div>
                    </div>
                </div>
            </div>
        </div></div></includeonly>

Latest revision as of 09:46, 2 October 2024

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


Retrieved from "https://links.communitycenter.eu/index.php?title=Widget:DCTList&oldid=12799"