diff --git a/package.json b/package.json index f88dd756..4ea713ff 100644 --- a/package.json +++ b/package.json @@ -146,6 +146,7 @@ "postcss": "^8.4.38", "postcss-loader": "^8.1.1", "postcss-preset-mantine": "^1.14.4", + "postcss-remove-declaration": "^1.1.0", "prettier": "^3.2.5", "react": "^18.2.0", "react-dom": "^18.2.0", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 6968c410..9f6e4ac6 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -211,6 +211,9 @@ devDependencies: postcss-preset-mantine: specifier: ^1.14.4 version: 1.14.4(postcss@8.4.38) + postcss-remove-declaration: + specifier: ^1.1.0 + version: 1.1.0 prettier: specifier: ^3.2.5 version: 3.2.5 @@ -11764,6 +11767,10 @@ packages: through2: 2.0.5 dev: true + /picocolors@0.2.1: + resolution: {integrity: sha512-cMlDqaLEqfSaW8Z7N5Jw+lyIW869EzT73/F5lhtY9cLGoVxSXznfgfXMO0Z5K0o0Q2TkTXq+0KFsdnSe3jDViA==} + dev: true + /picocolors@1.0.0: resolution: {integrity: sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ==} dev: true @@ -11953,6 +11960,12 @@ packages: postcss-nested: 6.0.1(postcss@8.4.38) dev: true + /postcss-remove-declaration@1.1.0: + resolution: {integrity: sha512-GWQNWeyHg+HjhB6cUH+/2+bsyWt35H8GX8hcZiXApOK309VGwLIiyfbfjnMaf56WvDMEnLE/anLGYhuH2exbbA==} + dependencies: + postcss: 7.0.39 + dev: true + /postcss-selector-parser@6.0.13: resolution: {integrity: sha512-EaV1Gl4mUEV4ddhDnv/xtj7sxwrwxdetHdWUGnT4VJQf+4d05v6lHYZr8N573k5Z0BViss7BDhfWtKS3+sfAqQ==} engines: {node: '>=4'} @@ -11974,6 +11987,14 @@ packages: resolution: {integrity: sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ==} dev: true + /postcss@7.0.39: + resolution: {integrity: sha512-yioayjNbHn6z1/Bywyb2Y4s3yvDAeXGOyxqD+LnVOinq6Mdmd++SW2wUNVzavyyHxd6+DxzWGIuosg6P1Rj8uA==} + engines: {node: '>=6.0.0'} + dependencies: + picocolors: 0.2.1 + source-map: 0.6.1 + dev: true + /postcss@8.4.38: resolution: {integrity: sha512-Wglpdk03BSfXkHoQa3b/oulrotAkwrlLDRSOb9D0bN86FdRyE9lppSp33aHNPgBa0JKCoB+drFLZkQoRRYae5A==} engines: {node: ^10 || ^12 || >=14} diff --git a/postcss.config.js b/postcss.config.js index 45c696e8..cea95647 100644 --- a/postcss.config.js +++ b/postcss.config.js @@ -1,5 +1,10 @@ module.exports = { plugins: { 'postcss-preset-mantine': {}, + 'postcss-remove-declaration': { + remove: { + body: '*', + }, + }, }, }; diff --git a/src/DevTools/styles.css b/src/DevTools/styles.css index a584673f..555f8f5b 100644 --- a/src/DevTools/styles.css +++ b/src/DevTools/styles.css @@ -11,4 +11,15 @@ color: light-dark(var(--mantine-color-black), var(--mantine-color-white)); --webkit-font-smoothing: antialiased; font-size: var(--mantine-font-size-md); + font-family: var(--mantine-font-family); + line-height: var(--mantine-line-height); + background-color: var(--mantine-color-body); + color: var(--mantine-color-text); + + -webkit-font-smoothing: var(--mantine-webkit-font-smoothing); + -moz-osx-font-smoothing: var(--mantine-moz-font-smoothing); + + @media screen and (max-device-width: em(500px)) { + -webkit-text-size-adjust: 100%; + } }