Source code
Revision control
Copy as Markdown
Other Tools
/* This Source Code Form is subject to the terms of the Mozilla Public
* License, v. 2.0. If a copy of the MPL was not distributed with this
.status-code {
/* non-standard codes may be shorter than 3 characters but should match
width of standard codes */
min-width: calc(3ch + 4px);
padding: 0 2px;
border-radius: 3px;
text-align: center;
font-family: var(--monospace-font-family);
/* prevent status code from having full line height width from .request-list-item */
line-height: normal;
}
.status-code[data-code^="1"] {
background-color: var(--status-code-color-1xx);
}
.status-code[data-code^="2"] {
background-color: var(--status-code-color-2xx);
}
.status-code[data-code^="3"] {
background-color: var(--status-code-color-3xx);
}
.status-code[data-code^="4"] {
background-color: var(--status-code-color-4xx);
}
.status-code[data-code^="5"] {
background-color: var(--status-code-color-5xx);
}
/* Non-standard status codes are styled like 5XX */
.status-code[data-code^="0"],
.status-code[data-code^="6"],
.status-code[data-code^="7"],
.status-code[data-code^="8"],
.status-code[data-code^="9"] {
background-color: var(--status-code-color-5xx);
}
.status-code:not([data-code^="3"], .status-code-blocked) {
color: var(--theme-body-background);
}
.status-code-blocked {
color: var(--theme-icon-error-color);
}
.status-code-blocked-icon {
height: 12px;
width: 12px;
-moz-context-properties: fill;
fill: currentColor;
}
/* Status codes for the headers side panel */
.headers-overview .summary .status .status-code {
display: inline;
background-color: transparent;
color: inherit;
padding: 0 2px 0 0;
font-weight: bold;
}
.headers-overview .summary .status[data-code^="1"] {
color: var(--status-code-color-1xx);
}
.headers-overview .summary .status[data-code^="2"] {
color: var(--status-code-color-2xx);
}
.headers-overview .summary .status[data-code^="3"] {
color: inherit;
}
.headers-overview .summary .status[data-code^="4"] {
color: var(--status-code-color-4xx);
}
.headers-overview .summary .status[data-code^="5"] {
color: var(--status-code-color-5xx);
}
/* Non-standard status codes are styled like 5XX */
.headers-overview .summary .status[data-code^="0"],
.headers-overview .summary .status[data-code^="6"],
.headers-overview .summary .status[data-code^="7"],
.headers-overview .summary .status[data-code^="8"],
.headers-overview .summary .status[data-code^="9"] {
color: var(--status-code-color-5xx);
}