diff --git a/src/Symfony/Bundle/WebProfilerBundle/Resources/views/Collector/time.html.twig b/src/Symfony/Bundle/WebProfilerBundle/Resources/views/Collector/time.html.twig index 88a5829905..4f82f2da73 100644 --- a/src/Symfony/Bundle/WebProfilerBundle/Resources/views/Collector/time.html.twig +++ b/src/Symfony/Bundle/WebProfilerBundle/Resources/views/Collector/time.html.twig @@ -4,8 +4,8 @@ {% if colors is not defined %} {% set colors = { - 'default': '#999', - 'section': '#444', + 'default': '#777', + 'section': '#999', 'event_listener': '#00B8F5', 'template': '#66CC00', 'doctrine': '#FF6633', @@ -220,6 +220,11 @@ return query('#collector-content h2').clientWidth; } + function getCssVarValue(varName) + { + return getComputedStyle(document.querySelector('body')).getPropertyValue(varName); + } + /** * Draw one canvas. * @@ -272,7 +277,11 @@ ctx.lineWidth = 0; // For each event, draw a line. - ctx.strokeStyle = "#CCC"; + ctx.strokeStyle = getCssVarValue('--table-border'); + + // set the background color of the canvas + ctx.fillStyle = getCssVarValue('--table-background'); + ctx.fillRect(0, 0, canvas.width, canvas.height); drawableEvents.forEach(function(event) { event.periods.forEach(function(period) { @@ -379,31 +388,31 @@ // For each event, draw the label. mainEvents.forEach(function(event) { - ctx.fillStyle = "#444"; + ctx.fillStyle = getCssVarValue('--color-text'); ctx.font = "12px sans-serif"; text = event.name; ms = " " + (event.duration < 1 ? event.duration : parseInt(event.duration, 10)) + " ms / " + event.memory + " MB"; if (x + event.starttime * ratio + ctx.measureText(text + ms).width > width) { ctx.textAlign = "end"; ctx.font = "10px sans-serif"; - ctx.fillStyle = "#777"; + ctx.fillStyle = getCssVarValue('--color-muted'); xc = x + event.endtime * ratio - 1; ctx.fillText(ms, xc, h); xc -= ctx.measureText(ms).width; ctx.font = "12px sans-serif"; - ctx.fillStyle = "#222"; + ctx.fillStyle = getCssVarValue('--color-text'); ctx.fillText(text, xc, h); } else { ctx.textAlign = "start"; ctx.font = "13px sans-serif"; - ctx.fillStyle = "#222"; + ctx.fillStyle = getCssVarValue('--color-text'); xc = x + event.starttime * ratio + 1; ctx.fillText(text, xc, h); xc += ctx.measureText(text).width; ctx.font = "11px sans-serif"; - ctx.fillStyle = "#777"; + ctx.fillStyle = getCssVarValue('--color-muted'); ctx.fillText(ms, xc, h); } diff --git a/src/Symfony/Bundle/WebProfilerBundle/Resources/views/Profiler/base.html.twig b/src/Symfony/Bundle/WebProfilerBundle/Resources/views/Profiler/base.html.twig index 5386b01464..bc5e8e2620 100644 --- a/src/Symfony/Bundle/WebProfilerBundle/Resources/views/Profiler/base.html.twig +++ b/src/Symfony/Bundle/WebProfilerBundle/Resources/views/Profiler/base.html.twig @@ -14,6 +14,10 @@ {% endblock %} + + {% block body '' %} diff --git a/src/Symfony/Bundle/WebProfilerBundle/Resources/views/Profiler/layout.html.twig b/src/Symfony/Bundle/WebProfilerBundle/Resources/views/Profiler/layout.html.twig index 7c0b2201ff..5c990bbdb8 100644 --- a/src/Symfony/Bundle/WebProfilerBundle/Resources/views/Profiler/layout.html.twig +++ b/src/Symfony/Bundle/WebProfilerBundle/Resources/views/Profiler/layout.html.twig @@ -126,6 +126,8 @@ {% endfor %} {% endif %} + + {{ include('@WebProfiler/Profiler/settings.html.twig') }}
@@ -142,6 +144,6 @@ event.preventDefault(); Sfjs.toggleClass(document.getElementById('sidebar'), 'expanded'); }) - }()) + }()); {% endblock %} diff --git a/src/Symfony/Bundle/WebProfilerBundle/Resources/views/Profiler/profiler.css.twig b/src/Symfony/Bundle/WebProfilerBundle/Resources/views/Profiler/profiler.css.twig index e6601614a9..dd8da7b183 100644 --- a/src/Symfony/Bundle/WebProfilerBundle/Resources/views/Profiler/profiler.css.twig +++ b/src/Symfony/Bundle/WebProfilerBundle/Resources/views/Profiler/profiler.css.twig @@ -1,19 +1,72 @@ -{# Mixins - ========================================================================= #} -{% set mixins = { - 'break_long_words': '-ms-word-break: break-all; word-break: break-all; word-break: break-word; -webkit-hyphens: auto; -moz-hyphens: auto; hyphens: auto;', - 'monospace_font': 'font-family: monospace; font-size: 13px; font-size-adjust: 0.5;', - 'sans_serif_font': 'font-family: Helvetica, Arial, sans-serif;', - 'subtle_border_and_shadow': 'background: #FFF; border: 1px solid #E0E0E0; box-shadow: 0px 0px 1px rgba(128, 128, 128, .2);' -} %} - -{# when updating any of these colors, do the same in toolbar.css.twig #} -{% set colors = { 'success': '#4F805D', 'warning': '#A46A1F', 'error': '#B0413E' } %} - {# Normalization (normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css) ========================================================================= #} -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} +*{-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: #777; + /* 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; + --color-muted: #999; + --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 ========================================================================= #} @@ -22,11 +75,11 @@ html, body { width: 100%; } body { - background-color: #F9F9F9; - color: #222; + background-color: var(--page-background); + color: var(--base-6); display: flex; flex-direction: column; - {{ mixins.sans_serif_font|raw }} + font_family: var(--font-sans-serif); font-size: 14px; line-height: 1.4; } @@ -50,7 +103,7 @@ h4 { } h2 span, h3 span, h4 span, h2 small, h3 small, h4 small { - color: #999; + color: var(--color-muted); } li { @@ -91,24 +144,25 @@ h4 a:hover { } abbr { - border-bottom: 1px dotted #444; + border-bottom: 1px dotted var(--base-5); cursor: help; } code, pre { - {{ mixins.monospace_font|raw }} + font-family: monospace; + font-size: 13px; } -{# Buttons +{# Buttons (the colors of this element don't change based on the selected theme) ------------------------------------------------------------------------- #} button { - {{ mixins.sans_serif_font|raw }} + font_family: var(--font-sans-serif); } .btn { background: #777; border-radius: 2px; border: 0; - color: #F5F5F5; + color: #f5f5f5; display: inline-block; padding: .5em .75em; } @@ -141,13 +195,15 @@ button { {# Tables ------------------------------------------------------------------------- #} table, tr, th, td { - background: #FFF; + background: var(--table-background); border-collapse: collapse; line-height: 1.5; vertical-align: top; } table { - {{ mixins.subtle_border_and_shadow|raw }}; + background: var(--base-0); + border: var(--border); + box-shadow: var(--shadow); margin: 1em 0; width: 100%; } @@ -161,7 +217,7 @@ table th { text-align: left; } table thead th { - background-color: #E0E0E0; + background-color: var(--table-header); } table thead th.key { width: 19%; @@ -173,9 +229,10 @@ table thead.small th { table tbody th, table tbody td { - {{ mixins.monospace_font|raw }} - border: 1px solid #E0E0E0; + border: 1px solid var(--base-2); border-width: 1px 0; + font-family: monospace; + font-size: 13px; } table tbody div { @@ -212,16 +269,21 @@ table tbody td.num-col { display: block; } .break-long-words { - {{ mixins.break_long_words|raw }} + -ms-word-break: break-all; + word-break: break-all; + word-break: break-word; + -webkit-hyphens: auto; + -moz-hyphens: auto; + hyphens: auto; } .text-small { font-size: 12px !important; } .text-muted { - color: #999; + color: var(--color-muted); } .text-danger { - color: {{ colors.error|raw }}; + color: var(--color-error); } .text-bold { font-weight: bold; @@ -233,23 +295,23 @@ table tbody td.num-col { text-align: center; } .font-normal { - {{ mixins.sans_serif_font|raw }} + font_family: var(--font-sans-serif); font-size: 14px; } .help { - color: #999; + color: var(--color-muted); font-size: 14px; margin-bottom: .5em; } .empty { - border: 4px dashed #E0E0E0; - color: #999; + border: 4px dashed var(--base-2); + color: var(--color-muted); margin: 1em 0; padding: .5em 2em; } .label { - background-color: #666; + background-color: var(--base-4); color: #FAFAFA; display: inline-block; font-size: 12px; @@ -261,9 +323,9 @@ table tbody td.num-col { min-width: 70px; text-align: center; } -.label.status-success { background: {{ colors.success|raw }}; color: #FFF; } -.label.status-warning { background: {{ colors.warning|raw }}; color: #FFF; } -.label.status-error { background: {{ colors.error|raw }}; color: #FFF; } +.label.status-success { background: var(--color-success); color: #FFF; } +.label.status-warning { background: var(--color-warning); color: #FFF; } +.label.status-error { background: var(--color-error); color: #FFF; } {# Metrics ------------------------------------------------------------------------- #} @@ -277,7 +339,10 @@ table tbody td.num-col { } .metric { - {{ mixins.subtle_border_and_shadow|raw }}; + background: var(--metric-value-background); + border: 1px solid var(--table-border); + box-shadow: var(--shadow); + color: var(--metric-value-color); min-width: 100px; min-height: 70px; } @@ -291,13 +356,13 @@ table tbody td.num-col { margin: 5px 0 -5px; } .metric .unit { - color: #999; + color: var(--metric-unit-color); font-size: 18px; margin-left: -4px; } .metric .label { - background: #E0E0E0; - color: #222; + background: var(--metric-label-background); + color: var(--metric-label-color); display: block; font-size: 12px; padding: 5px; @@ -337,12 +402,14 @@ table tbody td.num-col { {# Cards ------------------------------------------------------------------------- #} .card { - {{ mixins.subtle_border_and_shadow|raw }}; + background: var(--base-0); + border: var(--border); + box-shadow: var(--shadow); margin: 1em 0; padding: 10px; } .card-block + .card-block { - border-top: 1px solid #E0E0E0; + border-top: 1px solid var(--base-2); padding-top: 10px; } .card *:first-child, @@ -351,7 +418,7 @@ table tbody td.num-col { } .card .label { background-color: #EEE; - color: #222; + color: var(--base-6); } {# Status @@ -377,10 +444,10 @@ tr.status-warning td { } .status-warning .colored { - color: {{ colors.warning|raw }}; + color: var(--color-warning); } .status-error .colored { - color: {{ colors.error|raw }}; + color: var(--color-error); } {# Syntax highlighting @@ -467,14 +534,14 @@ tr.status-warning td { margin-top: 0; } -{# Header +{# Header (the colors of this element don't change based on the selected theme) ========================================================================= #} #header { background-color: #222; overflow: hidden; } #header h1 { - color: #FFF; + color: #fff; flex: 1; font-weight: normal; font-size: 21px; @@ -482,7 +549,7 @@ tr.status-warning td { padding: 10px 10px 8px; } #header h1 span { - color: #CCC; + color: #ccc; } #header h1 svg { height: 40px; @@ -492,13 +559,13 @@ tr.status-warning td { } #header h1 svg path, #header h1 svg .sf-svg-path { - fill: #FFF; + fill: #fff; } #header .search { padding-top: 11px; } #header .search input { - border: 1px solid #DDD; + border: 1px solid #ddd; margin-right: 4px; padding: 7px 8px; width: 200px; @@ -507,14 +574,14 @@ tr.status-warning td { {# Summary ========================================================================= #} #summary .status { - background: #E0E0E0; + background: var(--base-2); border: solid rgba(0, 0, 0, 0.1); border-width: 2px 0; padding: 10px; } #summary h2, #summary h2 a { - color: #222; + color: var(--base-6); font-size: 21px; margin: 0; text-decoration: none; @@ -523,9 +590,9 @@ tr.status-warning td { text-decoration: underline; } -#summary .status-success { background: {{ colors.success|raw }}; } -#summary .status-warning { background: {{ colors.warning|raw }}; } -#summary .status-error { background: {{ colors.error|raw }}; } +#summary .status-success { background: var(--color-success); } +#summary .status-warning { background: var(--color-warning); } +#summary .status-error { background: var(--color-error); } #summary .status-success h2, #summary .status-success a, @@ -564,7 +631,7 @@ tr.status-warning td { ========================================================================= #} #sidebar { background: #444; - color: #CCC; + color: #ccc; padding-bottom: 30px; position: relative; width: 220px; @@ -593,7 +660,7 @@ tr.status-warning td { text-align: center; } #sidebar #sidebar-shortcuts .btn { - color: #F5F5F5; + color: #f5f5f5; } #sidebar #sidebar-shortcuts .btn + .btn { margin-left: 5px; @@ -602,7 +669,7 @@ tr.status-warning td { padding: .5em; } -{# Sidebar Search +{# Sidebar Search (the colors of this element don't change based on the selected theme) ------------------------------------------------------------------------- #} #sidebar-search .form-group:first-of-type { padding-top: 20px; @@ -625,7 +692,7 @@ tr.status-warning td { padding: 3px 6px; } #sidebar-search .form-group input { - background: #CCC; + background: #ccc; border: 1px solid #999; color: #222; width: 120px; @@ -638,7 +705,7 @@ tr.status-warning td { margin-right: 10px; } -{# Sidebar Menu +{# Sidebar Menu (the colors of this element don't change based on the selected theme) ------------------------------------------------------------------------- #} #menu-profiler { margin: 0; @@ -652,7 +719,7 @@ tr.status-warning td { #menu-profiler li a { border: solid transparent; border-width: 2px 0; - color: #CCC; + color: var(--base-3); display: block; } #menu-profiler li a:hover { @@ -710,12 +777,12 @@ tr.status-warning td { #menu-profiler li.selected a .icon svg .sf-svg-path, #menu-profiler li a:hover .icon svg path, #menu-profiler li a:hover .icon svg .sf-svg-path { - fill: #FFF; + fill: #fff; } #menu-profiler li a .count { background-color: #666; - color: #FFF; + color: #fff; display: inline-block; font-weight: bold; min-width: 10px; @@ -736,16 +803,17 @@ tr.status-warning td { } #menu-profiler .label-status-warning .count { - background: {{ colors.warning|raw }}; + background: var(--color-warning); } #menu-profiler .label-status-error .count { - background: {{ colors.error|raw }}; + background: var(--color-error); } {# Timeline panel ========================================================================= #} #timeline-control { - background: #FFF; + background: var(--table-background); + box-shadow: var(--shadow); margin: 1em 0; padding: 10px; } @@ -754,6 +822,8 @@ tr.status-warning td { margin-right: 1em; } #timeline-control input { + background: var(--metric-value-background); + border: 1px solid var(--table-border); font-size: 16px; padding: 4px; text-align: right; @@ -772,8 +842,8 @@ tr.status-warning td { padding: 0 10px 0 5px; } .sf-profiler-timeline canvas { - border: 1px solid #DDD; - background: #FFF; + border: 1px solid var(--table-border); + background: var(--page-background); margin: .5em 0; } .sf-profiler-timeline + p.help { @@ -787,9 +857,9 @@ tr.status-warning td { padding: 0; } .tab-navigation li { - background: #FFF; - border: 1px solid #DDD; - color: #444; + background: var(--tab-background); + border: 1px solid var(--table-border); + color: var(--tab-color); cursor: pointer; display: inline-block; font-size: 16px; @@ -797,12 +867,9 @@ tr.status-warning td { padding: .5em .75em; z-index: 1; } -.tab-navigation li:hover { - background: #EEE; -} .tab-navigation li .badge { - background-color: #F5F5F5; - color: #777; + background-color: var(--base-1); + color: var(--base-4); display: inline-block; font-size: 14px; font-weight: bold; @@ -812,29 +879,24 @@ tr.status-warning td { text-align: center; white-space: nowrap; } -.tab-navigation li:hover .badge { - background: #FAFAFA; - color: #777; -} .tab-navigation li.disabled { - background: #F5F5F5; - color: #999; + background: var(--tab-disabled-background); + color: var(--tab-disabled-color); } .tab-navigation li.active { - background: #666; - border-color: #666; - color: #FAFAFA; + background: var(--tab-active-background); + color: var(--tab-active-color); z-index: 1100; } .tab-navigation li.active .badge { - background-color: #444; - color: #FFF; + background-color: var(--base-5); + color: var(--base-2); } .tab-content > *:first-child { margin-top: 0; } -.tab-navigation li .badge.status-warning { background: {{ colors.warning|raw }}; color: #FFF; } -.tab-navigation li .badge.status-error { background: {{ colors.error|raw }}; color: #FFF; } +.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; } @@ -897,7 +959,7 @@ table.logs .metadata { {# Doctrine panel ========================================================================= #} .sql-runnable { - background: #F5F5F5; + background: var(--base-1); margin: .5em 0; padding: 1em; } @@ -909,9 +971,14 @@ table.logs .metadata { word-break: normal; } .queries-table pre { - {{ mixins.break_long_words|raw }} margin: 0; white-space: pre-wrap; + -ms-word-break: break-all; + word-break: break-all; + word-break: break-word; + -webkit-hyphens: auto; + -moz-hyphens: auto; + hyphens: auto; } {# Validator panel @@ -963,13 +1030,18 @@ table.logs .metadata { {# Dump panel ========================================================================= #} +pre.sf-dump, pre.sf-dump .sf-dump-default { + z-index: 1000 !important; +} + #collector-content .sf-dump { margin-bottom: 2em; } #collector-content pre.sf-dump, #collector-content .sf-dump code, #collector-content .sf-dump samp { - {{ mixins.monospace_font|raw }} + font-family: monospace; + font-size: 13px; } #collector-content .sf-dump a { cursor: pointer; @@ -977,7 +1049,6 @@ table.logs .metadata { #collector-content .sf-dump pre.sf-dump, #collector-content .sf-dump .trace { border: 1px solid #DDD; - background: #FFF; padding: 10px; margin: 0.5em 0; overflow: auto; @@ -985,18 +1056,9 @@ table.logs .metadata { #collector-content pre.sf-dump, #collector-content .sf-dump-default { - color: #CC7832; background: none; } -#collector-content .sf-dump-str { color: #629755; } -#collector-content .sf-dump-private, -#collector-content .sf-dump-protected, -#collector-content .sf-dump-public { color: #262626; } -#collector-content .sf-dump-note { color: #6897BB; } -#collector-content .sf-dump-key { color: #789339; } -#collector-content .sf-dump-ref { color: #6E6E6E; } -#collector-content .sf-dump-ellipsis { color: #CC7832; max-width: 100em; } -#collector-content .sf-dump-ellipsis-path { max-width: 5em; } +#collector-content .sf-dump-ellipsis { max-width: 100em; } #collector-content .sf-dump { margin: 0; @@ -1021,14 +1083,11 @@ table.logs .metadata { margin-bottom: 0; padding: 0; } -#collector-content .sf-dump .trace li.selected { - background: rgba(255, 255, 153, 0.5); -} {# Search Results page ========================================================================= #} #search-results td { - {{ mixins.sans_serif_font|raw }} + font_family: var(--font-sans-serif); vertical-align: middle; } @@ -1097,3 +1156,30 @@ table.logs .metadata { margin-left: 2px; } } + +{# Config Options + ========================================================================= #} +body.width-full .container { + max-width: 100%; +} + +body.theme-light #collector-content .sf-dump pre.sf-dump, +body.theme-light #collector-content .sf-dump .trace { + background: #FFF; +} +body.theme-light #collector-content pre.sf-dump, +body.theme-light #collector-content .sf-dump-default { + color: #CC7832; +} +body.theme-light #collector-content .sf-dump-str { color: #629755; } +body.theme-light #collector-content .sf-dump-private, +body.theme-light #collector-content .sf-dump-protected, +body.theme-light #collector-content .sf-dump-public { color: #262626; } +body.theme-light #collector-content .sf-dump-note { color: #6897BB; } +body.theme-light #collector-content .sf-dump-key { color: #789339; } +body.theme-light #collector-content .sf-dump-ref { color: #6E6E6E; } +body.theme-light #collector-content .sf-dump-ellipsis { color: #CC7832; max-width: 100em; } +body.theme-light #collector-content .sf-dump-ellipsis-path { max-width: 5em; } +body.theme-light #collector-content .sf-dump .trace li.selected { + background: rgba(255, 255, 153, 0.5); +} diff --git a/src/Symfony/Bundle/WebProfilerBundle/Resources/views/Profiler/settings.html.twig b/src/Symfony/Bundle/WebProfilerBundle/Resources/views/Profiler/settings.html.twig new file mode 100644 index 0000000000..cc794e1104 --- /dev/null +++ b/src/Symfony/Bundle/WebProfilerBundle/Resources/views/Profiler/settings.html.twig @@ -0,0 +1,160 @@ + + +Settings + + + +