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 6e7fb9cb5d54b..a37879c7864d3 100644
--- a/src/Symfony/Bundle/WebProfilerBundle/Resources/views/Profiler/profiler.css.twig
+++ b/src/Symfony/Bundle/WebProfilerBundle/Resources/views/Profiler/profiler.css.twig
@@ -17,9 +17,15 @@ html{font-family:sans-serif;-webkit-text-size-adjust:100%;-ms-text-size-adjust:1
{# Basic styles
========================================================================= #}
+html, body {
+ height: 100%;
+ width: 100%;
+}
body {
background-color: #F9F9F9;
color: #222;
+ display: flex;
+ flex-direction: column;
{{ mixins.sans_serif_font|raw }}
font-size: 14px;
line-height: 1.4;
@@ -401,16 +407,34 @@ tr.status-warning td {
max-width: 1300px;
padding-right: 15px;
}
+#header {
+ flex: 0 0 auto;
+}
+#header .container {
+ display: flex;
+ flex-direction: row;
+ justify-content: space-between;
+}
+#summary {
+ flex: 0 0 auto;
+}
#content {
- min-height: 1024px;
- overflow: hidden;
+ height: 100%;
+}
+#main {
+ display: flex;
+ flex-direction: row-reverse;
+ min-height: 100%;
+}
+#sidebar {
+ flex: 0 0 220px;
}
#collector-wrapper {
- float: left;
- width: 100%;
+ flex: 0 1 100%;
+ min-width: 0;
}
#collector-content {
- margin: 0 0 30px 220px;
+ margin: 0 0 30px 0;
padding: 14px 0 14px 20px;
}
@@ -428,7 +452,6 @@ tr.status-warning td {
color: #FFF;
font-weight: normal;
font-size: 21px;
- float: left;
margin: 0;
padding: 10px 10px 8px;
}
@@ -445,7 +468,6 @@ tr.status-warning td {
fill: #FFF;
}
#header .search {
- float: right;
padding-top: 11px;
}
#header .search input {
@@ -511,10 +533,7 @@ tr.status-warning td {
#sidebar {
background: #444;
color: #CCC;
- float: left;
- margin-bottom: -99999px; {# needed for 'same-height columns' trick #}
- margin-left: -100%;
- padding-bottom: 99999px; {# needed for 'same-height columns' trick #}
+ padding-bottom: 30px;
position: relative;
width: 220px;
z-index: 9999;
@@ -597,7 +616,6 @@ tr.status-warning td {
#menu-profiler li {
position: relative;
margin-bottom: 0;
- width: 220px;
}
#menu-profiler li a {
border: solid transparent;
@@ -922,17 +940,13 @@ table.logs .sf-call-stack abbr {
}
@media (max-width: 768px) {
- #collector-content {
- margin-left: 50px;
- }
-
#sidebar {
- width: 50px;
- overflow-y: hidden;
- transition: width 200ms ease-out;
+ flex-basis: 50px;
+ overflow-x: hidden;
+ transition: flex-basis 200ms ease-out;
}
#sidebar:hover, #sidebar.expanded {
- width: 220px;
+ flex-basis: 220px;
}
#sidebar-search {
pFad - Phonifier reborn
Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.
Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.
Alternative Proxies:
Alternative Proxy
pFad Proxy
pFad v3 Proxy
pFad v4 Proxy