dtookey
/
Engine_Rebuild
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

added changing chevrons for accordion.

Browse Source
pull/2/head
David Tookey 5 years ago
parent 07677b4e19
commit 055166b502
4 changed files with 6 additions and 1 deletions
Show Stats Download Patch File Download Diff File

1
src/assets/images/chevron-down.svg
Unescape Escape View File

@ -0,0 +1 @@
<svg width="1em" height="1em" viewBox="0 0 16 16" class="bi bi-chevron-down" fill="currentColor" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" d="M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z"/></svg>
Side by Side

After

Width:  |  Height:  |  Size: 288 B

1
src/assets/images/chevron-up.svg
Unescape Escape View File

@ -0,0 +1 @@
<svg width="1em" height="1em" viewBox="0 0 16 16" class="bi bi-chevron-up" fill="currentColor" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" d="M7.646 4.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1-.708.708L8 5.707l-5.646 5.647a.5.5 0 0 1-.708-.708l6-6z"/></svg>
Side by Side

After

Width:  |  Height:  |  Size: 269 B

2
src/assets/views/card-category.mustache
Unescape Escape View File

@ -1,7 +1,7 @@
<html lang="en">
<div>
<div id="{{{category-key}}}-collapser" class="category-header">
<h4>{{{category-id-clean}}}</h4>
<div class="d-inline-flex"><h4>{{{category-id-clean}}}</h4> <img id="{{{category-key}}}-img" src="../images/chevron-up.svg" alt="button"/></div>
<p class="text-#000000 align-self-center">{{{category-description}}}</p>
</div>
<br>

3
src/ts_source/viewFactory.ts
Unescape Escape View File

@ -72,12 +72,15 @@ export function buildWebCardsFromConfig(configName: string) {
collapseButton.on("click", () => {
let collapsable = $(`#${categoryKey}-container`);
let collapseButton = $(`#${categoryKey}-collapser`);
let collapseImg = $(`#${categoryKey}-img`);
if ("none" === collapsable.css('display')) {
collapsable.css("display", "");
collapseButton.addClass("active");
collapseImg.attr("src", "../images/chevron-down.svg");
} else {
collapsable.css("display", "none");
collapseButton.removeClass("active");
collapseImg.attr("src", "../images/chevron-up.svg");
}
});

Write Preview
Loading…
Cancel
Save