Skip to content

Commit 33cd6e8

Browse files
committed
rev html
1 parent ad44845 commit 33cd6e8

9 files changed

Lines changed: 71 additions & 83 deletions

File tree

demo/demo.php

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -38,9 +38,9 @@ function stripLocal(string $document): string
3838
'name' => 'Rodolfo',
3939
'role' => 'admin',
4040
];
41-
$handler = $handler
42-
->withPutExtra('Path', '/admin/settings')
43-
->withPutExtra('Payload', var_export($payload, true));
41+
// $handler = $handler
42+
// ->withPutExtra('Path', '/admin/settings')
43+
// ->withPutExtra('Payload', var_export($payload, true));
4444
$console = new ConsoleDocument($handler);
4545
$plain = new PlainDocument($handler);
4646
$html = new HtmlDocument(
@@ -49,6 +49,8 @@ function stripLocal(string $document): string
4949
$htmlSilent = new HtmlDocument(
5050
$handler
5151
->withIsDebug(false)
52+
->withPutExtra('Seccion 1', '<p>Algo se fue a la chucha</p>')
53+
->withPutExtra('Seccion 2', '<p>Algo se fue a la chucha</p>')
5254
->withTitle('Algo se fue a la chucha')
5355
->withMessage(
5456
<<<PLAIN

demo/output/console.log

Lines changed: 2 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -6,19 +6,10 @@
66
# Message 
77
Don't **panic** this is just a `drill`.
88

9-
# Path
10-
/admin/settings
11-
12-
# Payload
13-
array (
14-
'name' => 'Rodolfo',
15-
'role' => 'admin',
16-
)
17-
189
# Time
19-
2026-03-07T17:37:15+00:00 [1772905035]
10+
2026-03-07T18:27:57+00:00 [1772908077]
2011

21-
# Incident 69ac624b3b04f
12+
# Incident 69ac6e2d2ca49
2213

2314
# Backtrace
2415
------------------------------------------------------------

demo/output/html-silent.html

Lines changed: 6 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -2,16 +2,13 @@
22
<head>
33
<meta charset="utf-8">
44
<meta name="viewport" content="width=device-width, initial-scale=1">
5-
<style>html, body { min-height: 100%; height: auto; } html { color: #000; font: 16px Helvetica, Arial, sans-serif; line-height: 1.2; background: #FFF; } .body--block { margin: 20px; } .body--flex { margin: 0; display: flex; align-items: center; justify-content: center; flex-direction: column; min-height: 100vh; } .user-select-none { -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .user-select-all { -webkit-touch-callout: all; -webkit-user-select: all; -moz-user-select: all; -ms-user-select: all; user-select: all; } main { background: none; display: block; padding: 0; margin: 0; border: 0; width: 470px; } .body--block main { margin: 0 auto; } @media (min-width: 768px) { body { background: #2a97ff; background: linear-gradient(to bottom, #00e97e 0%, #2a97ff 100%); background-attachment: fixed; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#2a97ff", endColorstr="#00e97e", GradientType=0); } main { padding: 20px; } } .main--stack { width: 100%; max-width: 900px; } .hr { display: block; height: 1px; color: transparent; background: transparent; margin-bottom: -1px; } .hr>span { opacity: 0; line-height: 0; } .main--stack hr:last-of-type { margin-bottom: 0; } .title { font-weight: 800; margin-bottom: 5px; } .title--scream { font-size: 2.25em; margin-bottom: 0; } .title--scream span { font-size: 0.667em; font-weight: 400; } .title--scream span::before { white-space: pre; content: "\A"; } .hide { width: 0; height: 0; opacity: 0; } .title>.hide { display: block; float: left; } .content code, .pre { padding: 1px 4px; background-color: hsl(192, 15.2%, 93.5%); border: 1px solid hsl(204, 8.2%, 76.1%); font-size: 0.9em; font-family: "Fira Code Retina", "Operator Mono", Inconsolata, Consolas, monospace, sans-serif; line-height: 1; } .pre { overflow: auto; word-wrap: break-word; white-space: pre-line; display: block; margin: 0; padding: 10px; border: 1px solid hsl(192, 15%, 84%); word-break: break-all; } .pre.pre--stack-entry { border: 0; color: #ecf0f1; background: hsl(210, 29%, 24%); line-height: normal; } .pre.pre--stack-entry.entry--even { background: hsl(210, 29%, 29%); } main>div { padding: 20px; background: #fff; } main>div, main>div>* { word-break: break-word; white-space: normal; } @media (min-width: 768px) { main>div { box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, 0.09); border-radius: 0.2857em; } } main>div> :first-child { margin-top: 0; } main>div> :last-child { margin-bottom: 0; } .note { margin: 1em 0; } .backtrace { min-height: 3.375em; max-height: -webkit-max-content; max-height: -moz-max-content; max-height: max-content; resize: vertical; overflow: auto; } .backtrace .hr:last-child { display: none; } @media (prefers-color-scheme: light) { :root { --textColor: #24292f; --backgroundColor: #f2f5f8; --inlineColor: #c4c5c7; } } @media (prefers-color-scheme: dark) { :root { --textColor: #ecf0f1; --backgroundColor: #132537; --inlineColor: #323e4a; } } html.chv-dump { background: var(--backgroundColor); } pre.chv-dump { font-size: 14px; font-family: 'Fira Code Retina', 'Operator Mono', Inconsolata, Menlo, Monaco, Consolas, monospace; line-height: normal; color: var(--textColor); padding: 1.25em; margin: 0.8em 0; word-break: break-word; white-space: pre-wrap; background: var(--backgroundColor); display: block; text-align: left; border: none; border-radius: 0.2857em; } .chv-dump-hr { opacity: 0.25; } .chv-dump-inline { border-left: 1px solid var(--inlineColor); } .chv-dump-details { line-height: normal; display: block; margin-top: -1.242857em; } * > .chv-dump-details:not(:last-child) { margin-bottom: -1.242857em; } .chv-dump-summary { height: 1.242857em; margin-left: -0.8em; position: relative; } .chv-dump-summary:hover { background: rgba(255, 255, 255, 0.1); } .chv-dump-summary::-webkit-details-marker { margin-top: 0.3em; } .chv-dump-float { color: #ff8700; } .chv-dump-int { color: #ff8700; } .chv-dump-string { color: #ff8700; } .chv-dump-bool { color: #ff8700; } .chv-dump-null { color: #ff8700; } .chv-dump-object { color: #fabb00; } .chv-dump-array { color: #27ae60; } .chv-dump-resource { color: #ff5f5f; } .chv-dump-file { color: #87afff; } .chv-dump-class { color: #fabb00; } .chv-dump-operator { color: #6c6c6c; } .chv-dump-function { color: #00afff; } .chv-dump-variable { color: #00afff; } .chv-dump-modifier { color: #d75fd7; } .chv-dump-emphasis { color: rgb(108 108 108 / 65%); }</style>
5+
<style>html, body { min-height: 100%; height: auto; } html { color: #000; font: 16px Helvetica, Arial, sans-serif; line-height: 1.2; background: #FFF; } .body--block { margin: 20px; } .body--flex { margin: 0; display: flex; align-items: center; justify-content: center; flex-direction: column; min-height: 100vh; } .user-select-none { -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .user-select-all { -webkit-touch-callout: all; -webkit-user-select: all; -moz-user-select: all; -ms-user-select: all; user-select: all; } main { background: none; display: block; padding: 0; margin: 0; border: 0; width: 470px; } .body--block main { margin: 0 auto; } @media (min-width: 768px) { body { background: #2a97ff; background: linear-gradient(to bottom, #00e97e 0%, #2a97ff 100%); background-attachment: fixed; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#2a97ff", endColorstr="#00e97e", GradientType=0); } main { padding: 20px; } } .main--stack { width: 100%; max-width: 900px; } .hr { display: block; height: 1px; color: transparent; background: transparent; margin-bottom: -1px; } .hr>span { opacity: 0; line-height: 0; } .main--stack hr:last-of-type { margin-bottom: 0; } .title { font-weight: 800; margin-bottom: 5px; } .title--scream { font-size: 2.25em; margin-bottom: 0; } .title--scream span { font-size: 0.667em; font-weight: 400; } .title--scream span::before { white-space: pre; content: "\A"; } .hide { width: 0; height: 0; opacity: 0; } .title>.hide { display: block; float: left; } .content code, .pre { padding: 1px 4px; background-color: hsl(192, 15.2%, 93.5%); border: 1px solid hsl(204, 8.2%, 76.1%); font-size: 0.9em; font-family: "Fira Code Retina", "Operator Mono", Inconsolata, Consolas, monospace, sans-serif; line-height: 1; } .pre { overflow: auto; word-wrap: break-word; white-space: pre-line; display: block; margin: 0; padding: 10px; border: 1px solid hsl(192, 15%, 84%); word-break: break-all; } .pre.pre--stack-entry { border: 0; color: #ecf0f1; background: hsl(210, 29%, 24%); line-height: normal; } .pre.pre--stack-entry.entry--even { background: hsl(210, 29%, 29%); } .block *:last-child { margin-bottom: 0; } /* body>main>div>div:last-child *:last-child { margin-bottom: 0; } */ main>div { padding: 20px; background: #fff; } main>div, main>div>* { word-break: break-word; white-space: normal; } @media (min-width: 768px) { main>div { box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, 0.09); border-radius: 0.2857em; } } main>div> :first-child { margin-top: 0; } main>div> :last-child { margin-bottom: 0; } .note { margin: 1em 0; } .backtrace { min-height: 3.375em; max-height: -webkit-max-content; max-height: -moz-max-content; max-height: max-content; resize: vertical; overflow: auto; } .backtrace .hr:last-child { display: none; } @media (prefers-color-scheme: light) { :root { --textColor: #24292f; --backgroundColor: #f2f5f8; --inlineColor: #c4c5c7; } } @media (prefers-color-scheme: dark) { :root { --textColor: #ecf0f1; --backgroundColor: #132537; --inlineColor: #323e4a; } } html.chv-dump { background: var(--backgroundColor); } pre.chv-dump { font-size: 14px; font-family: 'Fira Code Retina', 'Operator Mono', Inconsolata, Menlo, Monaco, Consolas, monospace; line-height: normal; color: var(--textColor); padding: 1.25em; margin: 0.8em 0; word-break: break-word; white-space: pre-wrap; background: var(--backgroundColor); display: block; text-align: left; border: none; border-radius: 0.2857em; } .chv-dump-hr { opacity: 0.25; } .chv-dump-inline { border-left: 1px solid var(--inlineColor); } .chv-dump-details { line-height: normal; display: block; margin-top: -1.242857em; } * > .chv-dump-details:not(:last-child) { margin-bottom: -1.242857em; } .chv-dump-summary { height: 1.242857em; margin-left: -0.8em; position: relative; } .chv-dump-summary:hover { background: rgba(255, 255, 255, 0.1); } .chv-dump-summary::-webkit-details-marker { margin-top: 0.3em; } .chv-dump-float { color: #ff8700; } .chv-dump-int { color: #ff8700; } .chv-dump-string { color: #ff8700; } .chv-dump-bool { color: #ff8700; } .chv-dump-null { color: #ff8700; } .chv-dump-object { color: #fabb00; } .chv-dump-array { color: #27ae60; } .chv-dump-resource { color: #ff5f5f; } .chv-dump-file { color: #87afff; } .chv-dump-class { color: #fabb00; } .chv-dump-operator { color: #6c6c6c; } .chv-dump-function { color: #00afff; } .chv-dump-variable { color: #00afff; } .chv-dump-modifier { color: #d75fd7; } .chv-dump-emphasis { color: rgb(108 108 108 / 65%); }</style>
66
</head>
7-
<body class="body--flex"><main><div><div class="title title--scream">Algo se fue a la chucha</div><p>¡La vendimos! Ya estamos trabajando para resolver este problema.</p><div><span class="user-select-all">2026-03-07T17:37:15+00:00</span><span class="user-select-all">ID 69ac624b3b04f</span></div>
7+
<body class="body--flex"><main><div><div class="title title--scream"><span class="hide">#&nbsp;</span>Algo se fue a la chucha</div><p>¡La vendimos! Ya estamos trabajando para resolver este problema.</p><div><span class="user-select-all">2026-03-07T18:27:57+00:00</span><span class="user-select-all">ID 69ac6e2d2ca49</span></div>
88
<br>
9-
<div class="title"><span class="hide">#&nbsp;</span>Path</div>
10-
<div class="path">/admin/settings</div>
9+
<div class="title"><span class="hide">##&nbsp;</span>Seccion 1</div>
10+
<div class="block seccion-1"><p>Algo se fue a la chucha</p></div>
1111
<br>
12-
<div class="title"><span class="hide">#&nbsp;</span>Payload</div>
13-
<div class="payload">array (
14-
'name' => 'Rodolfo',
15-
'role' => 'admin',
16-
)</div></div></main></body>
12+
<div class="title"><span class="hide">##&nbsp;</span>Seccion 2</div>
13+
<div class="block seccion-2"><p>Algo se fue a la chucha</p></div></div></main></body>
1714
</html>

0 commit comments

Comments
 (0)