mirror of
https://github.com/kkapsner/CanvasBlocker
synced 2024-12-22 12:50:36 +01:00
kkapsner
parent
a95fae3de8
commit
acc171041d
@ -2,6 +2,12 @@ body.standalone {
|
||||
padding: 0.5em;
|
||||
}
|
||||
|
||||
@media (max-width: 400px){
|
||||
body.standalone {
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
|
||||
header {
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
@ -11,6 +17,16 @@ header .bookmarkNotice {
|
||||
padding: 0.5em;
|
||||
}
|
||||
|
||||
@media (max-width: 400px){
|
||||
header {
|
||||
margin-bottom: 0.5em;
|
||||
}
|
||||
header h1 {
|
||||
margin-top: 0.3em;
|
||||
margin-bottom: 0.3em;
|
||||
}
|
||||
}
|
||||
|
||||
header .bookmarkNotice .dontShowOptionsOnUpdate {
|
||||
display: block;
|
||||
margin-top: 0.5em;
|
||||
@ -52,6 +68,11 @@ header .bookmarkNotice .dontShowOptionsOnUpdate input {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
@media (max-width: 400px){
|
||||
.settings .section h2 {
|
||||
font-size: 1.2em;
|
||||
}
|
||||
}
|
||||
|
||||
.settings .section .collapser {
|
||||
cursor: pointer;
|
||||
@ -75,6 +96,11 @@ header .bookmarkNotice .dontShowOptionsOnUpdate input {
|
||||
border-top: 1px solid #c1c1c1;
|
||||
position: relative;
|
||||
}
|
||||
@media (max-width: 400px){
|
||||
.settings .settingRow .content {
|
||||
padding: 0.35em 0 0.25em;
|
||||
}
|
||||
}
|
||||
.settings .settingRow.displayHiddenRow td {
|
||||
position: relative;
|
||||
}
|
||||
@ -96,6 +122,12 @@ header .bookmarkNotice .dontShowOptionsOnUpdate input {
|
||||
.settings .settingRow td:first-child .content, td.hideColumn label {
|
||||
margin-left: 10px;
|
||||
}
|
||||
@media (max-width: 400px){
|
||||
.settings .settingRow td:first-child .content, td.hideColumn label {
|
||||
margin-left: 0px;
|
||||
padding-top: 0.1em;
|
||||
}
|
||||
}
|
||||
.settings .settingRow td:last-child .content {
|
||||
margin-right: 10px;
|
||||
}
|
||||
@ -149,6 +181,11 @@ header .bookmarkNotice .dontShowOptionsOnUpdate input {
|
||||
white-space: pre-wrap;
|
||||
padding-right: 5px;
|
||||
}
|
||||
@media (max-width: 400px){
|
||||
.settings.displayDescriptions .settingRow .description {
|
||||
margin-inline-start: 0.5em;
|
||||
}
|
||||
}
|
||||
input[type=""], input[type="text"], input[type="number"], select, textarea {
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
@ -225,10 +262,18 @@ textarea {
|
||||
.urlValues .notSpecifiedForUrl {
|
||||
opacity: 0.5;
|
||||
}
|
||||
.inputURL {
|
||||
max-width: calc(100% - 2em);
|
||||
}
|
||||
|
||||
td.hideColumn {
|
||||
width: 45px;
|
||||
}
|
||||
@media (max-width: 400px){
|
||||
td.hideColumn {
|
||||
width: 33px;
|
||||
}
|
||||
}
|
||||
|
||||
.hideContent {
|
||||
cursor: pointer;
|
||||
@ -289,6 +334,8 @@ td.hideColumn {
|
||||
display: table-row;
|
||||
}
|
||||
|
||||
/* groups */
|
||||
|
||||
.groupTabs {
|
||||
display: flex;
|
||||
flex-wrap: nowrap;
|
||||
@ -316,13 +363,34 @@ td.hideColumn {
|
||||
padding: 0.5em 1em;
|
||||
margin: 2px;
|
||||
}
|
||||
.groups .groupName.selected {
|
||||
border-right-color: transparent;
|
||||
border-top-right-radius: 0;
|
||||
border-bottom-right-radius: 0;
|
||||
margin-right: -1px;
|
||||
padding-right: calc(1em + 3px);
|
||||
background-color: var(--background-color);
|
||||
@media (min-width: 401px){
|
||||
.groups .groupName.selected {
|
||||
border-right-color: transparent;
|
||||
border-top-right-radius: 0;
|
||||
border-bottom-right-radius: 0;
|
||||
margin-right: -1px;
|
||||
padding-right: calc(1em + 3px);
|
||||
background-color: var(--background-color);
|
||||
}
|
||||
}
|
||||
@media (max-width: 400px){
|
||||
.groupTabs {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.groups {
|
||||
border: none;
|
||||
margin: 0 0 0.3em 0;
|
||||
}
|
||||
|
||||
.groups .groupName {
|
||||
margin: 2px 0;
|
||||
padding: 1px 1em;
|
||||
}
|
||||
|
||||
.groups .groupName.selected {
|
||||
background-color: var(--stacked-inputs-focus-color);
|
||||
}
|
||||
}
|
||||
body:not(.searching) .settings tbody.sectionBody:not(.selectedGroup) {
|
||||
display: none;
|
||||
|
||||
@ -7,6 +7,7 @@
|
||||
<link href="../icons/icon.svg" type="image/svg" rel="icon">
|
||||
<link href="../icons/icon.svg" type="image/svg" rel="shortcut icon">
|
||||
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
</head>
|
||||
<body>
|
||||
<script src="../lib/require.js"></script>
|
||||
|
||||
@ -245,6 +245,7 @@
|
||||
let footCell = document.createElement("td");
|
||||
footCell.colSpan = 3;
|
||||
let newInput = document.createElement("input");
|
||||
newInput.className = "inputURL";
|
||||
newInput.title = extension.getTranslation("inputURL");
|
||||
const addURLSetting = function(){
|
||||
var url = newInput.value.trim();
|
||||
|
||||
@ -7,5 +7,10 @@
|
||||
|
||||
.notice .noticeImage {
|
||||
float: left;
|
||||
margin: 0 0.5em 0.5em 0;
|
||||
margin: 0 0.5em 0 0;
|
||||
height: 2.25em;
|
||||
}
|
||||
|
||||
.introduction {
|
||||
clear: both;
|
||||
}
|
||||
@ -6,6 +6,7 @@
|
||||
<link href="../icons/icon.svg" type="image/svg" rel="icon">
|
||||
<link href="../icons/icon.svg" type="image/svg" rel="shortcut icon">
|
||||
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
</head>
|
||||
<body>
|
||||
<script src="../lib/require.js"></script>
|
||||
|
||||
@ -102,6 +102,35 @@
|
||||
}).forEach(function(node){
|
||||
document.body.appendChild(node);
|
||||
});
|
||||
|
||||
// fit content to the window size
|
||||
if (window.innerHeight > document.body.getBoundingClientRect().bottom){
|
||||
const computedStyle = window.getComputedStyle(document.body);
|
||||
const availableHeight = window.innerHeight - parseFloat(computedStyle.marginBottom);
|
||||
const originalFontSize = parseFloat(computedStyle.fontSize) || 10;
|
||||
let fontSize = originalFontSize;
|
||||
let lastDelta = 8;
|
||||
|
||||
while (
|
||||
availableHeight > document.body.getBoundingClientRect().bottom
|
||||
){
|
||||
fontSize += lastDelta;
|
||||
document.body.style.fontSize = fontSize + "px";
|
||||
}
|
||||
let direction = -1;
|
||||
while (
|
||||
lastDelta > 0.125
|
||||
){
|
||||
lastDelta /= 2;
|
||||
fontSize += direction * lastDelta;
|
||||
document.body.style.fontSize = fontSize + "px";
|
||||
direction = Math.sign(availableHeight - document.body.getBoundingClientRect().bottom);
|
||||
}
|
||||
while (availableHeight < document.body.getBoundingClientRect().bottom){
|
||||
fontSize -= lastDelta;
|
||||
document.body.style.fontSize = fontSize + "px";
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
document.querySelector("head title").textContent = extension.getTranslation("presets_title");
|
||||
@ -150,6 +179,7 @@
|
||||
}
|
||||
|
||||
let introduction = document.createElement("div");
|
||||
introduction.className = "introduction";
|
||||
introduction.textContent = extension.getTranslation("presets_introduction");
|
||||
head.appendChild(introduction);
|
||||
}());
|
||||
@ -6,7 +6,7 @@ Version 0.5.14:
|
||||
-
|
||||
|
||||
fixes:
|
||||
-
|
||||
- improved option pages on mobile
|
||||
|
||||
known issues:
|
||||
- if a data URL is blocked the page action button does not appear
|
||||
|
||||
@ -26,6 +26,7 @@ button {
|
||||
box-sizing: border-box;
|
||||
padding: 0.25em 0.5em;
|
||||
cursor: pointer;
|
||||
font-size: 1em;
|
||||
}
|
||||
|
||||
button:focus {
|
||||
|
||||
@ -57,6 +57,10 @@
|
||||
{
|
||||
"version": "0.5.14Alpha20190724",
|
||||
"update_link": "https://canvasblocker.kkapsner.de/versions/canvasblocker_beta-0.5.14Alpha20190724-an+fx.xpi"
|
||||
},
|
||||
{
|
||||
"version": "0.5.14Alpha20190821",
|
||||
"update_link": "https://canvasblocker.kkapsner.de/versions/canvasblocker_beta-0.5.14Alpha20190821-an+fx.xpi"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user