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

Issues Search
    My Issues | Starred     Open | Closed | All

Side by Side Diff: tracing/tracing/ui/extras/about_tracing/record_selection_dialog.html

Issue 3002533002: Switch tracing to new flexbox. (Closed)
Patch Set: Created 3 years, 4 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
« no previous file with comments | « tracing/tracing/ui/extras/about_tracing/profiling_view.html ('k') | tracing/tracing/ui/extras/chrome/cc/display_item_debugger.html » ('j') | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
1 <!DOCTYPE html> 1 <!DOCTYPE html>
2 <!-- 2 <!--
3 Copyright (c) 2013 The Chromium Authors. All rights reserved. 3 Copyright (c) 2013 The Chromium Authors. All rights reserved.
4 Use of this source code is governed by a BSD-style license that can be 4 Use of this source code is governed by a BSD-style license that can be
5 found in the LICENSE file. 5 found in the LICENSE file.
6 --> 6 -->
7 <link rel="import" href="/tracing/core/filter.html"> 7 <link rel="import" href="/tracing/core/filter.html">
8 <link rel="import" href="/tracing/ui/base/dom_helpers.html"> 8 <link rel="import" href="/tracing/ui/base/dom_helpers.html">
9 <link rel="import" href="/tracing/ui/base/info_bar_group.html"> 9 <link rel="import" href="/tracing/ui/base/info_bar_group.html">
10 <link rel="import" href="/tracing/ui/base/overlay.html"> 10 <link rel="import" href="/tracing/ui/base/overlay.html">
11 <link rel="import" href="/tracing/ui/base/utils.html"> 11 <link rel="import" href="/tracing/ui/base/utils.html">
12 12
13 <template id="record-selection-dialog-template"> 13 <template id="record-selection-dialog-template">
14 <style> 14 <style>
15 .categories-column-view { 15 .categories-column-view {
16 display: -webkit-flex; 16 display: flex;
17 -webkit-flex-direction: column; 17 flex-direction: column;
18 font-family: sans-serif; 18 font-family: sans-serif;
19 max-width: 640px; 19 max-width: 640px;
20 min-height: 0; 20 min-height: 0;
21 min-width: 0; 21 min-width: 0;
22 opacity: 1; 22 opacity: 1;
23 transition: max-height 1s ease, max-width 1s ease, opacity 1s ease; 23 transition: max-height 1s ease, max-width 1s ease, opacity 1s ease;
24 will-change: opacity; 24 will-change: opacity;
25 } 25 }
26 26
27 .categories-column-view-hidden { 27 .categories-column-view-hidden {
28 max-height: 0; 28 max-height: 0;
29 max-width: 0; 29 max-width: 0;
30 opacity: 0; 30 opacity: 0;
31 overflow: hidden; 31 overflow: hidden;
32 display: none; 32 display: none;
33 } 33 }
34 34
35 .categories-selection { 35 .categories-selection {
36 display: -webkit-flex; 36 display: flex;
37 -webkit-flex-direction: row; 37 flex-direction: row;
38 } 38 }
39 39
40 .category-presets { 40 .category-presets {
41 padding: 4px; 41 padding: 4px;
42 } 42 }
43 43
44 .category-description { 44 .category-description {
45 color: #aaa; 45 color: #aaa;
46 font-size: small; 46 font-size: small;
47 max-height: 1em; 47 max-height: 1em;
48 opacity: 1; 48 opacity: 1;
49 padding-left: 4px; 49 padding-left: 4px;
50 padding-right: 4px; 50 padding-right: 4px;
51 text-align: right; 51 text-align: right;
52 transition: max-height 1s ease, opacity 1s ease; 52 transition: max-height 1s ease, opacity 1s ease;
53 will-change: opacity; 53 will-change: opacity;
54 } 54 }
55 55
56 .category-description-hidden { 56 .category-description-hidden {
57 max-height: 0; 57 max-height: 0;
58 opacity: 0; 58 opacity: 0;
59 } 59 }
60 60
61 .default-enabled-categories, 61 .default-enabled-categories,
62 .default-disabled-categories { 62 .default-disabled-categories {
63 -webkit-flex: 1 1 auto; 63 flex: 1 1 auto;
64 display: -webkit-flex; 64 display: flex;
65 -webkit-flex-direction: column; 65 flex-direction: column;
66 padding: 4px; 66 padding: 4px;
67 width: 300px; 67 width: 300px;
68 } 68 }
69 69
70 .default-enabled-categories > div, 70 .default-enabled-categories > div,
71 .default-disabled-categories > div { 71 .default-disabled-categories > div {
72 padding: 4px; 72 padding: 4px;
73 } 73 }
74 74
75 .tracing-modes { 75 .tracing-modes {
76 -webkit-flex: 1 0 auto; 76 flex: 1 0 auto;
77 display: -webkit-flex; 77 display: flex;
78 -webkit-flex-direction: reverse; 78 flex-direction: reverse;
79 padding: 4px; 79 padding: 4px;
80 border-bottom: 2px solid #ddd; 80 border-bottom: 2px solid #ddd;
81 border-top: 2px solid #ddd; 81 border-top: 2px solid #ddd;
82 } 82 }
83 83
84 .default-disabled-categories { 84 .default-disabled-categories {
85 border-left: 2px solid #ddd; 85 border-left: 2px solid #ddd;
86 } 86 }
87 87
88 .warning-default-disabled-categories { 88 .warning-default-disabled-categories {
89 display: inline-block; 89 display: inline-block;
90 font-weight: bold; 90 font-weight: bold;
91 text-align: center; 91 text-align: center;
92 color: #BD2E2E; 92 color: #BD2E2E;
93 width: 2.0ex; 93 width: 2.0ex;
94 height: 2.0ex; 94 height: 2.0ex;
95 border-radius: 2.0ex; 95 border-radius: 2.0ex;
96 border: 1px solid #BD2E2E; 96 border: 1px solid #BD2E2E;
97 } 97 }
98 98
99 .categories { 99 .categories {
100 font-size: 80%; 100 font-size: 80%;
101 padding: 10px; 101 padding: 10px;
102 -webkit-flex: 1 1 auto; 102 flex: 1 1 auto;
103 } 103 }
104 104
105 .group-selectors { 105 .group-selectors {
106 font-size: 80%; 106 font-size: 80%;
107 border-bottom: 1px solid #ddd; 107 border-bottom: 1px solid #ddd;
108 padding-bottom: 6px; 108 padding-bottom: 6px;
109 -webkit-flex: 0 0 auto; 109 flex: 0 0 auto;
110 } 110 }
111 111
112 .group-selectors button { 112 .group-selectors button {
113 padding: 1px; 113 padding: 1px;
114 } 114 }
115 115
116 .record-selection-dialog .labeled-option-group { 116 .record-selection-dialog .labeled-option-group {
117 -webkit-flex: 0 0 auto; 117 flex: 0 0 auto;
118 -webkit-flex-direction: column; 118 flex-direction: column;
119 display: -webkit-flex; 119 display: flex;
120 } 120 }
121 121
122 .record-selection-dialog .labeled-option { 122 .record-selection-dialog .labeled-option {
123 border-top: 5px solid white; 123 border-top: 5px solid white;
124 border-bottom: 5px solid white; 124 border-bottom: 5px solid white;
125 } 125 }
126 126
127 .record-selection-dialog .edit-categories { 127 .record-selection-dialog .edit-categories {
128 padding-left: 6px; 128 padding-left: 6px;
129 } 129 }
(...skipping 549 matching lines...) Expand 10 before | Expand all | Expand 10 after
679 } 679 }
680 warningLink.onclick = onClickHandler.bind(this); 680 warningLink.onclick = onClickHandler.bind(this);
681 } 681 }
682 }; 682 };
683 683
684 return { 684 return {
685 RecordSelectionDialog, 685 RecordSelectionDialog,
686 }; 686 };
687 }); 687 });
688 </script> 688 </script>
OLDNEW
« no previous file with comments | « tracing/tracing/ui/extras/about_tracing/profiling_view.html ('k') | tracing/tracing/ui/extras/chrome/cc/display_item_debugger.html » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698