Widget: HomePageOld: Difference between revisions

From LINKS Community Center
Jump to: navigation, search
Eschmidt (talk | contribs)
No edit summary
Marterer (talk | contribs)
No edit summary
 
(74 intermediate revisions by 5 users not shown)
Line 1: Line 1:
<p class="display-3">LINKS Community Center</p>
<noinclude>Second version of the LINKS Community Center homepage.<br><strong style="color: red;">Do not modify!</strong></noinclude>
<p class="lead">Strengthening links between technologies and&nbsp;society for&nbsp;European disaster resilience.</p>
<includeonly>


<div class="container-fluid my-5">
<!-- STYLES BEGIN -->
  <div class="row">
<link rel="stylesheet" href="https://assets.links.communitycenter.eu/v2/links/homepage/styles_v2.css">
    <div class="col p-0">
<!-- STYLES END -->
      <a class="links-tile">
 
         <svg width="60" height="60" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" overflow="hidden"><defs><clipPath id="clip0"><rect x="548" y="548" width="59" height="59"/></clipPath></defs><g clip-path="url(#clip0)" transform="translate(-548 -548)"><path d="M594.708 584.875 560.292 584.875 560.292 563.979 594.708 563.979 594.708 584.875ZM598.396 562.75C598.396 561.398 597.29 560.292 595.938 560.292L559.062 560.292C557.71 560.292 556.604 561.398 556.604 562.75L556.604 588.562 598.396 588.562 598.396 562.75Z" fill="#F2F2F2"/><path d="M581.188 591.021 581.188 591.635C581.188 592.004 580.942 592.25 580.573 592.25L574.427 592.25C574.058 592.25 573.812 592.004 573.812 591.635L573.812 591.021 549.229 591.021 549.229 592.25C549.229 593.602 550.335 594.708 551.688 594.708L603.312 594.708C604.665 594.708 605.771 593.602 605.771 592.25L605.771 591.021 581.188 591.021Z" fill="#F2F2F2"/></g></svg>
    <!-- HP BEGIN -->
        <div class="links-tile-title">Disaster Community Technologies</div>
    <div id="hp-wrapper">
      </a>
 
    </div>
         <!-- HEADING BEGIN -->
    <div class="col p-0 mx-2">
        <div id="hp-heading">
      <a class="links-tile">
            <h1 translate="no">
        <svg width="60" height="60" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" overflow="hidden"><defs><clipPath id="clip1"><rect x="552" y="416" width="51" height="51"/></clipPath></defs><g clip-path="url(#clip1)" transform="translate(-552 -416)"><path d="M576.438 423.438 578.562 423.438 578.562 429.812 576.438 429.812Z" fill="#F2F2F2"/><path d="M593.389 427.14 589.144 431.385 587.642 429.882 591.887 425.638Z" fill="#F2F2F2"/><path d="M567.331 429.856 565.829 431.358 561.584 427.113 563.087 425.611Z" fill="#F2F2F2"/><path d="M590.25 438.312 595.562 438.312 595.562 440.438 590.25 440.438Z" fill="#F2F2F2"/><path d="M559.438 438.312 564.75 438.312 564.75 440.438 559.438 440.438Z" fill="#F2F2F2"/><path d="M569 453.188 570.806 435.125 584.141 435.125 586 453.188 569 453.188ZM592.375 453.188 589.188 453.188 587.275 433.85C587.169 432.788 586.266 431.938 585.15 431.938L569.85 431.938C568.734 431.938 567.831 432.788 567.725 433.85L565.812 453.188 562.625 453.188 562.625 456.375 559.438 456.375 559.438 459.562 595.562 459.562 595.562 456.375 592.375 456.375 592.375 453.188Z" fill="#F2F2F2"/><path d="M580.05 437.25 581.378 451.062 583.556 451.062 582.175 437.25Z" fill="#F2F2F2"/></g></svg>
                <span>LINKS</span>
        <div class="links-tile-title">Disaster Management Processes</div>
                <span>Community</span>
      </a>
                <span>Center</span>
    </div>
            </h1>
    <div class="col p-0">
            <p class="hp-lead">
      <a class="links-tile">
                <span>Strengthening links between technologies and&nbsp;society for&nbsp;European disaster resilience.</span>
        <svg width="60" height="60" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" overflow="hidden"><defs><clipPath id="clip2"><rect x="553" y="282" width="48" height="49"/></clipPath></defs><g clip-path="url(#clip2)" transform="translate(-553 -282)"><path d="M40 8.1C40 10.033 38.433 11.6 36.5 11.6 34.567 11.6 33 10.033 33 8.1 33 6.167 34.567 4.6 36.5 4.6 38.433 4.6 40 6.167 40 8.1Z" fill="#F2F2F2" transform="matrix(1 0 0 1.02083 553 282)"/><path d="M15 8.1C15 10.033 13.433 11.6 11.5 11.6 9.567 11.6 8 10.033 8 8.1 8 6.167 9.567 4.6 11.5 4.6 13.433 4.6 15 6.167 15 8.1Z" fill="#F2F2F2" transform="matrix(1 0 0 1.02083 553 282)"/><path d="M27.5 8.1C27.5 10.033 25.933 11.6 24 11.6 22.067 11.6 20.5 10.033 20.5 8.1 20.5 6.167 22.067 4.6 24 4.6 25.933 4.6 27.5 6.167 27.5 8.1Z" fill="#F2F2F2" transform="matrix(1 0 0 1.02083 553 282)"/><path d="M32.9 24.4 30.65 16.1C30.55 15.8 30.4 15.5 30.2 15.3 29.25 14.3 28.05 13.55 26.75 13.1 25.9 12.8 25 12.65 24.05 12.65 23.1 12.65 22.2 12.8 21.35 13.1 20 13.55 18.85 14.3 17.9 15.3 17.7 15.55 17.55 15.8 17.45 16.1L15.2 24.4C15 25.2 15.4 26.1 16.25 26.3 16.4 26.35 16.5 26.35 16.65 26.35 17.3 26.35 17.9 25.9 18.1 25.25L20.1 17.95 20.1 43.4 23.1 43.4 23.1 29.1 25.1 29.1 25.1 43.35 28.1 43.35 28.1 17.95 30.1 25.25C30.3 25.9 30.9 26.35 31.55 26.35 31.7 26.35 31.8 26.35 31.95 26.3 32.65 26.1 33.1 25.2 32.9 24.4Z" fill="#F2F2F2" transform="matrix(1 0 0 1.02083 553 282)"/><path d="M14.15 24.15 16.4 15.85C16.5 15.4 16.75 15 17 14.65 16.2 13.95 15.2 13.4 14.15 13.05 13.3 12.75 12.4 12.6 11.45 12.6 10.5 12.6 9.6 12.75 8.75 13.05 7.4 13.5 6.25 14.25 5.3 15.25 5.1 15.5 4.95 15.75 4.85 16.05L2.6 24.4C2.4 25.2 2.8 26.1 3.65 26.3 3.8 26.35 3.9 26.35 4.05 26.35 4.7 26.35 5.3 25.9 5.5 25.25L7.5 17.95 7.5 43.4 10.5 43.4 10.5 29.1 12.5 29.1 12.5 43.35 15.5 43.35 15.5 27.15C14.45 26.65 13.85 25.4 14.15 24.15Z" fill="#F2F2F2" transform="matrix(1 0 0 1.02083 553 282)"/><path d="M45.4 24.4 43.1 16.1C43 15.8 42.85 15.5 42.65 15.3 41.7 14.3 40.5 13.55 39.2 13.1 38.35 12.8 37.45 12.65 36.5 12.65 35.55 12.65 34.65 12.8 33.8 13.1 32.75 13.45 31.8 14 30.95 14.7 31.25 15.05 31.45 15.45 31.55 15.85L33.8 24.15C34.15 25.4 33.5 26.65 32.45 27.15L32.45 43.4 35.45 43.4 35.45 29.1 37.45 29.1 37.45 43.35 40.45 43.35 40.45 17.95 42.45 25.25C42.65 25.9 43.25 26.35 43.9 26.35 44.05 26.35 44.15 26.35 44.3 26.3 45.15 26.1 45.6 25.2 45.4 24.4Z" fill="#F2F2F2" transform="matrix(1 0 0 1.02083 553 282)"/></g></svg>
            </p>
        <div class="links-tile-title">Disaster Risk Perception and&nbsp;Vulnerability</div>
            <div class="hp-button-wrapper">
      </a>
                <a class="hp-large-button" href="/index.php/User_Guidance">
    </div>
                    <div style="display: flex; align-items: center;">
  </div>
                        <div>
  <div class="row my-2">
                           
    <div class="col p-0">
                        </div>
      <a class="links-tile">
                        <div style="display: flex; flex-direction: column;">
         <svg width="60" height="60" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" overflow="hidden"><defs><clipPath id="clip3"><rect x="657" y="442" width="55" height="55"/></clipPath></defs><g clip-path="url(#clip3)" transform="translate(-657 -442)"><path d="M684.5 447.729C672.469 447.729 662.729 457.469 662.729 469.5 662.729 481.531 672.469 491.271 684.5 491.271 696.531 491.271 706.271 481.531 706.271 469.5 706.271 457.469 696.531 447.729 684.5 447.729ZM684.5 488.979C673.786 488.979 665.021 480.214 665.021 469.5 665.021 458.786 673.786 450.021 684.5 450.021 687.307 450.021 689.943 450.594 692.349 451.682L690.516 453.172C690.286 453.344 690.057 453.458 689.771 453.458L688.682 453.458C688.568 453.458 688.396 453.458 688.281 453.401 688.281 453.401 685.474 451.74 683.87 451.74 682.323 451.74 679.802 452.714 678.714 453.458 677.052 454.547 678.828 455.062 679.229 455.177 679.286 455.177 679.344 455.177 679.344 455.177L680.948 455.177C681.349 455.177 681.693 455.005 681.922 454.661L682.552 453.688C682.667 453.516 682.839 453.458 683.01 453.458L683.927 453.458 682.724 455.464C682.438 455.979 681.865 456.323 681.234 456.323L679.688 456.323C679.458 456.323 679.229 456.38 679.057 456.495L677.625 457.469 676.479 457.469C676.135 457.469 675.906 457.698 675.906 458.042L675.906 458.615C675.906 458.958 675.677 459.188 675.333 459.188L674.818 459.188C674.417 459.188 674.073 459.359 673.844 459.703L673.156 460.792C673.099 460.906 673.042 461.021 673.042 461.135L673.042 461.479C673.042 461.823 673.271 462.052 673.615 462.052L675.677 462.052C675.849 462.052 675.964 461.995 676.078 461.88L677.854 460.104C678.083 459.875 678.37 459.76 678.656 459.76L678.885 459.76C679.172 459.76 679.401 459.932 679.458 460.219L679.802 461.651C679.859 461.88 680.089 462.109 680.375 462.109L680.49 462.109C680.833 462.109 681.062 461.88 681.062 461.536L681.062 460.047C681.062 459.875 681.12 459.76 681.234 459.646L681.635 459.188 682.094 460.505C682.151 460.734 682.38 460.906 682.609 460.906L683.125 460.906C683.297 460.906 683.411 460.849 683.526 460.734L683.755 460.505C683.87 460.391 683.984 460.333 684.156 460.333L684.5 460.333C684.844 460.333 685.073 460.562 685.073 460.906L685.073 461.479C685.073 461.823 685.302 462.052 685.646 462.052L687.708 462.052C688.109 462.052 688.396 462.453 688.224 462.797L688.052 463.312C687.938 463.599 687.708 463.771 687.422 463.714L684.672 463.255C684.557 463.255 684.385 463.255 684.271 463.255L681.922 463.714C681.693 463.771 681.521 463.714 681.292 463.656 680.547 463.37 678.484 462.625 677.625 462.625 670.807 462.625 670.75 467.208 670.75 468.927 670.75 471.219 672.068 472.938 674.188 472.938 676.708 472.938 679.917 472.823 679.917 477.521L679.917 481.073C679.917 481.76 680.146 482.391 680.604 482.906L682.266 484.911C682.609 485.312 683.068 485.542 683.583 485.542L684.958 485.542C685.417 485.542 685.875 485.37 686.161 485.026L687.536 483.651C687.823 483.365 687.995 483.078 688.167 482.734L689.312 480.385C689.484 479.984 689.599 479.526 689.599 479.125L689.599 476.49C689.599 476.031 689.771 475.573 690.115 475.286L693.151 472.25C693.38 472.021 693.38 471.562 693.094 471.391 693.094 471.391 689.656 469.443 687.766 465.776 687.594 465.375 687.823 464.917 688.281 464.917L688.51 464.917 691.776 469.156C692.177 469.672 692.922 469.729 693.438 469.328L695.328 467.724C695.615 467.495 695.615 466.979 695.271 466.807L693.552 465.776C693.323 465.604 693.208 465.318 693.323 465.031L693.38 464.917C693.552 464.63 693.896 464.516 694.182 464.688L696.245 465.948C696.417 466.062 696.646 466.12 696.818 466.12L697.448 466.12C697.906 466.12 698.307 466.406 698.479 466.807L700.141 470.589C700.312 470.99 700.714 471.276 701.172 471.276L701.172 471.276C701.688 471.276 702.146 470.818 702.146 470.302L702.146 468.698C702.146 468.526 702.203 468.354 702.375 468.24L703.693 467.208C703.807 467.953 703.865 468.755 703.865 469.557 703.979 480.214 695.214 488.979 684.5 488.979Z" fill="#F2F2F2"/><path d="M674.188 457.469 674.188 458.042 674.76 458.042C675.104 458.042 675.333 457.812 675.333 457.469L675.333 456.896 675.906 456.896 675.906 455.979C675.906 455.807 675.849 455.693 675.734 455.578L675.161 455.005C674.932 454.776 674.589 454.776 674.359 455.005L673.443 455.922C673.214 456.151 673.214 456.495 673.443 456.724L674.188 457.469Z" fill="#F2F2F2"/></g></svg>
                            <span>User Guidance</span>
        <div class="links-tile-title">Disaster Reports</div>
                            <span style="font-size: 50%; margin-left: .2em; line-height: 1em;">Navigate through the LINKS<br>Community Center!</span>
      </a>
                        </div>
    </div>
                    </div>
    <div class="col p-0 mx-2">
                </a>
      <a class="links-tile">
            </div>
        <div class="links-tile-title">Research Results</div>
        </div>
      </a>
        <!-- HEADING END -->
    </div>
 
    <div class="col p-0">
        <!-- MAIN BEGIN -->
      <a class="links-tile">
        <div id="hp-main">
        <div class="links-tile-title">Guidelines</div>
   
      </a>
            <!-- SNIPPETS BEGIN -->
    </div>
            <div id="snippets"></div>
  </div>
            <link rel="stylesheet" href="https://api.safety-base.eu/v2/links/snippets/styles.css">
  <div class="row">
            <script src="https://api.safety-base.eu/v2/links/snippets/script.js"></script>
    <div class="col p-0">
            <!-- SNIPPETS END -->
      <a class="links-tile">
       
         <div class="links-tile-title">Events</div>
            <!-- SEARCH BEGIN -->
      </a>
                <script src="https://api.safety-base.eu/v2/links/search"></script>
    </div>
                <form class="hp-search form-inline w-100" onsubmit="search(event)">
    <div class="col p-0 mx-2">
                <input id="hp-search-input" class="form-control form-control-lg flex-grow-1" type="text" placeholder="Search the entire LCC" aria-label="Search">
      <a class="links-tile">
                    <button type="submit" class="btn btn-primary btn-lg" style="background-color: var(--links-blue); border-color: var(--links-blue);">
         <div class="links-tile-title">Members</div>
                        Search
      </a>
                    </button>
    </div>
                </form>
    <div class="col p-0">
            <!-- SEARCH END -->
      <a class="links-tile">
 
        <div class="links-tile-title">Glossary</div>
            <!-- AREAS BEGIN -->
      </a>
            <div class="hp-areas">
                <h2>Social Media and Crowdsourcing Libraries</h2>
 
                <!-- LINK -->
                <a class="hp-area blue" href="https://links.communitycenter.eu/index.php/List_of_Disaster_Community_Technologies">
                    <div class="hp-area-icon">
                        <img src="https://api.safety-base.eu/v2/links/lib?q=1-dct_list.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>
 
                <!-- LINK -->
                <a class="hp-area orange" href="https://links.communitycenter.eu/index.php/List_of_Guidelines">
                    <div class="hp-area-icon">
                        <img src="https://api.safety-base.eu/v2/links/lib?q=2-gl_list.svg">
                    </div>
                    <div class="hp-area-text">
                        <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>
 
                <!-- LINK -->
                <a class="hp-area cyan" href="https://links.communitycenter.eu/index.php/List_of_Use_Cases">
                    <div class="hp-area-icon">
                        <img src="https://api.safety-base.eu/v2/links/lib?q=3-uc_list.svg">
                    </div>
                    <div class="hp-area-text">
                        <h3>Use Cases</h3>
                        <p>Practical use cases for&nbsp;social media and&nbsp;crowdsourcing in&nbsp;disasters.</p>
                    </div>
                    <div class="hp-area-arrow">&rarr;</div>
                </a>
               
                <!-- LINK -->
                <a class="hp-area yellow" href="https://links.communitycenter.eu/index.php/List_of_Crisis_Communication">
                    <div class="hp-area-icon">
                        <img src="https://api.safety-base.eu/v2/links/lib?q=4-cc_list.svg">
                    </div>
                    <div class="hp-area-text">
                        <h3>Crisis Communication</h3>
                        <p>Recommendations for&nbsp;efficient risk communication in&nbsp;disasters.</p>
                    </div>
                    <div class="hp-area-arrow">&rarr;</div>
                </a>
               
            </div>
            <!-- AREAS END -->
 
        </div>
        <!-- MAIN END -->
               
        <!-- PRODUCTS BEGIN -->
        <div id="hp-products" class="container-fluid">
            <div class="row">
 
                <!-- LINK -->
                <div id="hp-feel-safe" class="col-12 col-lg-4">
                    <a class="hp-area grey" href="https://links.communitycenter.eu/index.php/Feel_Safe">
                        <div class="hp-area-icon">
                            <img src="https://api.safety-base.eu/v2/links/lib?q=prod-0.svg">
                        </div>
                        <div class="hp-area-text">
                            <h3>Feel Safe</h3>
                            <!-- <p>Feel Safe.</p> -->
                        </div>
                    </a>
                </div>
                       
                <!-- LINK -->
                <div id="hp-handbook" class="col-12 col-lg-4">
                    <a class="hp-area grey" href="https://links.communitycenter.eu/index.php/Including_Citizens_Handbook_-_Accessibility">
                        <div class="hp-area-icon">
                            <img src="https://api.safety-base.eu/v2/links/lib?q=prod-1.svg">
                        </div>
                        <div class="hp-area-text">
                            <h3>Including Citizens Handbook</h3>
                            <!-- <p>Including Citizens Handbook.</p> -->
                        </div>
                    </a>
                </div>
 
                <!-- LINK -->
                <div id="hp-wheel" class="col-12 col-lg-4">
                    <a class="hp-area grey" href="https://links.communitycenter.eu/index.php/Resilience_Wheel">
                        <div class="hp-area-icon">
                            <img src="https://api.safety-base.eu/v2/links/lib?q=prod-2.svg">
                        </div>
                        <div class="hp-area-text">
                            <h3>Resilience Wheel</h3>
                            <!-- <p>Resilience Wheel.</p> -->
                        </div>
                    </a>
                </div>
 
            </div>
        </div>
        <!-- PRODUCTS END -->
       
        <!-- COLLECTIONS BEGIN -->
        <div id="hp-collections" class="container-fluid">
            <div class="row">
 
                <!-- LINK -->
                <div id="hp-resources" class="col-12 col-lg-6">
                    <a class="hp-area grey" href="https://links.communitycenter.eu/index.php/Helpful_resources">
                        <div class="hp-area-icon">
                            <img src="https://api.safety-base.eu/v2/links/lib?q=prod-3.svg">
                        </div>
                        <div class="hp-area-text">
                            <h3>Collection of Helpful Resources</h3>
                            <p>Browse some interesting or&nbsp;relevant websites and&nbsp;apps.</p>
                        </div>
                    </a>
                </div>
                       
                <!-- LINK -->
                <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="hp-area-icon">
                            <img src="https://api.safety-base.eu/v2/links/lib?q=prod-4.svg">
                        </div>
                        <div class="hp-area-text">
                            <h3>Collection of Networks</h3>
                            <p>Communities and&nbsp;interest groups relevant for&nbsp;the context of&nbsp;social media in&nbsp;disaster management. 0b</p>
                        </div>
                    </a>
                </div>
 
            </div>
        </div>
        <!-- COLLECTIONS END -->
 
         <!-- FORUM SECTION BEGIN -->
        <div id="hp-recent" class="container-fluid">
            <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>
         <!-- FORUM SECTION END -->
           
     </div>
     </div>
  </div>
    <!-- HP END -->
</div>


<!-- kie: Moved forum embedding from HTMLlets extension to this Widget -->
    <!-- BEGIN SAFETY.WIDGET -->
<p>Current LINKS Forum topics</p>
    <link rel="stylesheet" href="https://widget.safety-base.eu/v2/widget/styles.css">
<script src="https://forum.links.communitycenter.eu/javascripts/embed-topics.js"></script>
    <div id="safety-widget"></div>
    <script src="https://widget.safety-base.eu/v2/widget/script.js"></script>
    <!-- END SAFETY.WIDGET -->


<div width="100%">
</includeonly>
  <d-topics-list discourse-url="https://forum.links.communitycenter.eu" per-page="5" order="latest"
                sort-ascending="false" template="basic"></d-topics-list>
</div>

Latest revision as of 08:36, 2 October 2024

Second version of the LINKS Community Center homepage.
Do not modify!