Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(425)

Side by Side Diff: runtime/bin/vmservice/client/lib/src/elements/code_view.html

Issue 199363002: Rework library and class view pages. (Closed) Base URL: https://dart.googlecode.com/svn/branches/bleeding_edge/dart
Patch Set: merge Created 6 years, 9 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch | Annotate | Revision Log
OLDNEW
1 <link rel="import" href="function_ref.html"> 1 <link rel="import" href="function_ref.html">
2 <link rel="import" href="instance_ref.html"> 2 <link rel="import" href="instance_ref.html">
3 <link rel="import" href="observatory_element.html"> 3 <link rel="import" href="observatory_element.html">
4 <link rel="import" href="nav_bar.html"> 4 <link rel="import" href="nav_bar.html">
5 <polymer-element name="code-view" extends="observatory-element"> 5 <polymer-element name="code-view" extends="observatory-element">
6 <template> 6 <template>
7 <nav-bar> 7 <nav-bar>
8 <top-nav-menu></top-nav-menu> 8 <top-nav-menu></top-nav-menu>
9 <isolate-nav-menu isolate="{{ code.isolate }}"></isolate-nav-menu> 9 <isolate-nav-menu isolate="{{ code.isolate }}"></isolate-nav-menu>
10 <nav-menu link="." anchor="{{ code.name }}" last="{{ true }}"></nav-menu> 10 <nav-menu link="." anchor="{{ code.name }}" last="{{ true }}"></nav-menu>
11 <nav-refresh callback="{{ refresh }}"></nav-refresh> 11 <nav-refresh callback="{{ refresh }}"></nav-refresh>
12 </nav-bar> 12 </nav-bar>
13 <style> 13 <style>
14 .content { 14 .content {
15 padding-left: 10%; 15 padding-left: 10%;
16 font: 400 14px 'Montserrat', sans-serif; 16 font: 400 14px 'Montserrat', sans-serif;
17 } 17 }
18 h1 { 18 h1 {
19 font: 400 18px 'Montserrat', sans-serif; 19 font: 400 18px 'Montserrat', sans-serif;
20 } 20 }
21 .member, .memberHeader { 21 .memberList {
22 display: table;
23 }
24 .memberItem {
25 display: table-row;
26 }
27 .memberName, .memberValue {
28 display: table-cell;
22 vertical-align: top; 29 vertical-align: top;
23 padding: 3px 0 3px 1em; 30 padding: 3px 0 3px 1em;
24 font: 400 14px 'Montserrat', sans-serif; 31 font: 400 14px 'Montserrat', sans-serif;
25 } 32 }
26 .monospace { 33 .monospace {
27 font-family: consolas, courier, monospace; 34 font-family: consolas, courier, monospace;
28 font-size: 1em; 35 font-size: 1em;
29 line-height: 1.2em; 36 line-height: 1.2em;
30 white-space: nowrap; 37 white-space: nowrap;
31 } 38 }
32 </style> 39 </style>
33 <div class="content"> 40 <div class="content">
34 <h1>Code for {{ code.name }}</h1> 41 <h1>Code for {{ code.name }}</h1>
35 <table> 42 <div class="memberList">
36 <tr> 43 <div class="memberItem">
37 <td class="memberHeader">kind</td> 44 <div class="memberName">kind</div>
38 <td class="member">{{code.kind}}</td> 45 <div class="memberValue">{{code.kind}}</div>
39 </tr> 46 </div>
40 <tr> 47 <div class="memberItem">
41 <td class="memberHeader">function</td> 48 <div class="memberName">function</div>
42 <td class="member"> 49 <div class="memberValue">
43 <function-ref ref="{{code.function}}"> 50 <function-ref ref="{{code.function}}">
44 </function-ref> 51 </function-ref>
45 </td> 52 </div>
46 </tr> 53 </div>
47 <tr> 54 <div class="memberItem">
48 <td class="memberHeader">Inclusive</td> 55 <div class="memberName">Inclusive</div>
49 <td class="member">{{ code.formattedInclusiveTicks }}</td> 56 <div class="memberValue">{{ code.formattedInclusiveTicks }}</div>
50 </tr> 57 </div>
51 <tr> 58 <div class="memberItem">
52 <td class="memberHeader">Exclusive</td> 59 <div class="memberName">Exclusive</div>
53 <td class="member">{{ code.formattedExclusiveTicks }}</td> 60 <div class="memberValue">{{ code.formattedExclusiveTicks }}</div>
54 </tr> 61 </div>
55 <tr> 62 <div class="memberItem">
56 <td class="memberHeader">Constant object pool</td> 63 <div class="memberName">Constant object pool</div>
57 <td class="member"> 64 <div class="memberValue">
58 <instance-ref ref="{{ code.objectPool }}"></instance-ref> 65 <instance-ref ref="{{ code.objectPool }}"></instance-ref>
59 </td> 66 </div>
60 </tr> 67 </div>
61 </table> 68 </div>
62 </div> 69 </div>
63 <hr> 70 <hr>
64 <div class="content"> 71 <div class="content">
65 <template if="{{ code.hasDisassembly }}"> 72 <template if="{{ code.hasDisassembly }}">
66 <div class="row"> 73 <div class="row">
67 <div class="col-md-2 memberHeader">Inclusive</div> 74 <div class="col-md-2 memberHeader">Inclusive</div>
68 <div class="col-md-2 memberHeader">Exclusive</div> 75 <div class="col-md-2 memberHeader">Exclusive</div>
69 <div class="col-md-2 memberHeader">Address</div> 76 <div class="col-md-2 memberHeader">Address</div>
70 <div class="col-md-6 memberHeader">Disassembly</div> 77 <div class="col-md-6 memberHeader">Disassembly</div>
71 </div> 78 </div>
72 </template> 79 </template>
73 <template repeat="{{ instruction in code.instructions }}"> 80 <template repeat="{{ instruction in code.instructions }}">
74 <div class="row"> 81 <div class="row">
75 <div class="col-md-2 monospace">{{ instruction.formattedInclusive(code ) }}</div> 82 <div class="col-md-2 monospace">{{ instruction.formattedInclusive(code ) }}</div>
76 <div class="col-md-2 monospace">{{ instruction.formattedExclusive(code ) }}</div> 83 <div class="col-md-2 monospace">{{ instruction.formattedExclusive(code ) }}</div>
77 <div class="col-md-2 monospace">{{ instruction.formattedAddress() }}</ div> 84 <div class="col-md-2 monospace">{{ instruction.formattedAddress() }}</ div>
78 <div class="col-md-6 monospace">{{ instruction.human }}</div> 85 <div class="col-md-6 monospace">{{ instruction.human }}</div>
79 </div> 86 </div>
80 </template> 87 </template>
81 </div> 88 </div>
82 </template> 89 </template>
83 <script type="application/dart" src="code_view.dart"></script> 90 <script type="application/dart" src="code_view.dart"></script>
84 </polymer-element> 91 </polymer-element>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698