8000 [WebProfilerBundle][TwigBundle] Compile assets by ro0NL · Pull Request #29537 · symfony/symfony · GitHub
[go: up one dir, main page]
Skip to content

[WebProfilerBundle][TwigBundle] Compile assets #29537

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

Closed
wants to merge 14 commits into from
Closed

[WebProfilerBundle][TwigBundle] Compile assets #29537

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
14 commits
Select commit Hold shift + click to select a range
38001d0
[WebProfilerBundle][TwigBundle] Compile assets
ro0NL Dec 9, 2018
e4638f4
no globals by default
ro0NL Dec 9, 2018
bc3629c
my point
ro0NL Dec 9, 2018
6bfe346
add basic css
ro0NL Dec 9, 2018
0305242
fix lock / gitattr
ro0NL Dec 9, 2018
01233a8
fixes
ro0NL Dec 9, 2018
c0a0362
introduce scss
ro0NL Dec 9, 2018
d7f03c7
yarn is faster
ro0NL Dec 9, 2018
46d1836
add compile binary + compile
ro0NL Dec 9, 2018
3bedf15
update webprofilerbundle
ro0NL Dec 9, 2018
8e13162
dont twig render compiled assets
ro0NL Dec 9, 2018
0ad9172
finetune
ro0NL Dec 9, 2018
6b3d1ac
ref #28919
ro0NL Dec 10, 2018
ba2e21e
add exception entry
ro0NL Dec 10, 2018
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
Prev Previous commit
Next Next commit
update webprofilerbundle
  • Loading branch information
@ro0NL
ro0NL committed Dec 9, 2018
commit 3bedf1580553191aa631260dd914fb68792d2e4e
73 changes: 2 additions & 71 deletions src/Symfony/Bundle/WebProfilerBundle/Resources/views/Profiler/base_js.html.twig
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,8 @@
{# This file is partially duplicated in TwigBundle/Resources/views/base_js.html.twig. If you
make any change in this file, verify the same change is needed in the other file. #}
<script{% if csp_script_nonce is defined and csp_script_nonce %} nonce="{{ csp_script_nonce }}"{% endif %}>/*<![CDATA[*/
{{ include('@WebProfiler/Asset/profiler.js') }}

{# Caution: the contents of this file are processed by Twig before loading
them as JavaScript source code. Always use '/*' comments instead
of '//' comments to avoid impossible-to-debug side-effects #}
Expand Down Expand Up @@ -547,76 +549,6 @@
return this;
},

createTabs: function() {
var tabGroups = document.querySelectorAll('.sf-tabs:not([data-processed=true])');

/* create the tab navigation for each group of tabs */
for (var i = 0; i < tabGroups.length; i++) {
var tabs = tabGroups[i].querySelectorAll('.tab');
var tabNavigation = document.createElement('ul');
tabNavigation.className = 'tab-navigation';

var selectedTabId = 'tab-' + i + '-0'; /* select the first tab by default */
for (var j = 0; j < tabs.length; j++) {
var tabId = 'tab-' + i + '-' + j;
var tabTitle = tabs[j].querySelector('.tab-title').innerHTML;

var tabNavigationItem = document.createElement('li');
tabNavigationItem.setAttribute('data-tab-id', tabId);
if (hasClass(tabs[j], 'active')) { selectedTabId = tabId; }
if (hasClass(tabs[j], 'disabled')) { addClass(tabNavigationItem, 'disabled'); }
tabNavigationItem.innerHTML = tabTitle;
tabNavigation.appendChild(tabNavigationItem);

var tabContent = tabs[j].querySelector('.tab-content');
tabContent.parentElement.setAttribute('id', tabId);
}

tabGroups[i].insertBefore(tabNavigation, tabGroups[i].firstChild);
addClass(document.querySelector('[data-tab-id="' + selectedTabId + '"]'), 'active');
}

/* display the active tab and add the 'click' event listeners */
for (i = 0; i < tabGroups.length; i++) {
tabNavigation = tabGroups[i].querySelectorAll('.tab-navigation li');

for (j = 0; j < tabNavigation.length; j++) {
tabId = tabNavigation[j].getAttribute('data-tab-id');
document.getElementById(tabId).querySelector('.tab-title').className = 'hidden';

if (hasClass(tabNavigation[j], 'active')) {
document.getElementById(tabId).className = 'block';
} else {
document.getElementById(tabId).className = 'hidden';
}

tabNavigation[j].addEventListener('click', function(e) {
var activeTab = e.target || e.srcElement;

/* needed because when the tab contains HTML contents, user can click */
/* on any of those elements instead of their parent '<li>' element */
while (activeTab.tagName.toLowerCase() !== 'li') {
activeTab = activeTab.parentNode;
}

/* get the full list of tabs through the parent of the active tab element */
var tabNavigation = activeTab.parentNode.children;
for (var k = 0; k < tabNavigation.length; k++) {
var tabId = tabNavigation[k].getAttribute('data-tab-id');
document.getElementById(tabId).className = 'hidden';
removeClass(tabNavigation[k], 'active');
}

addClass(activeTab, 'active');
var activeTabId = activeTab.getAttribute('data-tab-id');
document.getElementById(activeTabId).className = 'block';
});
}

tabGroups[i].setAttribute('data-processed', 'true');
}
},

createToggles: function() {
var toggles = document.querySelectorAll('.sf-toggle:not([data-processed=true])');

Expand Down Expand Up @@ -786,7 +718,6 @@
})();

Sfjs.addEventListener(document, 'DOMContentLoaded', function() {
Sfjs.createTabs();
Sfjs.createToggles();
});

Expand Down
263 changes: 2 additions & 261 deletions src/Symfony/Bundle/WebProfilerBundle/Resources/views/Profiler/profiler.css.twig
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,164 +1,10 @@
{{ include('@WebProfiler/Asset/profiler.css') }}

{# This file is partially duplicated in TwigBundle/Resources/views/exceotion.css.twig.
If you make any change in this file, verify the same change is needed in the other file. #}
{# Normalization
(normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css)
========================================================================= #}
*{-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box}html{font-family:sans-serif;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}body{margin:0}article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block;vertical-align:baseline}audio:not([controls]){display:none;height:0}[hidden],template{display:none}a{background-color:transparent}a:active,a:hover{outline:0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:700}dfn{font-style:italic}h1{margin:.67em 0;font-size:2em}mark{color:#000;background:#ff0}small{font-size:80%}sub,sup{position:relative;font-size:75%;line-height:0;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}img{border:0}svg:not(:root){overflow:hidden}figure{margin:1em 40px}hr{height:0;-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box}pre{overflow:auto}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}button,input,optgroup,select,textarea{margin:0;font:inherit;color:inherit}button{overflow:visible}button,select{text-transform:none}button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{padding:0;border:0}input{line-height:normal}input[type="checkbox"],input[type="radio"]{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;padding:0}input[type="number"]::-webkit-inner-spin-button,input[type="number"]::-webkit-outer-spin-button{height:auto}input[type="search"]{-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box;-webkit-appearance:textfield}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none}fieldset{padding:.35em .625em .75em;margin:0 2px;border:1px solid silver}legend{padding:0;border:0}textarea{overflow:auto}optgroup{font-weight:700}table{border-spacing:0;border-collapse:collapse}td,th{padding:0}

:root {
--font-sans-serif: 'Helvetica, Arial, sans-serif';
--page-background: #f9f9f9;
--color-text: #222;
--color-muted: #999;
/* when updating any of these colors, do the same in toolbar.css.twig */
--color-success: #4f805d;
--color-warning: #a46a1f;
--color-error: #b0413e;
--tab-background: #fff;
--tab-color: #444;
--tab-active-background: #666;
--tab-active-color: #fafafa;
--tab-disabled-background: #f5f5f5;
--tab-disabled-color: #999;
--metric-value-background: #fff;
--metric-value-color: inherit;
--metric-unit-color: #999;
--metric-label-background: #e0e0e0;
--metric-label-color: inherit;
--table-border: #e0e0e0;
--table-background: #fff;
--table-header: #e0e0e0;
--shadow: 0px 0px 1px rgba(128, 128, 128, .2);
--border: 1px solid #e0e0e0;
--base-0: #fff;
--base-1: #f5f5f5;
--base-2: #e0e0e0;
--base-3: #ccc;
--base-4: #666;
--base-5: #444;
--base-6: #222;
}

.theme-dark {
--page-background: #36393e;
--color-text: #e0e0e0;
--color-muted: #999;
--tab-background: #555;
--tab-color: #ccc;
--tab-active-background: #888;
--tab-active-color: #fafafa;
--tab-disabled-background: var(--page-background);
--tab-disabled-color: #777;
--metric-value-background: #555;
--metric-value-color: inherit;
--metric-unit-color: #999;
--metric-label-background: #777;
--metric-label-color: #e0e0e0;
--table-border: #444;
--table-background: #333;
--table-header: #555;
--shadow: 0px 0px 1px rgba(32, 32, 32, .2);
--border: 1px solid #666;
--color-muted: #777;
--base-0: #2e3136;
--base-1: #444;
--base-2: #666;
--base-3: #666;
--base-4: #666;
--base-5: #e0e0e0;
--base-6: #f5f5f5;
}

{# Basic styles
========================================================================= #}
html, body {
height: 100%;
width: 100%;
}
body {
background-color: var(--page-background);
color: var(--base-6);
display: flex;
flex-direction: column;
font_family: var(--font-sans-serif);
font-size: 14px;
line-height: 1.4;
}

h2, h3, h4 {
font-weight: 500;
margin: 1.5em 0 .5em;
}
h2 + h3,
h3 + h4 {
margin-top: 1em;
}
h2 {
font-size: 24px;
}
h3 {
font-size: 21px;
}
h4 {
font-size: 18px;
}
h2 span, h3 span, h4 span,
h2 small, h3 small, h4 small {
color: var(--color-muted);
}

li {
margin-bottom: 10px;
}

p {
font-size: 16px;
margin-bottom: 1em;
}

a {
color: #218BC3;
text-decoration: none;
}
a:hover {
text-decoration: underline;
}
a.link-inverse {
text-decoration: underline;
}
a.link-inverse:hover {
text-decoration: none;
}
a:active,
a:hover {
outline: 0;
}
h2 a,
h3 a,
h4 a {
text-decoration: underline;
}
h2 a:hover,
h3 a:hover,
h4 a:hover {
text-decoration: none;
}

abbr {
border-bottom: 1px dotted var(--base-5);
cursor: help;
}

code, pre {
font-family: monospace;
font-size: 13px;
}

{# Buttons (the colors of this element don't change based on the selected theme)
------------------------------------------------------------------------- #}
button {
font_family: var(--font-sans-serif);
}
.btn {
background: #777;
border-radius: 2px;
Expand Down Expand Up @@ -193,61 +39,6 @@ button {
.btn-link:hover {
text-decoration: underline;
}
{# Tables
------------------------------------------------------------------------- #}
table, tr, th, td {
background: var(--table-background);
border-collapse: collapse;
line-height: 1.5;
vertical-align: top;
}
table {
background: var(--base-0);
border: var(--border);
box-shadow: var(--shadow);
margin: 1em 0;
width: 100%;
}

table th, table td {
padding: 8px 10px;
}

table th {
font-weight: bold;
text-align: left;
}
table thead th {
background-color: var(--table-header);
}
table thead th.key {
width: 19%;
}
table thead.small th {
font-size: 12px;
padding: 4px 10px;
}

table tbody th,
table tbody td {
border: 1px solid var(--base-2);
border-width: 1px 0;
font-family: monospace;
font-size: 13px;
}

table tbody div {
margin: .25em 0;
}
table tbody ul {
margin: 0;
padding: 0 0 0 1em;
}

table thead th.num-col,
table tbody td.num-col {
text-align: center;
}

{# Utility classes
========================================================================= #}
Expand Down Expand Up @@ -860,56 +651,6 @@ tr.status-warning td {
margin-top: 0;
}

{# Tabbed navigation
========================================================================= #}
.tab-navigation {
margin: 0 0 1em 0;
padding: 0;
}
.tab-navigation li {
background: var(--tab-background);
border: 1px solid var(--table-border);
color: var(--tab-color);
cursor: pointer;
display: inline-block;
font-size: 16px;
margin: 0 0 0 -1px;
padding: .5em .75em;
z-index: 1;
}
.tab-navigation li .badge {
background-color: var(--base-1);
color: var(--base-4);
display: inline-block;
font-size: 14px;
font-weight: bold;
margin-left: 8px;
min-width: 10px;
padding: 1px 6px;
text-align: center;
white-space: nowrap;
}
.tab-navigation li.disabled {
background: var(--tab-disabled-background);
color: var(--tab-disabled-color);
}
.tab-navigation li.active {
background: var(--tab-active-background);
color: var(--tab-active-color);
z-index: 1100;
}
.tab-navigation li.active .badge {
background-color: var(--base-5);
color: var(--base-2);
}
.tab-content > *:first-child {
margin-top: 0;
}
.tab-navigation li .badge.status-warning { background: var(--color-warning); color: #FFF; }
.tab-navigation li .badge.status-error { background: var(--color-error); color: #FFF; }

.sf-tabs .tab:not(:first-child) { display: none; }

{# Toggles
========================================================================= #}
.sf-toggle-content {
Expand Down
0