Source code
Revision control
Copy as Markdown
Other Tools
/* stylelint-disable max-nesting-depth */
.discoverystream-admin-toggle {
position: fixed;
top: 50px;
inset-inline-end: var(--space-xlarge);
border: 0;
background: none;
z-index: 4;
border-radius: 2px;
.icon-devtools {
background-image: url('chrome://global/skin/icons/developer.svg');
padding: 15px;
}
&:dir(rtl) {
transform: scaleX(-1);
}
&:hover {
background: var(--newtab-element-hover-color);
}
&.expanded {
background: $black-20;
}
}
.discoverystream-admin {
$border-color: var(--newtab-border-color);
$monospace: 'SF Mono', 'Monaco', 'Inconsolata', 'Fira Mono', 'Droid Sans Mono',
'Source Code Pro', monospace;
$sidebar-width: 240px;
position: fixed;
top: 0;
inset-inline-start: 0;
width: 100%;
background: var(--newtab-background-color);
height: 100%;
overflow-y: scroll;
margin: 0 auto;
font-size: 14px;
padding-inline-start: $sidebar-width;
color: var(--newtab-text-primary-color);
z-index: 3;
&.collapsed {
display: none;
}
.sidebar {
inset-inline-start: 0;
position: fixed;
width: $sidebar-width;
padding: 30px 20px;
ul {
margin: 0;
padding: 0;
list-style: none;
}
li a {
padding: 10px 34px;
display: block;
color: var(--lwt-sidebar-text-color);
&:hover {
background: var(--newtab-background-color-secondary);
}
}
}
h1 {
font-weight: 200;
font-size: 32px;
}
h2 .button,
p .button {
font-size: 14px;
padding: 6px 12px;
margin-inline-start: 5px;
margin-bottom: 0;
}
.general-textarea {
direction: ltr;
width: 740px;
height: 500px;
overflow: auto;
resize: none;
border-radius: 4px;
display: flex;
}
.wnp-textarea {
direction: ltr;
width: 740px;
height: 500px;
overflow: auto;
resize: none;
border-radius: 4px;
display: flex;
}
.json-button {
display: inline-flex;
font-size: 10px;
padding: 4px 10px;
margin-bottom: 6px;
margin-inline-end: 4px;
&:hover {
background-color: var(--newtab-element-hover-color);
box-shadow: none;
}
}
.toggle-wrapper {
margin-block: var(--space-large);
width: 200px;
}
.details-section {
margin-block: var(--space-large);
summary {
font-size: var(--font-size-large);
}
}
table {
border-collapse: collapse;
width: 100%;
&.minimal-table {
border-collapse: collapse;
border: 1px solid $border-color;
td {
padding: 8px;
}
td:first-child {
width: 1%;
white-space: nowrap;
}
td:not(:first-child) {
font-family: $monospace;
}
}
&.errorReporting {
tr {
border: 1px solid var(--newtab-background-color-secondary);
}
td {
padding: 4px;
&[rowspan] {
border: 1px solid var(--newtab-background-color-secondary);
}
}
}
}
.large-data-container {
max-height: 500px;
overflow-y: scroll;
}
.sourceLabel {
background: var(--newtab-background-color-secondary);
padding: 2px 5px;
border-radius: 3px;
&.isDisabled {
background: $email-input-invalid;
color: var(--newtab-status-error);
}
}
.message-item {
&:first-child td {
border-top: 1px solid $border-color;
}
td {
vertical-align: top;
padding: 8px;
border-bottom: 1px solid $border-color;
&.min {
width: 1%;
white-space: nowrap;
}
&.message-summary {
width: 60%;
}
&.button-column {
width: 15%;
}
&:first-child {
border-inline-start: 1px solid $border-color;
}
&:last-child {
border-inline-end: 1px solid $border-color;
}
}
&.blocked {
.message-id,
.message-summary {
opacity: 0.5;
}
.message-id {
opacity: 0.5;
}
}
.message-id {
font-family: $monospace;
font-size: 12px;
}
}
.providerUrl {
font-size: 12px;
}
pre {
background: var(--newtab-background-color-secondary);
margin: 0;
padding: 8px;
font-size: 12px;
max-width: 750px;
overflow: auto;
font-family: $monospace;
}
.errorState {
border: $input-error-border;
}
.helpLink {
padding: 10px;
display: flex;
background: $black-10;
border-radius: 3px;
align-items: center;
a {
text-decoration: underline;
}
.icon {
min-width: 18px;
min-height: 18px;
}
}
.ds-component {
margin-bottom: 20px;
}
.modalOverlayInner {
height: 80%;
}
.clearButton {
border: 0;
padding: 4px;
border-radius: 4px;
display: flex;
&:hover {
background: var(--newtab-element-hover-color);
}
}
.collapsed {
display: none;
}
.icon {
display: inline-table;
cursor: pointer;
width: 18px;
height: 18px;
}
.button {
&:disabled,
&:disabled:active {
opacity: 0.5;
cursor: unset;
box-shadow: none;
}
}
.impressions-section {
display: flex;
flex-direction: column;
gap: 16px;
.impressions-item {
display: flex;
flex-flow: column nowrap;
padding: 8px;
border: 1px solid $border-color;
border-radius: 5px;
.impressions-inner-box {
display: flex;
flex-flow: row nowrap;
gap: 8px;
}
.impressions-category {
font-size: 1.15em;
white-space: nowrap;
flex-grow: 0.1;
}
.impressions-buttons {
display: flex;
flex-direction: column;
gap: 8px;
button {
margin: 0;
}
}
.impressions-editor {
display: flex;
flex-grow: 1.5;
.general-textarea {
width: auto;
flex-grow: 1;
}
}
}
}
.weather-section {
margin-block-end: 24px;
form {
display: flex;
label {
margin-inline-end: 12px;
}
}
}
}