css: unified spaces to --tracy-space & top margin

nette · Oct 16, 2023 · 0f7498c · 0f7498c
1 parent ac18b0d
commit 0f7498c
Show file tree

Hide file tree

Showing 5 changed files with 45 additions and 44 deletions.
diff --git 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
@@ -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;
 }
@@ -343,19 +331,17 @@ html.tracy-bs-visible body {
 #tracy-bs .tracy-callstack {
 	display: grid;
 	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 +396,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
@@ -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
@@ -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
@@ -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;