Skip to content

Commit

Permalink
Merge pull request #140 from MethodGrab/inactive-selectors
Browse files Browse the repository at this point in the history
Style inactive selectors less prominently
  • Loading branch information
micjamking committed Mar 30, 2016
2 parents c83c80f + 4906a83 commit 9176c54
Showing 1 changed file with 39 additions and 31 deletions.
70 changes: 39 additions & 31 deletions app/styles/modules/_common-styles.scss
Original file line number Diff line number Diff line change
Expand Up @@ -61,11 +61,11 @@ $accent // Accent / Highlight

.cm-execution-line-tail {
background-color: lighten($selectors, 15%) !important;

@if ( lightness( lighten($selectors, 15%) ) > 60 ) {
color: white !important;
} @else {
color: $background !important;
color: $background !important;
}
}

Expand Down Expand Up @@ -101,13 +101,13 @@ $accent // Accent / Highlight
position: relative;
margin-right: 1px;
margin-top: 0;

@if $dark-theme == true {
background: darken($background, 2%);
} @else {
background: darken($background, 1.5%);
background: darken($background, 1.5%);
}

border: 0 none !important;
box-shadow: inset 0 1px 0 darken($background, 3.5%),
inset 0 -1px 0 darken($background, 3.5%);
Expand Down Expand Up @@ -196,7 +196,7 @@ $accent // Accent / Highlight
z-index: 9;
}
}

// Console
.console-view {
.toolbar {
Expand All @@ -210,7 +210,7 @@ $accent // Accent / Highlight
}
}
}

#console-messages {
color: $body-text;
}
Expand Down Expand Up @@ -302,7 +302,7 @@ $accent // Accent / Highlight
.console-view-object-properties-section::shadow .object-value-array,
.console-view-object-properties-section::shadow .tree-element-title,
.console-view-object-properties-section::shadow .info,
.object-value-number,
.object-value-number,
.object-value-boolean,
.object-value-string,
.object-value-regexp,
Expand Down Expand Up @@ -334,9 +334,9 @@ $accent // Accent / Highlight
::shadow .object-value-function,
::shadow .object-value-function::before,
::shadow .webkit-html-tag,
::shadow .webkit-html-tag-name,
::shadow .webkit-html-tag-name,
::shadow .webkit-html-close-tag-name,
.webkit-html-tag-name,
.webkit-html-tag-name,
.webkit-html-close-tag-name {
color: $selectors !important;
}
Expand Down Expand Up @@ -611,7 +611,7 @@ $accent // Accent / Highlight
#elements-content ::shadow .selected .being-edited.editing {
color: #333 !important;
}

.CodeMirror-selected {
background: $selectors;
}
Expand All @@ -628,13 +628,13 @@ $accent // Accent / Highlight

.elements {

.split-view-sidebar,
.insertion-point-sidebar,
::shadow .split-view-sidebar,
.split-view-sidebar,
.insertion-point-sidebar,
::shadow .split-view-sidebar,
::shadow .insertion-point-sidebar, .sources .split-view-sidebar {
background: inherit !important;
}

::shadow .shadow-split-widget.hbox > .shadow-split-widget-sidebar:not(.maximized) {
border-left: 1px solid darken($background, 3.5%) !important;
border-right: 0 none !important;
Expand Down Expand Up @@ -686,7 +686,7 @@ $accent // Accent / Highlight
@if $dark-theme == true {
background: darken($background, 2%);
} @else {
background: darken($background, 1.5%);
background: darken($background, 1.5%);
}

border: 0 none !important;
Expand Down Expand Up @@ -737,7 +737,7 @@ $accent // Accent / Highlight
.toolbar {
border-color: darken($background, 3.5%) !important;

/deep/ .glyph,
/deep/ .glyph,
/deep/ .long-click-glyph {
background-color: $comments !important;
}
Expand Down Expand Up @@ -804,7 +804,7 @@ $accent // Accent / Highlight

.metrics {
border-color: darken($background, 3.5%) !important;

.margin,
.border,
.padding,
Expand All @@ -831,7 +831,7 @@ $accent // Accent / Highlight
background-color: $background-highlight;
}

.styles-section .style-properties li.filter-match,
.styles-section .style-properties li.filter-match,
.styles-section .simple-selector.filter-match {
background-color: $selectors;
@if $dark-theme == true {
Expand All @@ -849,14 +849,14 @@ $accent // Accent / Highlight
.tree-outline {
.webkit-css-property,
.name {
color: $property;
color: $property;
}

.value,
.selection,
.parent {
color: $body-text !important;
}
}

li:hover {
background-color: $background-highlight !important;
Expand Down Expand Up @@ -895,6 +895,14 @@ $accent // Accent / Highlight
color: $selectors;
}

.simple-selector:not(.selector-matches) {
@if $dark-theme == true {
color: rgba($selectors, 0.6);
} @else {
color: rgba($selectors, 0.35);
}
}

// CSS-Keyword
.cm-css-keyword {
color: $keyword;
Expand All @@ -904,16 +912,16 @@ $accent // Accent / Highlight
.cm-css-variable-3 {
color: $pseudo !important;
}

}

#elements-content ::shadow .selected .being-edited.editing *,
#elements-content ::shadow .selected .being-edited.editing *,
::shadow #elements-content ::shadow .selected .being-edited.editing *{
color: #333 !important;
}

::shadow .elements-disclosure {

li.selected .selection,
ol:focus li.selected .selection {
/* min-height: 22px !important; */
Expand All @@ -924,7 +932,7 @@ $accent // Accent / Highlight
#elements-crumbs {
background-color: darken($background, 3.5%) !important;
border-top: 0 none !important;

::shadow .crumbs .crumb {
color: $comments;

Expand All @@ -936,7 +944,7 @@ $accent // Accent / Highlight
}
background-color: $background-highlight;
}

&.selected,
&.selected:hover {
@if $dark-theme == true {
Expand All @@ -947,12 +955,12 @@ $accent // Accent / Highlight
background-color: $background;
}
}
}
}
}

.inspector-view-tabbed-pane.tabbed-pane:not(.insertion-point-sidebar)::shadow,
.inactive .inspector-view-tabbed-pane.tabbed-pane:not(.insertion-point-sidebar)::shadow {
.tabbed-pane-tab-slider,
.tabbed-pane-tab-slider,
.-theme-selection-color {
background-color: $selectors;
}
Expand All @@ -979,10 +987,10 @@ $accent // Accent / Highlight
background: $selectors;
}
}
::-webkit-scrollbar,
::-webkit-scrollbar-corner,
::-webkit-resizer {
background-color: transparent;
background-color: transparent;
} */
}
}

0 comments on commit 9176c54

Please sign in to comment.