From b8bada6e4e9fb185ace04e1a1c7c1d25c0f1980f Mon Sep 17 00:00:00 2001 From: David Grudl Date: Mon, 16 Oct 2023 21:45:31 +0200 Subject: [PATCH] css: unified spaces to --tracy-space & top margin --- src/Tracy/Bar/assets/bar.css | 24 +++++++---- src/Tracy/BlueScreen/assets/bluescreen.css | 48 ++++++++-------------- src/Tracy/Dumper/assets/dumper-dark.css | 4 +- src/Tracy/Dumper/assets/dumper-light.css | 4 +- src/Tracy/assets/reset.css | 10 +++++ 5 files changed, 46 insertions(+), 44 deletions(-) diff --git a/src/Tracy/Bar/assets/bar.css b/src/Tracy/Bar/assets/bar.css index f498554f6..4687dfb56 100644 --- a/src/Tracy/Bar/assets/bar.css +++ b/src/Tracy/Bar/assets/bar.css @@ -4,6 +4,7 @@ /* common styles */ #tracy-debug { + --tracy-space: 10px; display: none; direction: ltr; } @@ -34,10 +35,16 @@ body#tracy-debug { /* in popup window */ font-weight: bold; } -#tracy-debug h2, -#tracy-debug h3, -#tracy-debug p { - margin: .4em 0; +#tracy-debug :where(:is( + h1, h2, h3, h4, h5, h6, + p, + ol, ul, dl, + pre, table, hr, + .tracy-inner, + .tracy-inner-container, + .tracy-inner-container > * +):not(:first-child)) { + margin-top: var(--tracy-space); } #tracy-debug table { @@ -112,6 +119,7 @@ body#tracy-debug { /* in popup window */ #tracy-debug-bar .tracy-row { list-style: none none; display: flex; + margin: 0; } #tracy-debug-bar .tracy-row:not(:first-child) { @@ -187,9 +195,9 @@ body#tracy-debug .tracy-panel { /* in popup window */ #tracy-debug h1 { font: normal normal 23px/1.4 Tahoma, sans-serif; + line-height: 1; color: #575753; - margin: -5px -5px 5px; - padding: 0 5px 0 5px; + margin: 0; word-wrap: break-word; } @@ -218,7 +226,7 @@ body#tracy-debug .tracy-panel { /* in popup window */ #tracy-debug .tracy-mode-float { position: fixed; flex-direction: column; - padding: 10px; + padding: var(--tracy-space); min-width: 200px; min-height: 80px; border-radius: 5px; @@ -272,7 +280,7 @@ body#tracy-debug .tracy-panel { /* in popup window */ } #tracy-debug .tracy-mode-window { - padding: 10px; + padding: var(--tracy-space); } #tracy-debug .tracy-icons a { diff --git a/src/Tracy/BlueScreen/assets/bluescreen.css b/src/Tracy/BlueScreen/assets/bluescreen.css index c304eadcf..bbe86c943 100644 --- a/src/Tracy/BlueScreen/assets/bluescreen.css +++ b/src/Tracy/BlueScreen/assets/bluescreen.css @@ -2,16 +2,6 @@ * This file is part of the Tracy (https://tracy.nette.org) */ -:root { - --tracy-space: 16px; -} - -@media (max-width: 600px) { - :root { - --tracy-space: 8px; - } -} - html.tracy-bs-visible, html.tracy-bs-visible body { display: block; @@ -70,13 +60,15 @@ html.tracy-bs-visible body { display: none; } -#tracy-bs p, -#tracy-bs table, -#tracy-bs pre, -#tracy-bs h1, -#tracy-bs h2, -#tracy-bs h3 { - margin: 0 0 var(--tracy-space); +#tracy-bs :where(:is( + h1, h2, h3, h4, h5, h6, + p, + ol, ul, dl, + pre, table, hr, + .tracy-section-panel, + .tracy-pane +):not(:first-child)) { + margin-top: var(--tracy-space); } #tracy-bs h1 { @@ -92,7 +84,6 @@ html.tracy-bs-visible body { #tracy-bs h2 { font-size: 14pt; font-weight: normal; - margin-top: var(--tracy-space); } #tracy-bs h3 { @@ -188,14 +179,12 @@ html.tracy-bs-visible body { #tracy-bs .tracy-section { - padding-left: calc(1.5 * var(--tracy-space)); - padding-right: calc(1.5 * var(--tracy-space)); + padding: var(--tracy-space); } #tracy-bs .tracy-section-panel { background: #5040200E; - padding: var(--tracy-space) var(--tracy-space) 0; - margin: 0 0 var(--tracy-space); + padding: var(--tracy-space); border-radius: 8px; box-shadow: inset 1px 1px 0px 0 #00000005; overflow: hidden; @@ -215,7 +204,6 @@ html.tracy-bs-visible body { #tracy-bs .tracy-section--error { background: #CD1818; color: white; - padding-top: var(--tracy-space); } #tracy-bs .tracy-section--error p, @@ -266,8 +254,8 @@ html.tracy-bs-visible body { } #tracy-bs .tracy-caused { - margin: 0 calc(-1.5 * var(--tracy-space)); - padding: .3em calc(1.5 * var(--tracy-space)); + margin: var(--tracy-space) calc(-1 * var(--tracy-space)) calc(-1 * var(--tracy-space)); + padding: .3em var(--tracy-space); background: #df8075; white-space: nowrap; } @@ -342,20 +330,19 @@ html.tracy-bs-visible body { #tracy-bs .tracy-callstack { display: grid; + overflow: auto; grid-template-columns: max-content 1fr; - margin-bottom: calc(.5 * var(--tracy-space)); + row-gap: calc(.5 * var(--tracy-space)); } #tracy-bs .tracy-callstack-file { text-align: right; padding-right: var(--tracy-space); white-space: nowrap; - height: calc(1.5 * var(--tracy-space)); } #tracy-bs .tracy-callstack-callee { white-space: nowrap; - height: calc(1.5 * var(--tracy-space)); } #tracy-bs .tracy-callstack-additional { @@ -410,10 +397,7 @@ html.tracy-bs-visible body { margin: 0; width: 100%; font-size: 110%; -} - -#tracy-bs .tracy-tab-bar > *:not(:first-child) { - margin-left: var(--tracy-space); + column-gap: var(--tracy-space); } #tracy-bs .tracy-tab-bar a { diff --git a/src/Tracy/Dumper/assets/dumper-dark.css b/src/Tracy/Dumper/assets/dumper-dark.css index 349159e71..8346d7216 100644 --- a/src/Tracy/Dumper/assets/dumper-dark.css +++ b/src/Tracy/Dumper/assets/dumper-dark.css @@ -7,8 +7,8 @@ color: #f8f8f2; background: #29292e; border-radius: 4px; - padding: 1em; - margin: 1em 0; + padding: var(--tracy-space); + margin: var(--tracy-space) 0; word-break: break-all; white-space: pre-wrap; } diff --git a/src/Tracy/Dumper/assets/dumper-light.css b/src/Tracy/Dumper/assets/dumper-light.css index 963dfb8c4..fb865920d 100644 --- a/src/Tracy/Dumper/assets/dumper-light.css +++ b/src/Tracy/Dumper/assets/dumper-light.css @@ -7,8 +7,8 @@ color: #444; background: #fdf9e2; border-radius: 4px; - padding: 1em; - margin: 1em 0; + padding: var(--tracy-space); + margin: var(--tracy-space) 0; word-break: break-all; white-space: pre-wrap; } diff --git a/src/Tracy/assets/reset.css b/src/Tracy/assets/reset.css index e333f841e..b0a6a6fc8 100644 --- a/src/Tracy/assets/reset.css +++ b/src/Tracy/assets/reset.css @@ -2,6 +2,16 @@ * This file is part of the Tracy (https://tracy.nette.org) */ +:root { + --tracy-space: 16px; +} + +@media (max-width: 600px) { + :root { + --tracy-space: 8px; + } +} + tracy-div:not(a b), tracy-div:not(a b) * { font: inherit;