Bug 855502 - we need a proper design for the new checkboxes r=benvie

Bug 855502 - we need a proper design for the new checkboxes r=benvie
This commit is contained in:
Michael Ratcliffe 2013-04-11 16:46:00 +01:00
parent e90b476596
commit 1d4af1abba
15 changed files with 44 additions and 54 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 707 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 700 B

View File

@ -37,19 +37,16 @@
.theme-checkbox { .theme-checkbox {
display: inline-block; display: inline-block;
border: 1px solid rgba(160,160,160,0.4); border: 0;
width: 6px; width: 14px;
height: 6px; height: 14px;
padding: 2px; padding: 0;
background-color: transparent;
background-repeat: no-repeat;
outline: none; outline: none;
background: url("chrome://browser/skin/devtools/checkbox-dark.png") no-repeat;
} }
.theme-checkbox[checked] { .theme-checkbox[checked] {
background-clip: content-box; background: url("chrome://browser/skin/devtools/checkbox-dark.png") 14px 0;
background-image: linear-gradient(to bottom right, transparent 48%, rgba(160,160,160,1) 48%, rgba(160,160,160,1) 52%, transparent 52%),
linear-gradient(to bottom left, transparent 48%, rgba(160,160,160,1) 48%, rgba(160,160,160,1) 52%, transparent 52%);
} }
.theme-selected { .theme-selected {

View File

@ -37,19 +37,16 @@
.theme-checkbox { .theme-checkbox {
display: inline-block; display: inline-block;
border: 1px solid rgba(160,160,160,0.4); border: 0;
width: 6px; width: 14px;
height: 6px; height: 14px;
padding: 2px; padding: 0;
background-color: transparent;
background-repeat: no-repeat;
outline: none; outline: none;
background: url("chrome://browser/skin/devtools/checkbox-light.png") no-repeat;
} }
.theme-checkbox[checked] { .theme-checkbox[checked] {
background-clip: content-box; background: url("chrome://browser/skin/devtools/checkbox-light.png") 14px 0;
background-image: linear-gradient(to bottom right, transparent 48%, rgba(160,160,160,1) 48%, rgba(160,160,160,1) 52%, transparent 52%),
linear-gradient(to bottom left, transparent 48%, rgba(160,160,160,1) 48%, rgba(160,160,160,1) 52%, transparent 52%);
} }
.theme-selected { .theme-selected {

View File

@ -131,6 +131,8 @@ browser.jar:
skin/classic/browser/devtools/webconsole.css (devtools/webconsole.css) skin/classic/browser/devtools/webconsole.css (devtools/webconsole.css)
skin/classic/browser/devtools/webconsole_networkpanel.css (devtools/webconsole_networkpanel.css) skin/classic/browser/devtools/webconsole_networkpanel.css (devtools/webconsole_networkpanel.css)
skin/classic/browser/devtools/webconsole.png (devtools/webconsole.png) skin/classic/browser/devtools/webconsole.png (devtools/webconsole.png)
skin/classic/browser/devtools/checkbox-dark.png (devtools/checkbox-dark.png)
skin/classic/browser/devtools/checkbox-light.png (devtools/checkbox-light.png)
skin/classic/browser/devtools/commandline.css (devtools/commandline.css) skin/classic/browser/devtools/commandline.css (devtools/commandline.css)
skin/classic/browser/devtools/markup-view.css (devtools/markup-view.css) skin/classic/browser/devtools/markup-view.css (devtools/markup-view.css)
skin/classic/browser/devtools/orion.css (devtools/orion.css) skin/classic/browser/devtools/orion.css (devtools/orion.css)

Binary file not shown.

After

Width:  |  Height:  |  Size: 707 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 700 B

View File

@ -37,19 +37,16 @@
.theme-checkbox { .theme-checkbox {
display: inline-block; display: inline-block;
border: 1px solid rgba(160,160,160,0.4); border: 0;
width: 6px; width: 14px;
height: 6px; height: 14px;
padding: 2px; padding: 0;
background-color: transparent;
background-repeat: no-repeat;
outline: none; outline: none;
background: url("chrome://browser/skin/devtools/checkbox-dark.png") no-repeat;
} }
.theme-checkbox[checked] { .theme-checkbox[checked] {
background-clip: content-box; background: url("chrome://browser/skin/devtools/checkbox-dark.png") 14px 0;
background-image: linear-gradient(to bottom right, transparent 48%, rgba(160,160,160,1) 48%, rgba(160,160,160,1) 52%, transparent 52%),
linear-gradient(to bottom left, transparent 48%, rgba(160,160,160,1) 48%, rgba(160,160,160,1) 52%, transparent 52%);
} }
.theme-selected { .theme-selected {

View File

@ -37,19 +37,16 @@
.theme-checkbox { .theme-checkbox {
display: inline-block; display: inline-block;
border: 1px solid rgba(160,160,160,0.4); border: 0;
width: 6px; width: 14px;
height: 6px; height: 14px;
padding: 2px; padding: 0;
background-color: transparent;
background-repeat: no-repeat;
outline: none; outline: none;
background: url("chrome://browser/skin/devtools/checkbox-light.png") no-repeat;
} }
.theme-checkbox[checked] { .theme-checkbox[checked] {
background-clip: content-box; background: url("chrome://browser/skin/devtools/checkbox-light.png") 14px 0;
background-image: linear-gradient(to bottom right, transparent 48%, rgba(160,160,160,1) 48%, rgba(160,160,160,1) 52%, transparent 52%),
linear-gradient(to bottom left, transparent 48%, rgba(160,160,160,1) 48%, rgba(160,160,160,1) 52%, transparent 52%);
} }
.theme-selected { .theme-selected {

View File

@ -216,6 +216,8 @@ browser.jar:
skin/classic/browser/devtools/goto-mdn.png (devtools/goto-mdn.png) skin/classic/browser/devtools/goto-mdn.png (devtools/goto-mdn.png)
skin/classic/browser/devtools/ruleview.css (devtools/ruleview.css) skin/classic/browser/devtools/ruleview.css (devtools/ruleview.css)
skin/classic/browser/devtools/commandline.css (devtools/commandline.css) skin/classic/browser/devtools/commandline.css (devtools/commandline.css)
skin/classic/browser/devtools/checkbox-dark.png (devtools/checkbox-dark.png)
skin/classic/browser/devtools/checkbox-light.png (devtools/checkbox-light.png)
skin/classic/browser/devtools/markup-view.css (devtools/markup-view.css) skin/classic/browser/devtools/markup-view.css (devtools/markup-view.css)
skin/classic/browser/devtools/orion.css (devtools/orion.css) skin/classic/browser/devtools/orion.css (devtools/orion.css)
skin/classic/browser/devtools/orion-container.css (devtools/orion-container.css) skin/classic/browser/devtools/orion-container.css (devtools/orion-container.css)

Binary file not shown.

After

Width:  |  Height:  |  Size: 707 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 700 B

View File

@ -37,19 +37,16 @@
.theme-checkbox { .theme-checkbox {
display: inline-block; display: inline-block;
border: 1px solid rgba(160,160,160,0.4); border: 0;
width: 6px; width: 14px;
height: 6px; height: 14px;
padding: 2px; padding: 0;
background-color: transparent;
background-repeat: no-repeat;
outline: none; outline: none;
background: url("chrome://browser/skin/devtools/checkbox-dark.png") no-repeat;
} }
.theme-checkbox[checked] { .theme-checkbox[checked] {
background-clip: content-box; background: url("chrome://browser/skin/devtools/checkbox-dark.png") 14px 0;
background-image: linear-gradient(to bottom right, transparent 48%, rgba(160,160,160,1) 48%, rgba(160,160,160,1) 52%, transparent 52%),
linear-gradient(to bottom left, transparent 48%, rgba(160,160,160,1) 48%, rgba(160,160,160,1) 52%, transparent 52%);
} }
.theme-selected { .theme-selected {

View File

@ -37,19 +37,16 @@
.theme-checkbox { .theme-checkbox {
display: inline-block; display: inline-block;
border: 1px solid rgba(160,160,160,0.4); border: 0;
width: 6px; width: 14px;
height: 6px; height: 14px;
padding: 2px; padding: 0;
background-color: transparent;
background-repeat: no-repeat;
outline: none; outline: none;
background: url("chrome://browser/skin/devtools/checkbox-light.png") no-repeat;
} }
.theme-checkbox[checked] { .theme-checkbox[checked] {
background-clip: content-box; background: url("chrome://browser/skin/devtools/checkbox-light.png") 14px 0;
background-image: linear-gradient(to bottom right, transparent 48%, rgba(160,160,160,1) 48%, rgba(160,160,160,1) 52%, transparent 52%),
linear-gradient(to bottom left, transparent 48%, rgba(160,160,160,1) 48%, rgba(160,160,160,1) 52%, transparent 52%);
} }
.theme-selected { .theme-selected {

View File

@ -156,6 +156,8 @@ browser.jar:
skin/classic/browser/devtools/command-responsivemode.png (devtools/command-responsivemode.png) skin/classic/browser/devtools/command-responsivemode.png (devtools/command-responsivemode.png)
skin/classic/browser/devtools/command-scratchpad.png (devtools/command-scratchpad.png) skin/classic/browser/devtools/command-scratchpad.png (devtools/command-scratchpad.png)
skin/classic/browser/devtools/command-tilt.png (devtools/command-tilt.png) skin/classic/browser/devtools/command-tilt.png (devtools/command-tilt.png)
skin/classic/browser/devtools/checkbox-dark.png (devtools/checkbox-dark.png)
skin/classic/browser/devtools/checkbox-light.png (devtools/checkbox-light.png)
skin/classic/browser/devtools/markup-view.css (devtools/markup-view.css) skin/classic/browser/devtools/markup-view.css (devtools/markup-view.css)
skin/classic/browser/devtools/orion.css (devtools/orion.css) skin/classic/browser/devtools/orion.css (devtools/orion.css)
skin/classic/browser/devtools/orion-container.css (devtools/orion-container.css) skin/classic/browser/devtools/orion-container.css (devtools/orion-container.css)
@ -396,6 +398,8 @@ browser.jar:
skin/classic/aero/browser/devtools/command-responsivemode.png (devtools/command-responsivemode.png) skin/classic/aero/browser/devtools/command-responsivemode.png (devtools/command-responsivemode.png)
skin/classic/aero/browser/devtools/command-scratchpad.png (devtools/command-scratchpad.png) skin/classic/aero/browser/devtools/command-scratchpad.png (devtools/command-scratchpad.png)
skin/classic/aero/browser/devtools/command-tilt.png (devtools/command-tilt.png) skin/classic/aero/browser/devtools/command-tilt.png (devtools/command-tilt.png)
skin/classic/aero/browser/devtools/checkbox-dark.png (devtools/checkbox-dark.png)
skin/classic/aero/browser/devtools/checkbox-light.png (devtools/checkbox-light.png)
skin/classic/aero/browser/devtools/alerticon-warning.png (devtools/alerticon-warning.png) skin/classic/aero/browser/devtools/alerticon-warning.png (devtools/alerticon-warning.png)
skin/classic/aero/browser/devtools/goto-mdn.png (devtools/goto-mdn.png) skin/classic/aero/browser/devtools/goto-mdn.png (devtools/goto-mdn.png)
skin/classic/aero/browser/devtools/ruleview.css (devtools/ruleview.css) skin/classic/aero/browser/devtools/ruleview.css (devtools/ruleview.css)