trisquel-icecat/icecat/extensions/gnu/jsr@javascriptrestrictor/options.css

/*
 * SPDX-FileCopyrightText: 2021-2019 Libor Polčák
 * SPDX-FileCopyrightText: 2021-2019 Martin Timko
 * SPDX-FileCopyrightText: 2022-2021 Marek Saloň 
 *
 * SPDX-License-Identifier: GPL-3.0-or-later
 */

body {
	display: grid;
	grid-template-columns: 10em 1fr;
	grid-template-areas: 
	      "logo     content"
	      "menu     content"
	      "versions content"
	      "footer   footer";
	grid-gap: 3em;
}

section.logo {
	grid-area: logo;
}
nav.menu {
	grid-area: menu;
}
section.content {
	grid-area: content;
}
section.versions {
	grid-area: versions;
}
footer {
	grid-area: footer;
}

@media (max-width: 600px) {
	body {
		/*  Redefine the grid into a single column layout. */
		grid-template-columns: 1fr;
		grid-template-areas: 
			"content"
			"menu"
			"logo"
			"versions"
			"footer";
	}
}

@media (min-width: 1300px) {
	body {
		/*  Redefine the grid into a three column layout with empty space on the left and right. */
		grid-template-columns: 1fr 10em 1000px 10% 1fr;
		grid-template-areas: 
			"left-empty logo content right-empty"
			"left-empty menu content right-empty"
			"left-empty menu footer  right-empty"
	}
	section.logo {
		padding-top: 3em;
	}
}

section.logo img {
	display: block;
	margin-left: auto;
	margin-right: auto;
	background-color: white;
}

nav.menu {
	font-family: sans-serif;
}

@media (min-width: 601px) {
	nav.menu {
		padding-top: 3em;
	}
}

nav.menu ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
}

nav.menu {
	color: var(--title-color);
	background-color: var(--menu-background);
}

nav.menu ul ul {
	padding-left: 1em;
}

nav.menu ul p:after {
	content: "__MSG_ExternalLinksSeparator__";
}

nav.menu ul a:visited, nav.menu ul a, nav.menu ul p {
	color: var(--menu-color);
	background-color: var(--menu-background);
	font-weight: bold;
	display: block;
	text-decoration: none;
	padding-top: 1ex;
	padding-bottom: 1ex;
	padding-right: 1em;
	padding-left: 1em;
	margin: 0;
}

nav.menu ul a:hover {
	color: var(--light-logo-contrast);
	background-color: var(--light-logo);
}

section.content {
	text-align: justify;
}

section.content section#configuration_area #tweaks div.more, section.content div.tweakgrid div.more {
	text-align: left;
}

.main-section {
	padding: 0.5em;
}

.main-section + div:not(.main-section) {
	padding-top: 0em;
	padding-left: 3em;
	padding-bottom: 1em;
}

#levels-list li, #domain-level-list li {
	list-style-type: none;
	margin: 0px;
	padding-top: 0.5em;
}

.level {
	margin: 0px;
	padding: 0.5em;
}

.undo {
	background-color: var(--attention-background);
	color: var(--attention-color);
	font-weight: bold;
}

.undo a, .alert a {
	color: var(--attention-color);
}

.alert{
	padding: 1em;
}

.hidden{
	display: none;
}

.domain {
	font-weight: bold;
	font-size: large;
}

.tweakgrid, #tweaks {
	display: grid;
	grid: auto / auto auto 5ex 1fr;
	gap: 1em;
	align-items: center;
}

#proxy-protection-config, #fingerprinting-protection-config
{
	display:flex;
	flex-direction: column;
}

#nbs-whitelist-select, #fpd-whitelist-select
{
	width:40%;
	max-width: 400px;
	min-width: 200px;
	font-size: 12pt;
	margin-bottom:3px;
	margin-top: 3px;
}

#nbs-whitelist-input, #fpd-whitelist-input
{
	width: 39.5%;
	max-width: 394px;
	min-width: 194px;
	font-size: 12pt;
}

.unsupported_api {
	color: var(--good-news);
}

.notsupportedapis {
	display: none;
}

section#sect-devel {
	display: none;
}

button.level {
	min-width: 80%;
	max-width: 80%;
}
label.level_button_descr {
	display: inline-block;
	width: 80%;
}

#levels-storage-text {
	width: 100%;
	height: 50ex;
}

fieldset {
	border: 0;
}

.more + .less {
	display: none;
}

#current-level-tweaks input[type=range], #builtin-jss-tweaks input[type=range] {
	pointer-events:none; /* do not allow modifications, https://developer.mozilla.org/en-US/docs/Web/CSS/pointer-events */
}

.protection-title {
	display: flex;
	align-items:center;
}

.protection-title > .shield-onoff-label {
	padding-right: 10px;
}

#jss-shield-settings {
	display: flex;
}

.jss-shield-settings-item {
	flex: 1;
}

#current-level-tweaks-detail {
	flex: 2;
}

form {
	margin: 2em;
}

#builtin-jss-tweaks {
	display: grid;
	grid-template-columns: auto auto auto auto;
	column-gap: 3em;
	row-gap: 3ex;
}

#builtin-jss-tweaks span {
	text-align: left;
}

#builtin-jss-tweaks .tweak_domain {
	color: var(--title-color);
}