X-Git-Url: https://git-public.kairo.at/?p=themes.git;a=blobdiff_plain;f=LCARStrek%2Fbrowser%2Fdevtools%2Fruleview.css;h=df694709e25536b55c0edf0d701a1701ee5feec3;hp=f19670a369a3d034e2315e8987281cb8fdddd795;hb=9168a62c02f1b9fe7953f2fba5f32305980ac1a3;hpb=ed1a91c660e33123a3167af0806d58e00845240b diff --git a/LCARStrek/browser/devtools/ruleview.css b/LCARStrek/browser/devtools/ruleview.css index f19670a3..df694709 100644 --- a/LCARStrek/browser/devtools/ruleview.css +++ b/LCARStrek/browser/devtools/ruleview.css @@ -8,13 +8,26 @@ .ruleview-rule-source { -moz-padding-start: 5px; - cursor: pointer; text-align: right; float: right; -moz-user-select: none; } -.ruleview-rule-inheritance { +.ruleview-rule-source, +.ruleview-rule-source > label { + cursor: pointer; +} + +.ruleview-rule-source[unselectable], +.ruleview-rule-source[unselectable] > label { + cursor: default; +} + +.ruleview-rule-source:not([unselectable]):hover { + text-decoration: underline; +} + +.ruleview-header { border-top-width: 1px; border-bottom-width: 1px; border-top-style: solid; @@ -22,10 +35,7 @@ padding: 1px 4px; margin-top: 4px; -moz-user-select: none; -} - -.ruleview-rule-source:hover { - text-decoration: underline; + word-wrap: break-word; } .ruleview-rule, @@ -33,6 +43,34 @@ padding: 2px 4px; } +/* User agent styles are not editable, display them differently */ +.theme-dark .ruleview-rule[uneditable=true] { + background: #A09090; /* Tab Toolbar */ +} + +.ruleview-rule[uneditable=true] :focus { + outline: none; +} + +.ruleview-rule[uneditable=true] .theme-link { + color: #336699; /* Blue - Grey */ +} + +.ruleview-rule[uneditable=true] .ruleview-enableproperty { + visibility: hidden; +} + +.ruleview-rule[uneditable=true] .ruleview-colorswatch, +.ruleview-rule[uneditable=true] .ruleview-bezierswatch { + cursor: default; +} + + +.ruleview-rule[uneditable=true] .ruleview-namecontainer > .ruleview-propertyname, +.ruleview-rule[uneditable=true] .ruleview-propertycontainer > .ruleview-propertyvalue { + border-bottom-color: transparent; +} + #noResults { font: message-box; color: #8050B0; @@ -44,13 +82,20 @@ } .ruleview-warning { - background: url("chrome://browser/skin/devtools/alerticon-warning.png"); + background: url("alerticon-warning.png"); -moz-margin-start: 5px; - vertical-align: middle; + display: inline-block; + vertical-align: top; width: 13px; height: 12px; } +@media (min-resolution: 2dppx) { + .ruleview-warning { + background-image: url("alerticon-warning@2x.png"); + } +} + .ruleview-ruleopen { -moz-padding-end: 5px; } @@ -95,6 +140,46 @@ -moz-margin-start: 35px; } +.ruleview-colorswatch, +.ruleview-bezierswatch { + cursor: pointer; + border-radius: 50%; + width: 1em; + height: 1em; + vertical-align: text-top; + -moz-margin-end: 5px; + display: inline-block; + position: relative; +} + +.ruleview-colorswatch::before { + content: ''; + background-color: #9C9CFF; + background-image: linear-gradient(45deg, #A09090 25%, transparent 25%, transparent 75%, #A09090 75%, #A09090), + linear-gradient(45deg, #A09090 25%, transparent 25%, transparent 75%, #A09090 75%, #A09090); + background-size: 12px 12px; + background-position: 0 0, 6px 6px; + position: absolute; + border-radius: 50%; + top: 0; + left: 0; + right: 0; + bottom: 0; + z-index: -1; +} + +.ruleview-bezierswatch { + background: url("chrome://browser/skin/devtools/cubic-bezier-swatch.png"); + background-size: 1em; +} + +@media (min-resolution: 2dppx) { + .ruleview-bezierswatch { + background: url("chrome://browser/skin/devtools/cubic-bezier-swatch@2x.png"); + background-size: 1em; + } +} + .ruleview-overridden { text-decoration: line-through; } @@ -105,7 +190,8 @@ } .ruleview-property { - border-left: 2px solid transparent; + border-left: 3px solid transparent; + clear: right; } .ruleview-property > * { @@ -113,7 +199,7 @@ } .ruleview-property[dirty] { - border-left-color: #9C9CFF; + border-left-color: #9C9CFF; /* Green */ } .ruleview-namecontainer > .ruleview-propertyname, @@ -126,6 +212,10 @@ border-bottom-color: #008484; } +.ruleview-selector { + word-wrap: break-word; +} + .ruleview-selector-separator, .ruleview-selector-unmatched { color: #8050B0; }