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
 
(92 intermediate revisions by 5 users not shown)
Line 1: Line 1:
<h1 class="display-3">LINKS Community Center</h1>
<noinclude>Second version of the LINKS Community Center homepage.<br><strong style="color: red;">Do not modify!</strong></noinclude>
<p class="lead">
<includeonly>
  Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque sit amet pretium erat, sit amet rutrum arcu.
  Praesent porta lacus vel gravida commodo. Aliquam orci risus, rhoncus faucibus interdum eu, dignissim et justo.
</p>


<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 links-tile">Cell 1</div>
<!-- STYLES END -->
    <div class="col links-tile">Cell 2</div>
 
    <div class="col links-tile">Cell 3</div>
    <!-- HP BEGIN -->
  </div>
    <div id="hp-wrapper">
  <div class="row py-2">
 
    <div class="col links-tile">Cell 4</div>
        <!-- HEADING BEGIN -->
    <div class="col links-tile">Cell 5</div>
        <div id="hp-heading">
    <div class="col links-tile">Cell 6</div>
            <h1 translate="no">
  </div>
                <span>LINKS</span>
  <div class="row">
                <span>Community</span>
    <div class="col links-tile">Cell 7</div>
                <span>Center</span>
    <div class="col links-tile">Cell 8</div>
            </h1>
    <div class="col links-tile">Cell 9</div>
            <p class="hp-lead">
  </div>
                <span>Strengthening links between technologies and&nbsp;society for&nbsp;European disaster resilience.</span>
</div>
            </p>
</div>
            <div class="hp-button-wrapper">
                <a class="hp-large-button" href="/index.php/User_Guidance">
                    <div style="display: flex; align-items: center;">
                        <div>
                           
                        </div>
                        <div style="display: flex; flex-direction: column;">
                            <span>User Guidance</span>
                            <span style="font-size: 50%; margin-left: .2em; line-height: 1em;">Navigate through the LINKS<br>Community Center!</span>
                        </div>
                    </div>
                </a>
            </div>
        </div>
        <!-- HEADING END -->
 
        <!-- MAIN BEGIN -->
        <div id="hp-main">
   
            <!-- SNIPPETS BEGIN -->
            <div id="snippets"></div>
            <link rel="stylesheet" href="https://api.safety-base.eu/v2/links/snippets/styles.css">
            <script src="https://api.safety-base.eu/v2/links/snippets/script.js"></script>
            <!-- SNIPPETS END -->
       
            <!-- SEARCH BEGIN -->
                <script src="https://api.safety-base.eu/v2/links/search"></script>
                <form class="hp-search form-inline w-100" onsubmit="search(event)">
                <input id="hp-search-input" class="form-control form-control-lg flex-grow-1" type="text" placeholder="Search the entire LCC" aria-label="Search">
                    <button type="submit" class="btn btn-primary btn-lg" style="background-color: var(--links-blue); border-color: var(--links-blue);">
                        Search
                    </button>
                </form>
            <!-- SEARCH END -->
 
            <!-- 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>
    <!-- HP END -->
 
    <!-- BEGIN SAFETY.WIDGET -->
    <link rel="stylesheet" href="https://widget.safety-base.eu/v2/widget/styles.css">
    <div id="safety-widget"></div>
    <script src="https://widget.safety-base.eu/v2/widget/script.js"></script>
    <!-- END SAFETY.WIDGET -->
 
</includeonly>

Latest revision as of 08:36, 2 October 2024

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

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