Many hyperlinks are disabled.
Use anonymous login
to enable hyperlinks.
Changes In Branch accordion-experiments Excluding Merge-Ins
This is equivalent to a diff from 04bbb05d to 04f232aa
|
2020-04-08
| ||
| 14:07 | Use dynamically created foreground image elements instead of CSS background images to indicate the status and available actions for the accordion, so they are visible by default for printouts and PDFs, invisible for noscript clients, and enhance compatibility with most skins (Xekri's "justify-content: space-around;" is crunchy, however). ... (check-in: 1006de1e user: florian tags: accordion-experiments-2) | |
|
2020-04-05
| ||
| 14:30 | Use regular comments in Javascript files, instead of comments private to the mkbuiltin utility, so the files are easier to reuse and test outside of Fossil, and easier to process with synatx highlighting-enabled text editors. ... (Closed-Leaf check-in: 04f232aa user: florian tags: accordion-experiments) | |
| 14:28 | Use SVG icons to indicate the status and available actions for the accordion. ... (check-in: 6126a541 user: florian tags: accordion-experiments) | |
|
2020-04-02
| ||
| 18:57 | Fix the "fossil revert" command so that it works even for a new --empty checkout. ... (check-in: 9aca02b7 user: drh tags: trunk) | |
| 18:56 | Fix the "fossil revert" command so that it works even for a new --empty checkout. ... (Closed-Leaf check-in: 04bbb05d user: drh tags: accordion-about-wiki) | |
| 00:15 | Attempting to add "accordion" action to the "About" sections of pages that have associated wiki. Basically works, but needs CSS tweaks, and possibly other UX improvements. ... (check-in: b17e4c5a user: drh tags: accordion-about-wiki) | |
Changes to src/accordion.js.
|
| | | < > | 1 2 3 4 5 6 7 8 9 10 |
/* Attach appropriate javascript to each ".accordion" button so that
** it expands and contracts when clicked.
*/
var a = document.getElementsByClassName("accordion");
for(var i=0; i<a.length; i++){
var p = a[i].nextElementSibling;
p.style.maxHeight = p.scrollHeight + "px";
a[i].addEventListener("click",function(){
var x = this.nextElementSibling;
if( this.classList.contains("accordion_closed") ){
|
| ︙ | ︙ |
Changes to src/default_css.txt.
| ︙ | ︙ | |||
809 810 811 812 813 814 815 816 817 |
margin-left: .16em;
margin-right: 0;
}
.nobr {
white-space: nowrap;
}
.accordion {
cursor: pointer;
}
| > > > > > > < < < < | < > > | 809 810 811 812 813 814 815 816 817 818 819 820 821 822 823 824 825 826 827 828 829 830 831 |
margin-left: .16em;
margin-right: 0;
}
.nobr {
white-space: nowrap;
}
.accordion {
padding-left: 30px;
//Note: the mkcss utility does not support line breaks in data URIs.
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath style='fill:black;opacity:0' d='M16,16H0V0h16v16z'/%3E%3Cpath style='fill:rgb(240,240,240)' d='M14,14H2V2h12v12z'/%3E%3Cpath style='fill:rgb(64,64,64)' d='M13,13H3V3h10v10z'/%3E%3Cpath style='fill:rgb(248,248,248)' d='M12,12H4V4h8v8z'/%3E%3Cpath style='fill:rgb(80,128,208)' d='M11,9H5V7h6v6z'/%3E%3C/svg%3E");
background-repeat: no-repeat;
background-position: 10px center;
background-size: 16px 16px;
cursor: pointer;
}
.accordion_closed {
//Note: the mkcss utility does not support line breaks in data URIs.
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath style='fill:black;opacity:0' d='M16,16H0V0h16v16z'/%3E%3Cpath style='fill:rgb(240,240,240)' d='M14,14H2V2h12v12z'/%3E%3Cpath style='fill:rgb(64,64,64)' d='M13,13H3V3h10v10z'/%3E%3Cpath style='fill:rgb(248,248,248)' d='M12,12H4V4h8v8z'/%3E%3Cpath style='fill:rgb(80,128,208)' d='M5,7h2v-2h2v2h2v2h-2v2h-2v-2h-2z'/%3E%3C/svg%3E");
}
.accordion_panel {
overflow: hidden;
transition: max-height 0.25s ease-out;
}
|