Skip to content
This repository was archived by the owner on Nov 5, 2024. It is now read-only.

Commit d8336fe

Browse files
committed
New Release
1 parent 25343c4 commit d8336fe

File tree

277 files changed

+21326
-2416
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

277 files changed

+21326
-2416
lines changed

background.js

+2-2
Original file line numberDiff line numberDiff line change
@@ -188,8 +188,8 @@
188188
--text-color: ${foreground};
189189
--parameters-color: ${parameters};
190190
191-
--font-family: ${fontFamily};
192-
--font-size: ${fontSize}px;
191+
--font-family: ${fontFamily}, Menlo, Consolas, "Fira Code", monospace;
192+
--font-size: ${fontSize || 10}px;
193193
}
194194
`;
195195
},

cypress.json

-4
This file was deleted.

docs/banner.png

281 KB
Loading

docs/brand.png

19.9 KB
Loading

docs/logo.png

15.7 KB
Loading

gulpfile.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ const cleanCSS = require('gulp-clean-css');
55

66
const paths = {
77
styles: {
8-
src: 'scss/*.scss',
8+
src: 'new/**/*.scss',
99
dest: 'dist'
1010
}
1111
};

manifest.json

+5-5
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
{
2-
"name": "Material Theme UI for DevTools",
3-
"version": "1.0",
4-
"description": "Material Theme UI for DevTools",
5-
"short_name": "Material Theme DevTools",
2+
"name": "Material DevTools Theme Collection",
3+
"version": "2.0",
4+
"description": "Material DevTools Theme Collection",
5+
"short_name": "Material DevTools",
66
"manifest_version": 2,
77
"author": "Elior Boukhobza (mallowigi)",
88
"devtools_page": "devtools.html",
@@ -14,7 +14,7 @@
1414
],
1515
"browser_action": {
1616
"default_icon": "icon128.png",
17-
"default_title": "Material UI Devtools Settings",
17+
"default_title": "Material DevTools Settings",
1818
"default_popup": "/public/index.html"
1919
},
2020
"icons": {

new/app/_index.scss

+2
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
@import "mixins";
2+
@import "themed/index";

new/app/_mixins.scss

+25
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
@mixin indicator {
2+
&::before {
3+
content: '';
4+
position: absolute;
5+
left: 0;
6+
top: 0;
7+
bottom: 0;
8+
width: 3px;
9+
height: 100%;
10+
background: $accent1;
11+
}
12+
}
13+
14+
@mixin indicator-right {
15+
&::before {
16+
content: '';
17+
position: absolute;
18+
right: 0;
19+
top: 0;
20+
bottom: 0;
21+
width: 3px;
22+
height: 100%;
23+
background: $accent1;
24+
}
25+
}

new/app/themed/_index.scss

+27
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
@import "accessibility/index";
2+
@import "animation/index";
3+
@import "audits/index";
4+
@import "browser_debugger/index";
5+
@import "codemirror/index";
6+
@import "colorpicker/index";
7+
@import "console/index";
8+
@import "data_grid/index";
9+
@import "elements/index";
10+
@import "help/index";
11+
@import "inline_editor/index";
12+
@import "inspector_main/index";
13+
@import "network/index";
14+
@import "object_ui/index";
15+
@import "perf_ui/index";
16+
@import "product_registry/index";
17+
@import "profiler/index";
18+
@import "quick_open/index";
19+
@import "resources/index";
20+
@import "search/index";
21+
@import "security/index";
22+
@import "settings/index";
23+
@import "source_frame/index";
24+
@import "sources/index";
25+
@import "text_editor/index";
26+
@import "timeline/index";
27+
@import "ui/index";
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
.tree-outline li.property {
2+
color: $attribute-name-color;
3+
}
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
.ax-name {
2+
color: $var-color;
3+
}
4+
5+
.ax-value-string {
6+
color: $string-color;
7+
}
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,42 @@
1+
.ax-breadcrumbs .ax-node::before {
2+
background-color: $foreground;
3+
&:hover {
4+
background-color: $accent1;
5+
}
6+
}
7+
8+
.ax-breadcrumbs .ax-node.preselected:not(.inspected) .selection,
9+
.ax-breadcrumbs .ax-node.hovered:not(.inspected) .selection {
10+
background-color: $tree;
11+
}
12+
13+
.ax-breadcrumbs .ax-node.preselected:not(.inspected):focus .selection {
14+
border-top-color: $tree;
15+
border-right-color: $tree;
16+
border-bottom-color: $tree;
17+
border-left-color: $tree;
18+
}
19+
20+
.ax-breadcrumbs .ax-node.inspected .selection {
21+
background-color: $highlight;
22+
}
23+
24+
.ax-breadcrumbs .ax-node.inspected:focus .selection {
25+
background-color: $selBg;
26+
}
27+
28+
.ax-breadcrumbs .ax-node.parent.inspected:focus::before {
29+
background-color: $highlight;
30+
}
31+
32+
.ax-breadcrumbs .ax-node.inspected:focus {
33+
color: $selFg;
34+
}
35+
36+
.ax-breadcrumbs .ax-readable-string {
37+
color: $string-color;
38+
}
39+
40+
.ax-breadcrumbs .ax-internal-role {
41+
color: $number-color;
42+
}
+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
@import "accessibilityNode";
2+
@import "accessibilityProperties";
3+
@import "axBreadcrumbs";
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,127 @@
1+
.animation-node-row {
2+
border-bottom-color: $border;
3+
}
4+
5+
.animation-node-description {
6+
border-bottom-color: $borderLight;
7+
background-color: $background;
8+
}
9+
10+
circle.animation-keyframe-point {
11+
fill: $foreground;
12+
}
13+
14+
.animation-name {
15+
color: $foreground;
16+
}
17+
18+
.animation-timeline-toolbar-container {
19+
background-color: $contrast;
20+
}
21+
22+
.animation-timeline-header {
23+
border-bottom-color: $borderLight;
24+
}
25+
26+
.animation-timeline-header::after {
27+
background-color: $background;
28+
border-right-color: $border
29+
}
30+
31+
.animation-timeline-buffer,
32+
.animation-timeline-buffer-hint {
33+
border-bottom-color: $border;
34+
}
35+
36+
.animation-time-overlay {
37+
background-color: white;
38+
}
39+
40+
.animation-scrubber {
41+
border-left-color: $accent1;
42+
}
43+
44+
.animation-scrubber-line {
45+
background-image: linear-gradient(to right, rgba(255, 255, 255, 0) 5px, $accent1 5px, $accent1 6px, rgba(255, 255, 255, 0) 6px);
46+
}
47+
48+
.animation-scrubber-head {
49+
background-color: $accent1;
50+
}
51+
52+
rect.animation-timeline-grid-line {
53+
fill: $accent2;
54+
}
55+
56+
text.animation-timeline-grid-label {
57+
fill: $foreground;
58+
}
59+
60+
.animation-node-row.animation-node-selected {
61+
background-color: $tree;
62+
}
63+
64+
.animation-node-selected > .animation-node-description {
65+
background-color: $selBg;
66+
}
67+
68+
.animation-buffer-preview {
69+
background-color: var(--toolbar-bg-color);
70+
}
71+
72+
.animation-buffer-preview-animation {
73+
background-color: $second;
74+
border-right-color: $borderLight;
75+
}
76+
77+
.animation-buffer-preview:not(.selected):hover {
78+
background-color: $highlight;
79+
}
80+
81+
.animation-buffer-preview.selected {
82+
background-color: $selBg;
83+
}
84+
85+
.animation-paused {
86+
background-color: rgba($highlight, 0.5);
87+
}
88+
89+
.animation-paused::before,
90+
.animation-paused::after {
91+
background-color: $background;
92+
border-top-color: $border;
93+
border-right-color: $border;
94+
border-bottom-color: $border;
95+
border-left-color: $border;
96+
}
97+
98+
.animation-buffer-preview.selected > svg > line {
99+
stroke: $selFg !important;
100+
}
101+
102+
.animation-playback-rate-button {
103+
background-color: $background;
104+
border-top-color: $button;
105+
border-right-color: $button;
106+
border-bottom-color: $button;
107+
border-left-color: $button;
108+
color: $primary;
109+
}
110+
111+
.animation-playback-rate-button:not(.selected):hover {
112+
background-color: $highlight;
113+
}
114+
115+
.animation-playback-rate-button.selected {
116+
color: $selFg;
117+
background-color: $accent1;
118+
}
119+
120+
.animation-playback-rate-button.selected:first-child {
121+
color: $selFg;
122+
background-color: $accent1;
123+
}
124+
125+
.animation-remove-button:hover {
126+
background-color: $highlight;
127+
}

new/app/themed/animation/_index.scss

+1
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
@import "animationTimeline";
+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
.audits2 .toolbar {
2+
background-color: $contrast;
3+
}
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
.audits2-start-view-text {
2+
color: $primary;
3+
}
4+
5+
.audits2-start-view-text h2 {
6+
color: $foreground;
7+
}
8+
9+
.audits2-form-section {
10+
border-top-color: $border;
11+
}
12+
13+
.audits2-help-text {
14+
color: $link-color;
15+
}

new/app/themed/audits/_index.scss

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
@import "audits2Panel";
2+
@import "audits2StartView";
3+
@import "lightHouseReport";

0 commit comments

Comments
 (0)