aboutsummaryrefslogtreecommitdiffstats
path: root/packages/dev-tools-pages/ts/globalStyles.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'packages/dev-tools-pages/ts/globalStyles.tsx')
-rw-r--r--packages/dev-tools-pages/ts/globalStyles.tsx122
1 files changed, 62 insertions, 60 deletions
diff --git a/packages/dev-tools-pages/ts/globalStyles.tsx b/packages/dev-tools-pages/ts/globalStyles.tsx
index 13ecde7aa..f51ea4b1d 100644
--- a/packages/dev-tools-pages/ts/globalStyles.tsx
+++ b/packages/dev-tools-pages/ts/globalStyles.tsx
@@ -6,75 +6,77 @@ import hljsStyles from 'highlight.js/styles/github-gist.css';
import { withContext } from 'ts/components/withContext';
const BaseStyles = createGlobalStyle`
- ${styledNormalize}
- ${hljsStyles}
+ ${styledNormalize}
+ ${hljsStyles}
- @font-face {
- font-family: "Maison Neue";
- src: url("/fonts/MaisonNeue-Book-subset.woff2") format("woff2"), url("/fonts/MaisonNeue-Book-subset.woff") format("woff");
- font-weight: 300;
- font-display: swap;
- unicode-range: U+20-7E;
- }
- @font-face {
- font-family: "Maison Neue";
- src: url("/fonts/MaisonNeue-Bold-subset.woff2") format("woff2"), url("/fonts/MaisonNeue-Bold-subset.woff") format("woff");
- font-weight: 500;
- font-display: swap;
- unicode-range: U+20-7E;
- }
- @font-face {
- font-family: "Maison Neue Mono";
- src: url("/fonts/MaisonNeue-Mono-subset.woff2") format("woff2"), url("/fonts/MaisonNeue-Mono-subset.woff") format("woff");
- font-weight: 300;
- font-display: optional;
- unicode-range: U+20-7E;
- }
-
- html {
- font-size: 100%;
- box-sizing: border-box;
- }
-
- *, *::before, *::after {
- box-sizing: inherit;
- }
-
- body {
- font-family: "Maison Neue", system-ui, sans-serif;
- font-weight: 300;
- font-size: 1rem;
- line-height: 1.8;
+ @font-face {
+ font-family: "Maison Neue";
+ src: url("/fonts/MaisonNeue-Book-subset.woff2") format("woff2"), url("/fonts/MaisonNeue-Book-subset.woff") format("woff");
+ font-weight: 300;
+ font-display: swap;
+ unicode-range: U+20-7E;
+ }
+ @font-face {
+ font-family: "Maison Neue";
+ src: url("/fonts/MaisonNeue-Bold-subset.woff2") format("woff2"), url("/fonts/MaisonNeue-Bold-subset.woff") format("woff");
+ font-weight: 500;
+ font-display: swap;
+ unicode-range: U+20-7E;
+ }
+ @font-face {
+ font-family: "Maison Neue Mono";
+ src: url("/fonts/MaisonNeue-Mono-subset.woff2") format("woff2"), url("/fonts/MaisonNeue-Mono-subset.woff") format("woff");
+ font-weight: 300;
+ font-display: optional;
+ unicode-range: U+20-7E;
+ }
- ${media.small`font-size: 0.875rem;`};
+ html {
+ font-size: 100%;
+ box-sizing: border-box;
+ }
+
+ *, *::before, *::after {
+ box-sizing: inherit;
+ }
+
+ body {
+ font-family: "Maison Neue", system-ui, sans-serif;
+ font-weight: 300;
+ font-size: 1rem;
+ line-height: 1.8;
- }
+ ${media.small`font-size: 0.875rem;`};
+ }
- a {
- color: ${(props: any) => props.colors.link};
- text-decoration: none;
+ a {
+ color: ${(props: any) => props.colors.link};
+ text-decoration: none;
- &:hover {
- color: red; //what should this be?
+ &:hover {
+ color: red; //what should this be?
+ }
+ }
+
+ h1, h2, h3, h4 {
+ font-weight: 500;
+ margin: 0;
}
- }
-
- h1, h2, h3, h4 {
- font-weight: 500;
- margin: 0;
- }
- p {
- margin-top: 0;
- margin-bottom: 1em;
- &:not([class]):last-of-type {
- margin-bottom: 0;
+ p {
+ margin-top: 0;
+ margin-bottom: 1em;
+ &:not([class]):last-of-type {
+ margin-bottom: 0;
+ }
}
- }
- code {
- font-family: "Maison Neue Mono", monospace;
- }
+ code {
+ font-family: "Maison Neue Mono", monospace;
+ ${media.small`
+ font-size: .75rem;
+ `}
+ }
`;
export default withContext(BaseStyles);