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
 
(78 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="59" height="59" 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="51" height="51" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" overflow="hidden"><defs><clipPath id="clip0"><rect x="552" y="416" width="51" height="51"/></clipPath></defs><g clip-path="url(#clip0)" 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="48" height="49" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" overflow="hidden"><defs><clipPath id="clip0"><rect x="553" y="282" width="48" height="49"/></clipPath></defs><g clip-path="url(#clip0)" 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;">
        <div class="links-tile-title">Disaster Reports</div>
                            <span>User Guidance</span>
      </a>
                            <span style="font-size: 50%; margin-left: .2em; line-height: 1em;">Navigate through the LINKS<br>Community Center!</span>
    </div>
                        </div>
    <div class="col p-0 mx-2">
                    </div>
      <a class="links-tile">
                </a>
        <div class="links-tile-title">Research Results</div>
            </div>
      </a>
        </div>
    </div>
        <!-- HEADING END -->
    <div class="col p-0">
 
      <a class="links-tile">
        <!-- MAIN BEGIN -->
        <div class="links-tile-title">Guidelines</div>
         <div id="hp-main">
      </a>
   
    </div>
            <!-- SNIPPETS BEGIN -->
  </div>
            <div id="snippets"></div>
  <div class="row">
            <link rel="stylesheet" href="https://api.safety-base.eu/v2/links/snippets/styles.css">
    <div class="col p-0">
            <script src="https://api.safety-base.eu/v2/links/snippets/script.js"></script>
      <a class="links-tile">
            <!-- SNIPPETS END -->
         <div class="links-tile-title">Events</div>
       
      </a>
            <!-- SEARCH BEGIN -->
    </div>
                <script src="https://api.safety-base.eu/v2/links/search"></script>
    <div class="col p-0 mx-2">
                <form class="hp-search form-inline w-100" onsubmit="search(event)">
      <a class="links-tile">
                <input id="hp-search-input" class="form-control form-control-lg flex-grow-1" type="text" placeholder="Search the entire LCC" aria-label="Search">
         <div class="links-tile-title">Members</div>
                    <button type="submit" class="btn btn-primary btn-lg" style="background-color: var(--links-blue); border-color: var(--links-blue);">
      </a>
                        Search
    </div>
                    </button>
    <div class="col p-0">
                </form>
      <a class="links-tile">
            <!-- SEARCH END -->
        <div class="links-tile-title">Glossary</div>
 
      </a>
            <!-- AREAS BEGIN -->
            <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!