Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

fix: [DebugBar] scroll to top #8595

Merged
merged 5 commits into from
Mar 10, 2024
Merged

fix: [DebugBar] scroll to top #8595

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
d709e85
fix: [DebugBar] scroll to top on open/close
ddevsr Mar 1, 2024
91c3c59
change all href to role button
ddevsr Mar 2, 2024
e2c488b
style css and run sass
ddevsr Mar 2, 2024
1ceafd6
just element anchor in role button
ddevsr Mar 2, 2024
0fc5485
fix: make css button for vars
ddevsr Mar 8, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
41 changes: 23 additions & 18 deletions admin/css/debug-toolbar/toolbar.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,6 @@
@import '_mixins';
@import '_settings';


// DEBUG ICON
// ========================================================================== */

Expand All @@ -36,6 +35,8 @@
clear: both;
text-align: center;

cursor: pointer;

a svg {
margin: 8px;
max-width: 20px;
Expand All @@ -56,6 +57,10 @@
// DEBUG BAR
// ========================================================================== */

.debug-bar-vars {
cursor: pointer;
}

#debug-bar {
// Position
bottom: 0;
Expand Down Expand Up @@ -227,21 +232,21 @@
// The toolbar preferences
#toolbar-position,
#toolbar-theme {
a {
padding: 0 6px;
display: inline-flex;
vertical-align: top;
padding: 0 6px;
display: inline-flex;
vertical-align: top;
cursor: pointer;

&:hover {
text-decoration: none;
}
&:hover {
text-decoration: none;
}
}

// The "Open/Close" toggle
#debug-bar-link {
display: flex;
padding: 6px;
cursor: pointer;
}

// The toolbar menus
Expand Down Expand Up @@ -518,43 +523,43 @@
.debug-bar-dtableRow {
display: table-row;
}

.debug-bar-dinlineBlock {
display: inline-block;
}

.debug-bar-pointer {
cursor: pointer;
}

.debug-bar-mleft4 {
margin-left: 4px;
}

.debug-bar-level-0 {
--level: 0;
}

.debug-bar-level-1 {
--level: 1;
}

.debug-bar-level-2 {
--level: 2;
}

.debug-bar-level-3 {
--level: 3;
}

.debug-bar-level-4 {
--level: 4;
}

.debug-bar-level-5 {
--level: 5;
}

.debug-bar-level-6 {
--level: 6;
}
15 changes: 11 additions & 4 deletions system/Debug/Toolbar/Views/toolbar.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,7 @@
padding: 0px;
clear: both;
text-align: center;
cursor: pointer;
}
#debug-icon a svg {
margin: 8px;
Expand All @@ -31,6 +32,10 @@
display: none;
}

.debug-bar-vars {
cursor: pointer;
}

#debug-bar {
bottom: 0;
left: 0;
Expand Down Expand Up @@ -156,19 +161,21 @@
bottom: auto;
top: 36px;
}
#debug-bar #toolbar-position a,
#debug-bar #toolbar-theme a {
#debug-bar #toolbar-position,
#debug-bar #toolbar-theme {
padding: 0 6px;
display: inline-flex;
vertical-align: top;
cursor: pointer;
}
#debug-bar #toolbar-position a:hover,
#debug-bar #toolbar-theme a:hover {
#debug-bar #toolbar-position:hover,
#debug-bar #toolbar-theme:hover {
text-decoration: none;
}
#debug-bar #debug-bar-link {
display: flex;
padding: 6px;
cursor: pointer;
}
#debug-bar .ci-label {
display: inline-flex;
Expand Down
32 changes: 16 additions & 16 deletions system/Debug/Toolbar/Views/toolbar.tpl.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -27,21 +27,21 @@
<?= file_get_contents(__DIR__ . '/toolbar.js') ?>
</script>
<div id="debug-icon" class="debug-bar-ndisplay">
<a id="debug-icon-link" href="#">
<a id="debug-icon-link">
<svg xmlns="http://www.w3.org/2000/svg" version="1.0" viewBox="0 0 155 200"><defs/><path fill="#dd4814" d="M73.7 3.7c2.2 7.9-.7 18.5-7.8 29-1.8 2.6-10.7 12.2-19.7 21.3-23.9 24-33.6 37.1-40.3 54.4-7.9 20.6-7.8 40.8.5 58.2C12.8 180 27.6 193 42.5 198l6 2-3-2.2c-21-15.2-22.9-38.7-4.8-58.8 2.5-2.7 4.8-5 5.1-5 .4 0 .7 2.7.7 6.1 0 5.7.2 6.2 3.7 9.5 3 2.7 4.6 3.4 7.8 3.4 5.6 0 9.9-2.4 11.6-6.5 2.9-6.9 1.6-12-5-20.5-10.5-13.4-11.7-23.3-4.3-34.7l3.1-4.8.7 4.7c1.3 8.2 5.8 12.9 25 25.8 20.9 14.1 30.6 26.1 32.8 40.5 1.1 7.2-.1 16.1-3.1 21.8-2.7 5.3-11.2 14.3-16.5 17.4-2.4 1.4-4.3 2.6-4.3 2.8 0 .2 2.4-.4 5.3-1.4 24.1-8.3 42.7-27.1 48.2-48.6 1.9-7.6 1.9-20.2-.1-28.5-3.5-15.2-14.6-30.5-29.9-41.2l-7-4.9-.6 3.3c-.8 4.8-2.6 7.6-5.9 9.3-4.5 2.3-10.3 1.9-13.8-1-6.7-5.7-7.8-14.6-3.7-30.5 3-11.6 3.2-20.6.5-29.1C88.3 18 80.6 6.3 74.8 2.2 73.1.9 73 1 73.7 3.7z"/></svg>
</a>
</div>
<div id="debug-bar">
<div class="toolbar">
<span id="toolbar-position"><a href="#">&#8597;</a></span>
<span id="toolbar-theme"><a href="#">&#128261;</a></span>
<span id="toolbar-position">&#8597;</span>
<span id="toolbar-theme">&#128261;</span>
<span id="hot-reload-btn" class="ci-label">
<a id="debug-hot-reload" href="#" title="Toggle Hot Reload">
<a id="debug-hot-reload" title="Toggle Hot Reload">
<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAACXBIWXMAAAsTAAALEwEAmpwYAAABNklEQVR4nN2US04CQRCGv/DaiBxEvYWuBRPDKSCIXsCdcg0ULqTI8xIGN7JwTCU/ScV5tTO64Us6maSq/7+nuqvgkLgHopTl+QAWwBToAg3+wMTzM7YBrihp4jkCToEB8OJyRkCFAB5yDDxVoAd8OpNMOkrcAeMAgz3nzsQ0EqkDayXZqXy5Qugrdy2tGNdKeNWv40xCqGpvJK0YEwXt8ooylMZzUnCh4EkJgzNpmFaMrYLNEgbH0thmGVhSUVrSeE8KLv+7RBMFb0oY3EnDeihGN+WZhmJ7ZlnPtKHB5RvtNwy0d5XWaGgqRmp7a/9QLjRevoDLvOSRM+nnlKumk++0xwZlLhVnEulOhnohTS37vnU1t5M/ho7rPR03/LKW1bxNQep6ETZb5mpGW2/Ak2KpF3oYfAPX9Xpc671kqwAAAABJRU5ErkJggg==" />
</a>
</span>
<span class="ci-label">
<a href="#" data-tab="ci-timeline">
<a data-tab="ci-timeline">
<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAD7SURBVEhLY6ArSEtLK09NTbWHcvGC9PR0BaDaQiAdUl9fzwQVxg+AFvwHamqHcnGCpKQkeaDa9yD1UD09UCn8AKaBWJySkmIApFehi0ONwwRQBceBLurAh4FqFoHUAtkrgPgREN+ByYEw1DhMANVEMIhAYQ5U1wtU/wmILwLZRlAp/IBYC8gGw88CaFj3A/FnIL4ETDXGUCnyANSC/UC6HIpnQMXAqQXIvo0khxNDjcMEQEmU9AzDuNI7Lgw1DhOAJIEuhQcRKMcC+e+QNHdDpcgD6BaAANSSQqBcENFlDi6AzQKqgkFlwWhxjVI8o2OgmkFaXI8CTMDAAAAxd1O4FzLMaAAAAABJRU5ErkJggg==">
<span class="hide-sm"><?= $totalTime ?> ms &nbsp; <?= $totalMemory ?> MB</span>
</a>
Expand All @@ -50,7 +50,7 @@
<?php foreach ($collectors as $c) : ?>
<?php if (! $c['isEmpty'] && ($c['hasTabContent'] || $c['hasLabel'])) : ?>
<span class="ci-label">
<a href="#" data-tab="ci-<?= $c['titleSafe'] ?>">
<a data-tab="ci-<?= $c['titleSafe'] ?>">
<img src="<?= $c['icon'] ?>">
<span class="hide-sm">
<?= $c['title'] ?>
Expand All @@ -64,23 +64,23 @@
<?php endforeach ?>

<span class="ci-label">
<a href="#" data-tab="ci-vars">
<a data-tab="ci-vars">
<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAACLSURBVEhLYxgFJIHU1NSraWlp/6H4T0pKSjRUijoAyXAwBlrYDpViAFpmARQrJwZDtWACoCROC4D8CnR5XBiqBRMADfyNprgRKkUdAApzoCUdUNwE5MtApYYIALp6NBWBMVQLJgAaOJqK8AOgq+mSio6DggjEBtLUT0UwQ5HZIADkj6aiUTAggIEBANAEDa/lkCRlAAAAAElFTkSuQmCC">
<span class="hide-sm">Vars</span>
</a>
</span>

<h1>
<span class="ci-label">
<a href="#" data-tab="ci-config">
<a data-tab="ci-config">
<svg xmlns="http://www.w3.org/2000/svg" version="1.0" viewBox="0 0 155 200"><defs/><path fill="#dd4814" d="M73.7 3.7c2.2 7.9-.7 18.5-7.8 29-1.8 2.6-10.7 12.2-19.7 21.3-23.9 24-33.6 37.1-40.3 54.4-7.9 20.6-7.8 40.8.5 58.2C12.8 180 27.6 193 42.5 198l6 2-3-2.2c-21-15.2-22.9-38.7-4.8-58.8 2.5-2.7 4.8-5 5.1-5 .4 0 .7 2.7.7 6.1 0 5.7.2 6.2 3.7 9.5 3 2.7 4.6 3.4 7.8 3.4 5.6 0 9.9-2.4 11.6-6.5 2.9-6.9 1.6-12-5-20.5-10.5-13.4-11.7-23.3-4.3-34.7l3.1-4.8.7 4.7c1.3 8.2 5.8 12.9 25 25.8 20.9 14.1 30.6 26.1 32.8 40.5 1.1 7.2-.1 16.1-3.1 21.8-2.7 5.3-11.2 14.3-16.5 17.4-2.4 1.4-4.3 2.6-4.3 2.8 0 .2 2.4-.4 5.3-1.4 24.1-8.3 42.7-27.1 48.2-48.6 1.9-7.6 1.9-20.2-.1-28.5-3.5-15.2-14.6-30.5-29.9-41.2l-7-4.9-.6 3.3c-.8 4.8-2.6 7.6-5.9 9.3-4.5 2.3-10.3 1.9-13.8-1-6.7-5.7-7.8-14.6-3.7-30.5 3-11.6 3.2-20.6.5-29.1C88.3 18 80.6 6.3 74.8 2.2 73.1.9 73 1 73.7 3.7z"/></svg>
<?= $CI_VERSION ?>
</a>
</span>
</h1>

<!-- Open/Close Toggle -->
<a id="debug-bar-link" href="#" title="Open/Close">
<a id="debug-bar-link" role="button" title="Open/Close">
<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAEPSURBVEhL7ZVLDoJAEEThRuoGDwSEG+jCuFU34s3AK3APP1VDDSGMqI1xx0s6M/2rnlHEaMZElmWrPM+vsDvsYbQ7+us0TReSC2EBrEHxCevRYuppYLXkQpC8sVCuGfTvqSE3hFdFwUGuGfRvqSE35NUAfKZrbQNQm2jrMA+gOK+M+FmhDsRL5voHMA8gFGecq0JOXLWlQg7E7AMIxZnjOiZOEJ82gFCcedUE4gS56QP8yf8ywItz7e+RituKlkkDBoIOH4Nd4HZD4NsGYJ/Abn1xEVOcuZ8f0zc/tHiYmzTAwscBvDIK/veyQ9K/rnewjdF26q0kF1IUxZIFPAVW98x/a+qp8L2M/+HMhETRE6S8TxpZ7KGXAAAAAElFTkSuQmCC">
</a>
</div>
Expand Down Expand Up @@ -124,7 +124,7 @@
<?php if (isset($vars['varData'])) : ?>
<?php foreach ($vars['varData'] as $heading => $items) : ?>

<a href="#" data-toggle="datatable" data-table="<?= strtolower(str_replace(' ', '-', $heading)) ?>">
<a class="debug-bar-vars" data-toggle="datatable" data-table="<?= strtolower(str_replace(' ', '-', $heading)) ?>">
<h2><?= $heading ?></h2>
</a>

Expand All @@ -148,7 +148,7 @@
<?php endif ?>

<!-- Session -->
<a href="#" data-toggle="datatable" data-table="session">
<a class="debug-bar-vars" data-toggle="datatable" data-table="session">
<h2>Session User Data</h2>
</a>

Expand All @@ -174,7 +174,7 @@
<h2>Request <span>( <?= $vars['request'] ?> )</span></h2>

<?php if (isset($vars['get']) && $get = $vars['get']) : ?>
<a href="#" data-toggle="datatable" data-table="get">
<a class="debug-bar-vars" data-toggle="datatable" data-table="get">
<h3>$_GET</h3>
</a>

Expand All @@ -191,7 +191,7 @@
<?php endif ?>

<?php if (isset($vars['post']) && $post = $vars['post']) : ?>
<a href="#" data-toggle="datatable" data-table="post">
<a class="debug-bar-vars" data-toggle="datatable" data-table="post">
<h3>$_POST</h3>
</a>

Expand All @@ -208,7 +208,7 @@
<?php endif ?>

<?php if (isset($vars['headers']) && $headers = $vars['headers']) : ?>
<a href="#" data-toggle="datatable" data-table="request_headers">
<a class="debug-bar-vars" data-toggle="datatable" data-table="request_headers">
<h3>Headers</h3>
</a>

Expand All @@ -225,7 +225,7 @@
<?php endif ?>

<?php if (isset($vars['cookies']) && $cookies = $vars['cookies']) : ?>
<a href="#" data-toggle="datatable" data-table="cookie">
<a class="debug-bar-vars" data-toggle="datatable" data-table="cookie">
<h3>Cookies</h3>
</a>

Expand All @@ -246,7 +246,7 @@
</h2>

<?php if (isset($vars['response']['headers']) && $headers = $vars['response']['headers']) : ?>
<a href="#" data-toggle="datatable" data-table="response_headers">
<a class="debug-bar-vars" data-toggle="datatable" data-table="response_headers">
<h3>Headers</h3>
</a>

Expand Down
Loading