security-and-privacy/CanvasBlocker
security-and-privacy/CanvasBlocker
1
0
Fork 0
mirror of https://github.com/kkapsner/CanvasBlocker synced 2025-07-03 20:16:33 +02:00
Code Releases Activity

Options: made sections collapsible

Browse source 
For #353
This commit is contained in:
kkapsner 2019-06-11 13:54:15 +02:00
parent e510f78f87
commit 27ddc8a683
5 changed files with 62 additions and 11 deletions
Download patch file Download diff file Expand all files Collapse all files

23
options/options.css
View file

@ -42,11 +42,32 @@ header .bookmarkNotice .dontShowOptionsOnUpdate input {
padding: 0;
}
.settings .collapsed .settingRow {
display: none;
}
.settings .section h2 {
border: 1px #c1c1c1 solid;
border-radius: 0.5em ;
padding: 0.2em 0.5em;
padding: 0.2em 2em 0.2em 0.5em;
margin: 0.7em 1px 0.2em;
position: relative;
}
.settings .section .collapser {
cursor: pointer;
position: absolute;
right: 0.8em;
}
.settings .section .collapser::before {
content: "\25BC";
}
.settings .collapsed .section .collapser::before {
content: "\25B6";
}
.searching .settings .section .collapser {
visibility: hidden;
}
.settings .settingRow .content {

36
options/options.js
View file

@ -244,18 +244,40 @@
}
});
const {hide: hideContainer, expand: expandContainer} = settings.getContainers();
let lastSection = null;
let addSection = function addSection(name){
let body = document.createElement("tbody");
const addSection = function addSection(name){
const body = document.createElement("tbody");
if (name){
let row = document.createElement("tr");
const row = document.createElement("tr");
row.className = "section";
let cell = document.createElement("td");
const cell = document.createElement("td");
cell.colSpan = 3;
row.appendChild(cell);
let heading = document.createElement("h2");
heading.textContent = extension.getTranslation("section_" + name);
const id = "section_" + name;
const heading = document.createElement("h2");
heading.textContent = extension.getTranslation(id);
cell.appendChild(heading);
if (expandContainer){
const collapser = document.createElement("span");
collapser.className = "collapser";
collapser.addEventListener("click", function(){
expandContainer.setExpandByName(id, !expandContainer.getExpandByName(id, true));
});
expandContainer.onExpandChange(id, function(value){
body.classList[value? "remove": "add"]("collapsed");
});
if (!expandContainer.getExpandByName(id, true)){
body.classList.add("collapsed");
}
heading.appendChild(collapser);
}
body.appendChild(row);
}
table.appendChild(body);
@ -295,8 +317,6 @@
addSection();
const beforeChangeEventListeners = {};
const {hide: hideContainer, expand: expandContainer} = settings.getContainers();
settingsDisplay.forEach(function(display){
if (typeof display === "string"){
addSection(display);