1.1 --- /dev/null Thu Jan 01 00:00:00 1970 +0000
1.2 +++ b/browser/devtools/profiler/cleopatra/css/ui.css Wed Dec 31 06:09:35 2014 +0100
1.3 @@ -0,0 +1,340 @@
1.4 +/* This Source Code Form is subject to the terms of the Mozilla Public
1.5 + * License, v. 2.0. If a copy of the MPL was not distributed with this
1.6 + * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
1.7 +
1.8 +body {
1.9 + margin: 0;
1.10 + font-family: "Lucida Grande", sans-serif;
1.11 + font-size: 11px;
1.12 +}
1.13 +#mainarea {
1.14 + position: absolute;
1.15 + top: 0;
1.16 + left: 0px;
1.17 + bottom: 0;
1.18 + right: 0;
1.19 +}
1.20 +.finishedProfilePane,
1.21 +.finishedProfilePaneBackgroundCover,
1.22 +.profileEntryPane,
1.23 +.profileProgressPane {
1.24 + position: absolute;
1.25 + top: 0;
1.26 + left: 0;
1.27 + bottom: 0;
1.28 + right: 0;
1.29 +}
1.30 +.profileEntryPane {
1.31 + overflow: auto;
1.32 +}
1.33 +.profileEntryPane,
1.34 +.profileProgressPane {
1.35 + padding: 20px;
1.36 + background-color: rgb(229,229,229);
1.37 + background-image: url(../images/noise.png),
1.38 + linear-gradient(rgba(255,255,255,.5),rgba(255,255,255,.2));
1.39 + text-shadow: rgba(255, 255, 255, 0.4) 0 1px;
1.40 +}
1.41 +.profileEntryPane h1 {
1.42 + margin-top: 0;
1.43 + font-size: 13px;
1.44 + font-weight: normal;
1.45 +}
1.46 +.profileEntryPane input[type="file"] {
1.47 + margin-bottom: 1em;
1.48 +}
1.49 +.profileProgressPane a {
1.50 + position: absolute;
1.51 + top: 30%;
1.52 + left: 30%;
1.53 + width: 40%;
1.54 + height: 16px;
1.55 +}
1.56 +.profileProgressPane progress {
1.57 + position: absolute;
1.58 + top: 40%;
1.59 + left: 30%;
1.60 + width: 40%;
1.61 + height: 16px;
1.62 +}
1.63 +.finishedProfilePaneBackgroundCover {
1.64 + animation: darken 300ms cubic-bezier(0, 0, 1, 0);
1.65 + background-color: rgba(0, 0, 0, 0.5);
1.66 +}
1.67 +
1.68 +.finishedProfilePane {
1.69 + animation: appear 300ms ease-out;
1.70 +}
1.71 +
1.72 +@keyframes darken {
1.73 + from {
1.74 + opacity: 0;
1.75 + }
1.76 + to {
1.77 + opacity: 1;
1.78 + }
1.79 +}
1.80 +@keyframes appear {
1.81 + from {
1.82 + transform: scale(0.3);
1.83 + opacity: 0;
1.84 + pointer-events: none;
1.85 + }
1.86 + to {
1.87 + transform: scale(1);
1.88 + opacity: 1;
1.89 + pointer-events: auto;
1.90 + }
1.91 +}
1.92 +.breadcrumbTrail {
1.93 + top: 0;
1.94 + right: 0;
1.95 + height: 29px;
1.96 + left: 0;
1.97 + background: linear-gradient(#FFF 50%, #F3F3F3 55%);
1.98 + border-bottom: 1px solid #CCC;
1.99 + margin: 0;
1.100 + padding: 0;
1.101 + overflow: hidden;
1.102 +}
1.103 +.breadcrumbTrailItem {
1.104 + background: linear-gradient(#FFF 50%, #F3F3F3 55%);
1.105 + display: block;
1.106 + margin: 0;
1.107 + padding: 0;
1.108 + float: left;
1.109 + line-height: 29px;
1.110 + padding: 0 10px;
1.111 + font-size: 12px;
1.112 + -moz-user-select: none;
1.113 + user-select: none;
1.114 + cursor: default;
1.115 + border-right: 1px solid #CCC;
1.116 + max-width: 250px;
1.117 + overflow: hidden;
1.118 + text-overflow: ellipsis;
1.119 + white-space: nowrap;
1.120 + position: relative;
1.121 +}
1.122 +@keyframes slide-out {
1.123 + from {
1.124 + margin-left: -270px;
1.125 + opacity: 0;
1.126 + }
1.127 + to {
1.128 + margin-left: 0;
1.129 + opacity: 1;
1.130 + }
1.131 +}
1.132 +@keyframes slide-out {
1.133 + from {
1.134 + margin-left: -270px;
1.135 + opacity: 0;
1.136 + }
1.137 + to {
1.138 + margin-left: 0;
1.139 + opacity: 1;
1.140 + }
1.141 +}
1.142 +.breadcrumbTrailItem:not(:first-child) {
1.143 + animation: slide-out;
1.144 + animation-duration: 400ms;
1.145 + animation-timing-function: ease-out;
1.146 +}
1.147 +.breadcrumbTrailItem.selected {
1.148 + background: linear-gradient(#E5E5E5 50%, #DADADA 55%);
1.149 +}
1.150 +.breadcrumbTrailItem:not(.selected):active:hover {
1.151 + background: linear-gradient(#F2F2F2 50%, #E6E6E6 55%);
1.152 +}
1.153 +.breadcrumbTrailItem.deleted {
1.154 + transition: 400ms ease-out;
1.155 + transition-property: opacity, margin-left;
1.156 + opacity: 0;
1.157 + margin-left: -270px;
1.158 +}
1.159 +.treeContainer {
1.160 + /*For asbolute position child*/
1.161 + position: relative;
1.162 +}
1.163 +.tree {
1.164 + height: 100%;
1.165 +}
1.166 +#sampleBar {
1.167 + position: absolute;
1.168 + float: right;
1.169 + left: auto;
1.170 + top: 0;
1.171 + right: 0;
1.172 + height: 100%;
1.173 +}
1.174 +#fileList {
1.175 + position: absolute;
1.176 + top: 0;
1.177 + left: 0;
1.178 + bottom: 360px;
1.179 + width: 199px;
1.180 + overflow: auto;
1.181 + padding: 0;
1.182 + margin: 0;
1.183 + background: #DBDFE7;
1.184 + border-right: 1px solid #BBB;
1.185 + cursor: pointer;
1.186 +}
1.187 +#infoBar dl {
1.188 + margin: 0;
1.189 +}
1.190 +#infoBar dt,
1.191 +#infoBar dd {
1.192 + display: inline;
1.193 +}
1.194 +#infoBar dt {
1.195 + font-weight: bold;
1.196 +}
1.197 +#infoBar dt::after {
1.198 + content: " ";
1.199 + white-space: pre;
1.200 +}
1.201 +#infoBar dd {
1.202 + margin-left: 0;
1.203 +}
1.204 +#infoBar dd::after {
1.205 + content: "\a";
1.206 + white-space:pre;
1.207 +}
1.208 +.sideBar {
1.209 + box-sizing: border-box;
1.210 + position: absolute;
1.211 + left: 0;
1.212 + bottom: 0;
1.213 + width: 200px;
1.214 + height: 480px;
1.215 + overflow: auto;
1.216 + padding: 3px;
1.217 + background: #EEE;
1.218 + border-top: 1px solid #BBB;
1.219 + border-right: 1px solid #BBB;
1.220 +}
1.221 +.sideBar h2 {
1.222 + font-size: 1em;
1.223 + padding: 1px 3px;
1.224 + margin: 3px -3px;
1.225 + background: rgba(255, 255, 255, 0.6);
1.226 + border: solid #CCC;
1.227 + border-width: 1px 0;
1.228 +}
1.229 +.sideBar h2:first-child {
1.230 + margin-top: -4px;
1.231 +}
1.232 +.sideBar ul {
1.233 + margin: 2px 0;
1.234 + padding-left: 18px;
1.235 +}
1.236 +.pluginview {
1.237 + position: absolute;
1.238 + right: 0;
1.239 + bottom: 0;
1.240 + left: 0;
1.241 + z-index: 1;
1.242 + background-color: white;
1.243 +}
1.244 +.pluginviewIFrame {
1.245 + border-style: none;
1.246 + width: 100%;
1.247 + height: 100%;
1.248 +}
1.249 +.histogram {
1.250 + position: relative;
1.251 + height: 60px;
1.252 + right: 0;
1.253 + left: 0;
1.254 + border-bottom: 1px solid #CCC;
1.255 + background: linear-gradient(#EEE, #CCC);
1.256 +}
1.257 +.histogramHilite {
1.258 + position: absolute;
1.259 + pointer-events: none;
1.260 +}
1.261 +.histogramHilite:not(.collapsed) {
1.262 + background: rgba(150, 150, 150, 0.5);
1.263 +}
1.264 +.histogramMouseMarker {
1.265 + position: absolute;
1.266 + pointer-events: none;
1.267 + top: 0;
1.268 + width: 1px;
1.269 + height: 100%;
1.270 +}
1.271 +.histogramMouseMarker:not(.collapsed) {
1.272 + background: rgba(0, 0, 150, 0.7);
1.273 +}
1.274 +#iconbox {
1.275 + display: none;
1.276 +}
1.277 +#filter, #showall {
1.278 + cursor: pointer;
1.279 +}
1.280 +.markers {
1.281 + display: none;
1.282 +}
1.283 +.hidden {
1.284 + display: none !important;
1.285 +}
1.286 +.fileListItem {
1.287 + display: block;
1.288 + margin: 0;
1.289 + padding: 0;
1.290 + height: 40px;
1.291 + text-indent: 8px;
1.292 +}
1.293 +.fileListItem.selected {
1.294 + background: linear-gradient(#4B91D7 1px, #5FA9E4 1px, #5FA9E4 2px, #58A0DE 3px, #2B70C7 39px, #2763B4 39px);
1.295 + color: #FFF;
1.296 + text-shadow: 0 1px rgba(0, 0, 0, 0.3);
1.297 +}
1.298 +.fileListItemTitle {
1.299 + display: block;
1.300 + padding-top: 6px;
1.301 + font-size: 12px;
1.302 +}
1.303 +.fileListItemDescription {
1.304 + display: block;
1.305 + line-height: 15px;
1.306 + font-size: 9px;
1.307 +}
1.308 +.busyCover {
1.309 + position: absolute;
1.310 + top: 0;
1.311 + right: 0;
1.312 + bottom: 0;
1.313 + left: 0;
1.314 + visibility: hidden;
1.315 + opacity: 0;
1.316 + pointer-events: none;
1.317 + background: rgba(120, 120, 120, 0.2);
1.318 + transition: 200ms ease-in-out;
1.319 + transition-property: visibility, opacity;
1.320 +}
1.321 +.busyCover.busy {
1.322 + visibility: visible;
1.323 + opacity: 1;
1.324 +}
1.325 +.busyCover::before {
1.326 + content: url(../images/throbber.svg);
1.327 + position: absolute;
1.328 + top: 50%;
1.329 + left: 50%;
1.330 + margin: -12px;
1.331 +}
1.332 +label {
1.333 + -moz-user-select: none;
1.334 +}
1.335 +.videoPane {
1.336 + background-color: white;
1.337 + width: 100%;
1.338 +}
1.339 +.video {
1.340 + display: block;
1.341 + margin-left: auto;
1.342 + margin-right: auto;
1.343 +}
