932eab36a234771e13bd2d2df901544db1e923ac
[WebKit-https.git] / Source / WebInspectorUI / UserInterface / Views / DebuggerDashboardView.css
1 /*
2  * Copyright (C) 2014 Apple Inc. All rights reserved.
3  *
4  * Redistribution and use in source and binary forms, with or without
5  * modification, are permitted provided that the following conditions
6  * are met:
7  * 1. Redistributions of source code must retain the above copyright
8  *    notice, this list of conditions and the following disclaimer.
9  * 2. Redistributions in binary form must reproduce the above copyright
10  *    notice, this list of conditions and the following disclaimer in the
11  *    documentation and/or other materials provided with the distribution.
12  *
13  * THIS SOFTWARE IS PROVIDED BY APPLE INC. AND ITS CONTRIBUTORS ``AS IS''
14  * AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO,
15  * THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR
16  * PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL APPLE INC. OR ITS CONTRIBUTORS
17  * BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR
18  * CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF
19  * SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS
20  * INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN
21  * CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE)
22  * ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF
23  * THE POSSIBILITY OF SUCH DAMAGE.
24  */
25 .toolbar .dashboard.debugger {
26     display: -webkit-flex;
27     -webkit-flex-wrap: nowrap;
28     -webkit-justify-content: center;
29     -webkit-align-items: center;
30
31     font-size: 11px;
32     font-family: Lucida Grande, sans-serif;
33     text-align: center;
34     text-shadow: rgba(255, 255, 255, 0.5) 0 1px 0;
35     color: rgb(60, 60, 60);
36     padding: 0 5px;
37 }
38
39 .dashboard.debugger > .message {
40     font-weight: bold;
41 }
42
43 .dashboard.debugger .navigation-bar {
44     border: 0;
45     margin: 0 5px 0 -5px;
46 }
47
48 .toolbar:not(.small-size) .dashboard.debugger .navigation-bar {
49     margin-top: 1px;
50 }
51
52 .dashboard.debugger .navigation-bar .item.button {
53     -webkit-flex-direction: row;
54     width: 16px;
55     cursor: pointer;
56     padding: 0;
57 }
58
59 .dashboard.debugger .navigation-bar .item.button > .glyph {
60     width: 16px;
61     height: 16px;
62     -webkit-animation-name: pulse-pause-button;
63     -webkit-animation-duration: 1s;
64     -webkit-animation-timing-function: ease-out;
65     -webkit-animation-iteration-count: infinite;
66     -webkit-animation-direction: alternate;
67     background-color: rgb(102, 155, 199) !important;
68 }
69
70 @-webkit-keyframes pulse-pause-button {
71     from { opacity: 0.7; -webkit-transform: scale(1); }
72     to { opacity: 1; -webkit-transform: scale(1.1); }
73 }
74
75 .dashboard.debugger > .divider {
76     width: 1px;
77     height: 100%;
78
79     margin: 0 10px;
80
81     background-image: linear-gradient(rgb(190, 190, 190), rgb(190, 190, 190));
82     background-size: 100% 66%;
83     background-repeat: no-repeat;
84     background-position: center;
85 }
86
87 .dashboard.debugger > div {
88     display: -webkit-flex;
89     -webkit-align-items: center;
90 }
91
92 .dashboard.debugger > .location > :first-child {
93     -webkit-align-self: center;
94     width: 16px;
95     height: 16px;
96     margin-right: 5px;
97 }
98
99 .toolbar:not(.small-size) .dashboard.debugger > .location :not(:first-child) {
100     margin-top: 1px;
101 }
102
103 .dashboard.debugger > .location img.icon {
104     width: 16px;
105     height: 16px;
106 }
107
108 .dashboard.debugger > .location .function-name {
109     color: rgb(30, 30, 30);
110 }
111
112 .dashboard.debugger > .location .function-name::after {
113     content: '\00A0\2014\00A0'; /*  —  */
114 }
115
116 .dashboard.debugger > .location .go-to-link {
117     padding-bottom: 1px;
118     -webkit-text-decoration-color: #aaa;
119 }
120
121 .toolbar.collapsed .dashboard.debugger > :not(.message):not(.navigation-bar ) {
122     display: none;
123 }
124
125 .toolbar.small-size .dashboard.debugger > .message {
126     font-size: 10px;
127 }
128
129 .toolbar.small-size .dashboard.debugger > .location img.icon,
130 .toolbar.small-size .dashboard.debugger > .location > :first-child {
131     width: 14px;
132     height: 14px;
133 }