Преглед на файлове

Added reload button when excluding site from popup

master
Said Achmiz преди 6 години
родител
ревизия
136e3234c0
променени са 3 файла, в които са добавени 68 реда и са изтрити 20 реда
  1. 48
    13
      popup.css
  2. 6
    3
      popup.html
  3. 14
    4
      popup.js

+ 48
- 13
popup.css Целия файл

button::selection { button::selection {
background-color: transparent; background-color: transparent;
} }
#main-button-container {
.main-button-container {
display: flex; display: flex;
flex-flow: column; flex-flow: column;
border-bottom: 1px solid #ddd;
} }
#main-button-container button {
button.main-button {
padding: 10px; padding: 10px;
font-size: 6rem; font-size: 6rem;
display: flex; display: flex;
color: #ccc; color: #ccc;
font-family: Font Awesome; font-family: Font Awesome;
} }
#main-button-container button.active {
button.main-button.active {
color: #000; color: #000;
} }
#main-button-container button:hover {
button.main-button:hover {
text-shadow: text-shadow:
0 0 1px #fff, 0 0 1px #fff,
0 0 3px #fff, 0 0 3px #fff,
0 0 5px #fff; 0 0 5px #fff;
} }
#main-button-container button:hover {
button.main-button:hover {
color: #999; color: #999;
} }
#main-button-container button::before {
button.main-button::before {
content: "\F08D"; content: "\F08D";
font-weight: 900; font-weight: 900;
position: relative; position: relative;
top: 3px; top: 3px;
} }
#main-button-container button::after {
button.main-button::after {
content: "\F05E"; content: "\F05E";
position: absolute; position: absolute;
font-weight: 300; font-weight: 300;
opacity: 0.0; opacity: 0.0;
transform: scaleX(-1) scale(1.5); transform: scaleX(-1) scale(1.5);
} }
#main-button-container button.active::after {
button.main-button.active::after {
opacity: 1.0; opacity: 1.0;
} }
#aux-button-container {
.aux-button-container {
display: flex; display: flex;
flex-flow: column;
border-top: 1px solid #ddd; border-top: 1px solid #ddd;
} }
.options-button {
button.options-button {
font-size: 1.125rem; font-size: 1.125rem;
padding: 10px; padding: 10px;
color: #777; color: #777;
width: 100%; width: 100%;
height: 3rem;
font-family: Font Awesome, Inconsolata, sans-serif; font-family: Font Awesome, Inconsolata, sans-serif;
} }
.options-button:hover {
button.options-button:hover {
color: #000; color: #000;
} }
.options-button::before {
button.options-button::before {
content: "\F1DE"; content: "\F1DE";
font-family: Font Awesome; font-family: Font Awesome;
font-size: 0.875em; font-size: 0.875em;
margin: 0 6px 0 0; margin: 0 6px 0 0;
} }
.options-button::after {
button.options-button::after {
content: "Options"; content: "Options";
margin: 0 3px 0 0; margin: 0 3px 0 0;
} }
button.reload-button {
background-color: #ffd;
margin: 4px;
border-radius: 6px;
color: #777;
max-height: 0;
padding: 0;
overflow: hidden;
position: absolute;
width: calc(100% - 8px);
top: -4rem;
}
button.reload-button.active {
max-height: 1000px;
padding: 8px;
border: 1px solid #ddd;
top: 1px;
}
button.reload-button:hover {
color: #000;
}
button.reload-button::before {
content: "\F2F1";
font-family: Font Awesome;
font-size: 2rem;
font-weight: 900;
}

.misc {
height: 4rem;
position: relative;
}

+ 6
- 3
popup.html Целия файл

<link rel='stylesheet' type='text/css' href='fonts.css' /> <link rel='stylesheet' type='text/css' href='fonts.css' />
</head> </head>
<body> <body>
<div id='main-button-container'>
<button type='button'></button>
<div class='main-button-container'>
<button type='button' class='main-button'></button>
</div> </div>
<div id='aux-button-container'>
<div class='misc'>
<button type='button' class='reload-button'></button>
</div>
<div class='aux-button-container'>
<button type='button' class='options-button'></button> <button type='button' class='options-button'></button>
</div> </div>
</body> </body>

+ 14
- 4
popup.js Целия файл

} }


function updateUIState() { function updateUIState() {
let button = document.querySelector("#main-button-container button");
let button = document.querySelector("button.main-button");
if (ASK.mode == "blacklist" && ASK.pageMatched && !ASK.pageExcluded) { if (ASK.mode == "blacklist" && ASK.pageMatched && !ASK.pageExcluded) {
button.classList.toggle("active", true); button.classList.toggle("active", true);
// button.innerHTML = "X"; // button.innerHTML = "X";
}); });
}); });


document.querySelector("#main-button-container button").addActivateEvent((event) => {
document.querySelector("button.main-button").addActivateEvent((event) => {
toggleState(); toggleState();


let matchingPatterns = ASK.matchingPatterns.join("\n"); let matchingPatterns = ASK.matchingPatterns.join("\n");
"mode": mode "mode": mode
}, () => { }, () => {
updateUIState(); updateUIState();
if (ASK.pageMatched && !ASK.pageExcluded)
let reloadButton = document.querySelector("button.reload-button");
if (ASK.pageMatched && !ASK.pageExcluded) {
chrome.tabs.executeScript(null, { code: 'killSticky()' }); chrome.tabs.executeScript(null, { code: 'killSticky()' });
reloadButton.classList.toggle("active", false);
} else {
reloadButton.classList.toggle("active", true);
}
}); });
}); });




document.querySelector("#aux-button-container button").addActivateEvent((event) => {
document.querySelector("button.options-button").addActivateEvent(() => {
chrome.runtime.openOptionsPage(null); chrome.runtime.openOptionsPage(null);
}); });
document.querySelector("button.reload-button").addActivateEvent(() => {
chrome.tabs.update(null, { url: ASK.activeTabLocation });
window.close();
});
} }


initialize(); initialize();

Loading…
Отказ
Запис