Difference between revisions of "Widget:DevGuidelines"
From LINKS Community Center
Line 30: | Line 30: | ||
margin-right: .5em; | margin-right: .5em; | ||
} | } | ||
− | + | #filter-bar { position: relative; margin: 1em 0 2em 0; } | |
− | #filter-bar { | ||
− | |||
− | |||
− | |||
− | |||
#dct-filters { | #dct-filters { | ||
position: absolute; | position: absolute; | ||
Line 49: | Line 44: | ||
transition: all 400ms ease-in-out; | transition: all 400ms ease-in-out; | ||
} | } | ||
− | |||
#gl-filters.open { | #gl-filters.open { | ||
clip-path: inset(0 0 -50px -50px); | clip-path: inset(0 0 -50px -50px); | ||
Line 108: | Line 102: | ||
} | } | ||
− | .filter-wrapper .filter-container { | + | .filter-wrapper .filter-container { display: none; } |
− | + | .filter-wrapper.open .filter-container { display: block; } | |
− | |||
− | |||
− | .filter-wrapper.open .filter-container { | ||
− | |||
− | |||
.filter-wrapper h4 { | .filter-wrapper h4 { | ||
Line 184: | Line 173: | ||
border: 0 none; | border: 0 none; | ||
} | } | ||
− | + | ||
#guideline-tabulator.tabulator .tabulator-header .tabulator-col { | #guideline-tabulator.tabulator .tabulator-header .tabulator-col { | ||
border-bottom: 4px double var(--links-orange); | border-bottom: 4px double var(--links-orange); | ||
Line 222: | Line 211: | ||
} | } | ||
− | #guideline-tabulator.tabulator .guideline-title a, | + | #guideline-tabulator.tabulator .guideline-title a, |
#guideline-tabulator.tabulator .tabulator-responsive-collapse table a { | #guideline-tabulator.tabulator .tabulator-responsive-collapse table a { | ||
color: var(--links-orange); | color: var(--links-orange); | ||
} | } | ||
+ | |||
</style> | </style> | ||
Line 337: | Line 327: | ||
}); | }); | ||
− | |||
− | |||
Line 377: | Line 365: | ||
</h1> | </h1> | ||
<div id="guideline-intro"> | <div id="guideline-intro"> | ||
− | <p>The guidelines library gathers and structures existing guiding documents (guidelines, legal documents, | + | <p>The guidelines library gathers and structures existing guiding documents (guidelines, legal documents, Standard Operation Procedures) that support the implementation and use of social media and crowdsourcing in disaster management organisations. |
− | + | </p> | |
− | |||
− | |||
<ul> | <ul> | ||
<li>Building a communication strategy for social media and consideration of the main elements (e.g. | <li>Building a communication strategy for social media and consideration of the main elements (e.g. | ||
Line 409: | Line 395: | ||
<h2 style="margin-top: 2.5rem; margin-bottom: 0;">Results: <span id="result-count"></span></h2> | <h2 style="margin-top: 2.5rem; margin-bottom: 0;">Results: <span id="result-count"></span></h2> | ||
− | + | ||
<div id="gl-filters"> | <div id="gl-filters"> | ||
<h2 style="display: flex; justify-content: space-between;"> | <h2 style="display: flex; justify-content: space-between;"> | ||
Line 421: | Line 407: | ||
<g clip-path="url(#b)" transform="translate(-592 -312)"> | <g clip-path="url(#b)" transform="translate(-592 -312)"> | ||
<path | <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> | </g> | ||
</svg> | </svg> | ||
Line 432: | Line 418: | ||
</div> | </div> | ||
<div class="filter-wrapper"> | <div class="filter-wrapper"> | ||
− | <h4>Covers Thematic <span class="filter-toggle"><svg> | + | <h4>Covers Thematic <span class="filter-toggle"><svg><use href="#chevron-down"/></svg></span></h4> |
− | |||
− | |||
<div class="filter-container"> | <div class="filter-container"> | ||
<div class="filter-button-wrapper"> | <div class="filter-button-wrapper"> | ||
Line 444: | Line 428: | ||
</div> | </div> | ||
<div class="filter-wrapper"> | <div class="filter-wrapper"> | ||
− | <h4>Audience experience level<span class="filter-toggle"><svg> | + | <h4>Audience experience level<span class="filter-toggle"><svg><use href="#chevron-down"/></svg></span></h4> |
− | |||
− | |||
<div class="filter-container"> | <div class="filter-container"> | ||
<div class="filter-button-wrapper"> | <div class="filter-button-wrapper"> | ||
Line 456: | Line 438: | ||
</div> | </div> | ||
<div class="filter-wrapper"> | <div class="filter-wrapper"> | ||
− | <h4>Language<span class="filter-toggle"><svg> | + | <h4>Language<span class="filter-toggle"><svg><use href="#chevron-down"/></svg></span></h4> |
− | |||
− | |||
<div class="filter-container"> | <div class="filter-container"> | ||
<div class="filter-button-wrapper"> | <div class="filter-button-wrapper"> | ||
Line 468: | Line 448: | ||
</div> | </div> | ||
<div class="filter-wrapper"> | <div class="filter-wrapper"> | ||
− | <h4>Target audience<span class="filter-toggle"><svg> | + | <h4>Target audience<span class="filter-toggle"><svg><use href="#chevron-down"/></svg></span></h4> |
− | |||
− | |||
<div class="filter-container"> | <div class="filter-container"> | ||
<div class="filter-button-wrapper"> | <div class="filter-button-wrapper"> |
Revision as of 15:11, 22 November 2022
Development version of the List of Guidelines.
Not ready for production!