Widget: DevGuidelines: Difference between revisions
From LINKS Community Center
Cschwentker (talk | contribs) No edit summary |
Cschwentker (talk | contribs) No edit summary |
||
| 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 14:11, 22 November 2022
Development version of the List of Guidelines.
Not ready for production!