From d1daf80d0d03f6ea2ae4b0cadb635072d57d46e9 Mon Sep 17 00:00:00 2001 From: Chad Little Date: Mon, 8 Apr 2013 15:00:55 -0700 Subject: [PATCH] CSS gradient buttons Summary: Creates CSS Gradients for buttons. Also tweaked hover and active styles. "Fixed" disabled state (this may require follow up diffs to correct around site) Test Plan: Tested Maniphest and UI Examples in Chrome and IE10/9/8 Reviewers: epriestley, btrahan Reviewed By: epriestley CC: aran, Korvin Differential Revision: https://secure.phabricator.com/D5624 --- resources/sprite/gradients/black-dark.png | Bin 231 -> 0 bytes resources/sprite/gradients/black-light.png | Bin 233 -> 0 bytes resources/sprite/gradients/blue-dark.png | Bin 223 -> 0 bytes resources/sprite/gradients/blue-light.png | Bin 216 -> 0 bytes resources/sprite/gradients/green-dark.png | Bin 222 -> 0 bytes resources/sprite/gradients/green-light.png | Bin 232 -> 0 bytes resources/sprite/gradients/grey-dark.png | Bin 197 -> 0 bytes resources/sprite/gradients/grey-light.png | Bin 192 -> 0 bytes resources/sprite/manifest/gradient.json | 42 +-------- src/__celerity_resource_map__.php | 84 +++++++++--------- .../celerity/CeleritySpriteGenerator.php | 24 +---- webroot/rsrc/css/core/buttons.css | 60 ++++++++----- webroot/rsrc/css/sprite-gradient.css | 50 ++--------- webroot/rsrc/image/sprite-gradient.png | Bin 1638 -> 873 bytes 14 files changed, 91 insertions(+), 169 deletions(-) delete mode 100644 resources/sprite/gradients/black-dark.png delete mode 100644 resources/sprite/gradients/black-light.png delete mode 100644 resources/sprite/gradients/blue-dark.png delete mode 100644 resources/sprite/gradients/blue-light.png delete mode 100644 resources/sprite/gradients/green-dark.png delete mode 100644 resources/sprite/gradients/green-light.png delete mode 100644 resources/sprite/gradients/grey-dark.png delete mode 100644 resources/sprite/gradients/grey-light.png diff --git a/resources/sprite/gradients/black-dark.png b/resources/sprite/gradients/black-dark.png deleted file mode 100644 index 357183730f6304e1993b82ccf9535691a49f414a..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 231 zcmeAS@N?(olHy`uVBq!ia0vp^EI=&9!2~4b{j&}MDajJoh?3y^w370~qErUQl>DSr z1<%~X^wgl##FWaylc_d9MV+25jv*Ddd;$XboDDe+9c6yU^!v_Ve+8bmpWn{h(zwV& z>iv1~bqp;_M4DAn>@PkpF#_u7v~K4sEwj;p*rzngsYP*_*gnkf}) zq7=PXZ@t|t^53|uyU%uI`O7y4eQkp0mV3UrG;iml8;4UK&$*JIAm_;Z+&eCP@kGaa fC*OP%PGH#6kp6ws<5NXIM=^N1`njxgN@xNAUVmP9 diff --git a/resources/sprite/gradients/black-light.png b/resources/sprite/gradients/black-light.png deleted file mode 100644 index 6c744f92b20d10b8793a580cd9db269b5426fcc5..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 233 zcmeAS@N?(olHy`uVBq!ia0vp^EI=&9!2~4b{j&}MDajJoh?3y^w370~qErUQl>DSr z1<%~X^wgl##FWaylc_d9Mctk*jv*Ddd;+3{m<>6aWchD%e_0>Se@zbKuo%|t zwP)}+)OXtNL7yS}E~zF?tK>@$Zh24U+ZDuMH0ioj;hJ+{YMJ(?75Cn7Ma`*M{d1j1 z6@z_)Zus&`e5)O-6XqyyiwRoP7IkpVm9-WPhq#aR9p`hG+8(%!`QPkKZh56~r$0!Q f)+eOyW8z^570Pi}@31@wbQXiBtDnm{r-UW|Q2SJH diff --git a/resources/sprite/gradients/blue-dark.png b/resources/sprite/gradients/blue-dark.png deleted file mode 100644 index 95b44ed8a125ab0f4bf700fa087c3f9c0a639b66..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 223 zcmeAS@N?(olHy`uVBq!ia0vp^EI=&9!2~4b{j&}MDajJoh?3y^w370~qErUQl>DSr z1<%~X^wgl##FWaylc_d9MU9>=jv*DdLIQ3J9#G)mw*4-@(724zgR|rMuZ0SgD<9Sw zyuRetWF@Y|aJqZXDYb5mDY_S0S4R4NcpRc1VR1$!Lio^)EvhRu+NAp5#@lWDx%imj zU(en7|8?hHJ@WDMyu$|%R7ic_mVZus8UKQ&#hX(XzL^{KE^N*;uVpu1nVWqUODSr z1<%~X^wgl##FWaylc_d9MOB_Ijv*DdLM8raZNk}xE?=)*nDRVNt4sNLegDn2r|;i9y8B;Y{?a-A4U7z*cDrp-+A`e} P=n4i;S3j3^P6DSr z1<%~X^wgl##FWaylc_d9MGc-Vjv*DdVkQLg9X8-_?!B`3>w(?(yKJ33uIkBq#_^bW zJt%f^YWdEr)ROdoVe|Zp51Q9xFF1W|k>c(o>6C+CQm$P+wPWY@x4g3!mG}KCnlV}V z@K(n1a~hSoORFLbD_Z+5G4tPW_|9^&-E{xuplj$>trJ^NVFJ)eP@VO?_Q V9SJ5yL7-b0JYD@<);T3K0RRgVRLuYY diff --git a/resources/sprite/gradients/green-light.png b/resources/sprite/gradients/green-light.png deleted file mode 100644 index 3c9422da3aebea54d927be17cd5b818ea8f3ebe9..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 232 zcmeAS@N?(olHy`uVBq!ia0vp^EI=&9!2~4b{j&}MDajJoh?3y^w370~qErUQl>DSr z1<%~X^wgl##FWaylc_d9MO~gQjv*DdVggR`GCA^W4qw@}?#1MF4o)^|YRg-Gq#P@J zBeTc$9fOMNmVTK82BBx10V=(-W;J~KmKgN8sF7P?xtPuDz{~~A8w(m1pKJE<{kQtk z1NHq<+dJYy8j7O~YIiN;sfk|p^?eSfm%y2;{-0l)ZBEUz(fe|%R^SZRE76vnjQ@TW e9B16e#KUlpBTh`pe|k62RScf4elF{r5}E)xbXSo8 diff --git a/resources/sprite/gradients/grey-dark.png b/resources/sprite/gradients/grey-dark.png deleted file mode 100644 index d5b60e06361a537ea8b1eda82633c3955189fc73..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 197 zcmeAS@N?(olHy`uVBq!ia0vp^EI=&9!2~4b{j&}MDajJoh?3y^w370~qErUQl>DSr z1<%~X^wgl##FWaylc_d9Md_X{jv*DdO8gsn4;XMDSr z1<%~X^wgl##FWaylc_d9MM<76jv*DddIB!;F&MHq|M@R3zq;T}qW81Jiz~Jrd*@gG zQq+Uln_)ns9DbfzUSPUv&d3ZVAh2hHDz{rLG30i pm+T&WG5pB>yYQ0i3GW6*hDq0pUmBbJUIny`!PC{xWt~$(69B_|MsENB diff --git a/resources/sprite/manifest/gradient.json b/resources/sprite/manifest/gradient.json index 78b9eca58e..5382adf9dd 100644 --- a/resources/sprite/manifest/gradient.json +++ b/resources/sprite/manifest/gradient.json @@ -1,31 +1,11 @@ { "version" : 1, "sprites" : { - "gradient-black-dark" : { - "name" : "gradient-black-dark", - "rule" : ".gradient-black-dark, button.black, a.black, a.black:visited", - "hash" : "17425d8c9c53672ab2edbd236e6efd7a" - }, - "gradient-black-light" : { - "name" : "gradient-black-light", - "rule" : ".gradient-black-light, button.black:active, a.black:active", - "hash" : "c4fb2231553d2894fd2c97beaa8bfe39" - }, - "gradient-blue-dark" : { - "name" : "gradient-blue-dark", - "rule" : ".gradient-blue-dark, button, a.button, a.button:visited, input.inputsubmit", - "hash" : "f467612edcdbf984672287c6086492c4" - }, "gradient-blue-header" : { "name" : "gradient-blue-header", "rule" : ".gradient-blue-header", "hash" : "dd82b6d737f9f683c0d6e70eff59e872" }, - "gradient-blue-light" : { - "name" : "gradient-blue-light", - "rule" : ".gradient-blue-light, button:active, a.button:active", - "hash" : "471d47c102def6db46b345310aac5a03" - }, "gradient-breadcrumbs" : { "name" : "gradient-breadcrumbs", "rule" : ".gradient-breadcrumbs", @@ -36,36 +16,16 @@ "rule" : ".gradient-dark-menu-label, .phabricator-dark-menu .phabricator-menu-item-type-label", "hash" : "e0d4a455142f9c4745d36ad8b7dd3f78" }, - "gradient-green-dark" : { - "name" : "gradient-green-dark", - "rule" : ".gradient-green-dark, button.green, a.green, a.green:visited", - "hash" : "a6719fe55b2b0e527ed32985691eab34" - }, "gradient-green-header" : { "name" : "gradient-green-header", "rule" : ".gradient-green-header", "hash" : "d61297d23aa31fa1de51e2b9b5974554" }, - "gradient-green-light" : { - "name" : "gradient-green-light", - "rule" : ".gradient-green-light, button.green:active, a.green:active", - "hash" : "124969cc7805bbd754005bc702e24c54" - }, - "gradient-grey-dark" : { - "name" : "gradient-grey-dark", - "rule" : ".gradient-grey-dark, button.grey, input.inputaux, a.grey, a.grey:visited, a.button.disabled, button[disabled], button.disabled", - "hash" : "fac28a773098fc62bf571e12b843f71a" - }, "gradient-grey-header" : { "name" : "gradient-grey-header", "rule" : ".gradient-grey-header", "hash" : "f1453896068a8dd0d7885457c8e371bc" }, - "gradient-grey-light" : { - "name" : "gradient-grey-light", - "rule" : ".gradient-grey-light, button.grey:active, a.grey:active, button.grey_active, a.dropdown-open", - "hash" : "83c6128f59fc2e426c912c2f73f5b92b" - }, "gradient-menu-hover" : { "name" : "gradient-menu-hover", "rule" : ".gradient-menu-hover, .device-desktop .phabricator-side-menu a.phabricator-menu-item-type-link:hover, .phabricator-filetree a.phabricator-filetree-item:hover", @@ -95,6 +55,6 @@ "scales" : [ 1 ], - "header" : "\/**\n * @provides sprite-gradient-css\n * @generated\n *\/\n\n.sprite-gradient, button, a.button, a.button:visited, input.inputsubmit, .phabricator-dark-menu .phabricator-menu-item-type-label, .phabricator-side-menu .phabricator-menu-item-type-label, .device-desktop .phabricator-side-menu a.phabricator-menu-item-type-link:hover, .phabricator-side-menu .phabricator-menu-item-selected, .device-desktop .phabricator-side-menu a.phabricator-menu-item-selected:hover, .phabricator-filetree a.phabricator-filetree-item:hover, .phabricator-filetree a.phabricator-active-nav-focus {\n background-image: url(\/rsrc\/image\/sprite-gradient.png);\n background-repeat: repeat-x;\n}\n\n\n", + "header" : "\/**\n * @provides sprite-gradient-css\n * @generated\n *\/\n\n.sprite-gradient, .phabricator-dark-menu .phabricator-menu-item-type-label, .phabricator-side-menu .phabricator-menu-item-type-label, .device-desktop .phabricator-side-menu a.phabricator-menu-item-type-link:hover, .phabricator-side-menu .phabricator-menu-item-selected, .device-desktop .phabricator-side-menu a.phabricator-menu-item-selected:hover, .phabricator-filetree a.phabricator-filetree-item:hover, .phabricator-filetree a.phabricator-active-nav-focus {\n background-image: url(\/rsrc\/image\/sprite-gradient.png);\n background-repeat: repeat-x;\n}\n\n\n", "type" : "repeat-x" } diff --git a/src/__celerity_resource_map__.php b/src/__celerity_resource_map__.php index 951f304a7f..8b39b81a07 100644 --- a/src/__celerity_resource_map__.php +++ b/src/__celerity_resource_map__.php @@ -590,8 +590,8 @@ celerity_register_resource_map(array( ), '/rsrc/image/sprite-gradient.png' => array( - 'hash' => 'df1e8e0d09bbbabdd6015d3467dec11a', - 'uri' => '/res/df1e8e0d/rsrc/image/sprite-gradient.png', + 'hash' => '72614b1679a3c69fcef9766c0f2be53d', + 'uri' => '/res/72614b16/rsrc/image/sprite-gradient.png', 'disk' => '/rsrc/image/sprite-gradient.png', 'type' => 'png', ), @@ -2903,7 +2903,7 @@ celerity_register_resource_map(array( ), 'phabricator-core-buttons-css' => array( - 'uri' => '/res/4e6b94c8/rsrc/css/core/buttons.css', + 'uri' => '/res/da2e42df/rsrc/css/core/buttons.css', 'type' => 'css', 'requires' => array( @@ -3819,7 +3819,7 @@ celerity_register_resource_map(array( ), 'sprite-gradient-css' => array( - 'uri' => '/res/0d784d61/rsrc/css/sprite-gradient.css', + 'uri' => '/res/5bce353e/rsrc/css/sprite-gradient.css', 'type' => 'css', 'requires' => array( @@ -3901,7 +3901,7 @@ celerity_register_resource_map(array( ), array( 'packages' => array( - '30e5f188' => + '75db5fb7' => array( 'name' => 'core.pkg.css', 'symbols' => @@ -3943,7 +3943,7 @@ celerity_register_resource_map(array( 34 => 'phabricator-object-item-list-view-css', 35 => 'global-drag-and-drop-css', ), - 'uri' => '/res/pkg/30e5f188/core.pkg.css', + 'uri' => '/res/pkg/75db5fb7/core.pkg.css', 'type' => 'css', ), 'bf16b308' => @@ -4133,16 +4133,16 @@ celerity_register_resource_map(array( 'reverse' => array( 'aphront-attached-file-view-css' => '6b1fccc6', - 'aphront-dialog-view-css' => '30e5f188', - 'aphront-error-view-css' => '30e5f188', - 'aphront-form-view-css' => '30e5f188', - 'aphront-list-filter-view-css' => '30e5f188', - 'aphront-pager-view-css' => '30e5f188', - 'aphront-panel-view-css' => '30e5f188', - 'aphront-table-view-css' => '30e5f188', - 'aphront-tokenizer-control-css' => '30e5f188', - 'aphront-tooltip-css' => '30e5f188', - 'aphront-typeahead-control-css' => '30e5f188', + 'aphront-dialog-view-css' => '75db5fb7', + 'aphront-error-view-css' => '75db5fb7', + 'aphront-form-view-css' => '75db5fb7', + 'aphront-list-filter-view-css' => '75db5fb7', + 'aphront-pager-view-css' => '75db5fb7', + 'aphront-panel-view-css' => '75db5fb7', + 'aphront-table-view-css' => '75db5fb7', + 'aphront-tokenizer-control-css' => '75db5fb7', + 'aphront-tooltip-css' => '75db5fb7', + 'aphront-typeahead-control-css' => '75db5fb7', 'differential-changeset-view-css' => '8aaacd1b', 'differential-core-view-css' => '8aaacd1b', 'differential-inline-comment-editor' => 'e96b08f8', @@ -4156,7 +4156,7 @@ celerity_register_resource_map(array( 'differential-table-of-contents-css' => '8aaacd1b', 'diffusion-commit-view-css' => 'c8ce2d88', 'diffusion-icons-css' => 'c8ce2d88', - 'global-drag-and-drop-css' => '30e5f188', + 'global-drag-and-drop-css' => '75db5fb7', 'inline-comment-summary-css' => '8aaacd1b', 'javelin-aphlict' => 'bf16b308', 'javelin-behavior' => 'a2f94024', @@ -4228,47 +4228,47 @@ celerity_register_resource_map(array( 'javelin-util' => 'a2f94024', 'javelin-vector' => 'a2f94024', 'javelin-workflow' => 'a2f94024', - 'lightbox-attachment-css' => '30e5f188', + 'lightbox-attachment-css' => '75db5fb7', 'maniphest-task-summary-css' => '6b1fccc6', 'maniphest-transaction-detail-css' => '6b1fccc6', 'phabricator-busy' => 'bf16b308', 'phabricator-content-source-view-css' => '8aaacd1b', - 'phabricator-core-buttons-css' => '30e5f188', - 'phabricator-core-css' => '30e5f188', - 'phabricator-crumbs-view-css' => '30e5f188', - 'phabricator-directory-css' => '30e5f188', + 'phabricator-core-buttons-css' => '75db5fb7', + 'phabricator-core-css' => '75db5fb7', + 'phabricator-crumbs-view-css' => '75db5fb7', + 'phabricator-directory-css' => '75db5fb7', 'phabricator-drag-and-drop-file-upload' => 'e96b08f8', 'phabricator-dropdown-menu' => 'bf16b308', 'phabricator-file-upload' => 'bf16b308', - 'phabricator-filetree-view-css' => '30e5f188', - 'phabricator-flag-css' => '30e5f188', - 'phabricator-form-view-css' => '30e5f188', - 'phabricator-header-view-css' => '30e5f188', - 'phabricator-jump-nav' => '30e5f188', + 'phabricator-filetree-view-css' => '75db5fb7', + 'phabricator-flag-css' => '75db5fb7', + 'phabricator-form-view-css' => '75db5fb7', + 'phabricator-header-view-css' => '75db5fb7', + 'phabricator-jump-nav' => '75db5fb7', 'phabricator-keyboard-shortcut' => 'bf16b308', 'phabricator-keyboard-shortcut-manager' => 'bf16b308', - 'phabricator-main-menu-view' => '30e5f188', + 'phabricator-main-menu-view' => '75db5fb7', 'phabricator-menu-item' => 'bf16b308', - 'phabricator-nav-view-css' => '30e5f188', + 'phabricator-nav-view-css' => '75db5fb7', 'phabricator-notification' => 'bf16b308', - 'phabricator-notification-css' => '30e5f188', - 'phabricator-notification-menu-css' => '30e5f188', - 'phabricator-object-item-list-view-css' => '30e5f188', + 'phabricator-notification-css' => '75db5fb7', + 'phabricator-notification-menu-css' => '75db5fb7', + 'phabricator-object-item-list-view-css' => '75db5fb7', 'phabricator-object-selector-css' => '8aaacd1b', 'phabricator-prefab' => 'bf16b308', 'phabricator-project-tag-css' => '6b1fccc6', - 'phabricator-remarkup-css' => '30e5f188', + 'phabricator-remarkup-css' => '75db5fb7', 'phabricator-shaped-request' => 'e96b08f8', - 'phabricator-side-menu-view-css' => '30e5f188', - 'phabricator-standard-page-view' => '30e5f188', + 'phabricator-side-menu-view-css' => '75db5fb7', + 'phabricator-standard-page-view' => '75db5fb7', 'phabricator-textareautils' => 'bf16b308', 'phabricator-tooltip' => 'bf16b308', - 'phabricator-transaction-view-css' => '30e5f188', - 'phabricator-zindex-css' => '30e5f188', - 'sprite-apps-large-css' => '30e5f188', - 'sprite-gradient-css' => '30e5f188', - 'sprite-icon-css' => '30e5f188', - 'sprite-menu-css' => '30e5f188', - 'syntax-highlighting-css' => '30e5f188', + 'phabricator-transaction-view-css' => '75db5fb7', + 'phabricator-zindex-css' => '75db5fb7', + 'sprite-apps-large-css' => '75db5fb7', + 'sprite-gradient-css' => '75db5fb7', + 'sprite-icon-css' => '75db5fb7', + 'sprite-menu-css' => '75db5fb7', + 'syntax-highlighting-css' => '75db5fb7', ), )); diff --git a/src/infrastructure/celerity/CeleritySpriteGenerator.php b/src/infrastructure/celerity/CeleritySpriteGenerator.php index e5024aca3c..4ba28ee18a 100644 --- a/src/infrastructure/celerity/CeleritySpriteGenerator.php +++ b/src/infrastructure/celerity/CeleritySpriteGenerator.php @@ -418,28 +418,7 @@ final class CeleritySpriteGenerator { 'grey-header' => 70 ); - // Reorder the sprites so less-specific rules generate earlier in the sheet. - // Otherwise we end up with blue "a.black" buttons because the blue rules - // have the same specificity but appear later. - $gradients = array_fuse($gradients); - $gradients = array_select_keys( - $gradients, - array( - 'blue-dark', - 'blue-light', - )) + $gradients; - $extra_css = array( - 'black-dark' => ', button.black, a.black, a.black:visited', - 'black-light' => ', button.black:active, a.black:active', - 'blue-dark' => ', button, a.button, a.button:visited, input.inputsubmit', - 'blue-light' => ', button:active, a.button:active', - 'grey-dark' => ', button.grey, input.inputaux, a.grey, a.grey:visited, '. - 'a.button.disabled, button[disabled], button.disabled', - 'grey-light' => ', button.grey:active, a.grey:active, '. - 'button.grey_active, a.dropdown-open', - 'green-dark' => ', button.green, a.green, a.green:visited', - 'green-light' => ', button.green:active, a.green:active', 'dark-menu-label' => ', .phabricator-dark-menu .phabricator-menu-item-type-label', 'menu-label' => @@ -472,8 +451,7 @@ final class CeleritySpriteGenerator { 'gradient', false, PhutilSpriteSheet::TYPE_REPEAT_X, - ', button, a.button, a.button:visited, input.inputsubmit, '. - '.phabricator-dark-menu .phabricator-menu-item-type-label, '. + ', .phabricator-dark-menu .phabricator-menu-item-type-label, '. '.phabricator-side-menu .phabricator-menu-item-type-label, '. '.device-desktop .phabricator-side-menu '. 'a.phabricator-menu-item-type-link:hover, '. diff --git a/webroot/rsrc/css/core/buttons.css b/webroot/rsrc/css/core/buttons.css index 5d4d92b27e..cce51d6029 100644 --- a/webroot/rsrc/css/core/buttons.css +++ b/webroot/rsrc/css/core/buttons.css @@ -7,10 +7,9 @@ button, a.button, a.button:visited, input.inputsubmit { - background-color: #19558D; - + background-color: #3477ad; color: white; - text-shadow: 0 -1px #19558D; + text-shadow: 0 -1px rgba(0,0,0,0.75); border: 1px solid #19558D; cursor: pointer; font-weight: bold; @@ -19,10 +18,9 @@ input.inputsubmit { padding: 3px 10px 4px; text-align: center; white-space: nowrap; - border-radius: 3px; - -webkit-border-radius: 3px; - -moz-border-radius: 3px; + background-image: linear-gradient(to bottom, #3b86c4, #2b628f); + background-image: -webkit-linear-gradient(top, #3b86c4, #2b628f); } /* Buttons with images (full size only) */ @@ -34,37 +32,33 @@ a.icon:visited { text-indent: 29px; } -button:active, -a.button:active { - background-color: #19558D; -} - button.black, a.black, a.black:visited { background-color: #383838; + background-image: linear-gradient(to bottom, #505d65, #2d373c); + background-image: -webkit-linear-gradient(top, #505d65, #2d373c); border: 1px solid #333; - text-shadow: 0 -1px #000; border-bottom-color: #000; } button.green, a.green, a.green:visited { - background-color: #006600; + background-color: #348e20; + background-image: linear-gradient(to bottom, #4e9b33, #158009); + background-image: -webkit-linear-gradient(top, #4e9b33, #158009); border: 1px solid #3b6e22; - text-shadow: 0 -1px #006600; border-bottom-color: #2c5a15; } button.grey, input.inputaux, a.grey, -a.grey:visited, -a.button.disabled, -button[disabled], /* Set by JX.Workflow. */ -button.disabled { +a.grey:visited { background-color: #f7f7f7; + background-image: linear-gradient(to bottom, #ffffff, #e6e6e6); + background-image: -webkit-linear-gradient(top, #ffffff, #e6e6e6); border-color: #aaa; color: #333; border-bottom-color: #999; @@ -72,11 +66,17 @@ button.disabled { } a.disabled, -button.disabled { +button.disabled, +button[disabled] { filter:alpha(opacity=50); - -moz-opacity:0.5; + -moz-opacity: 0.5; -khtml-opacity: 0.5; - opacity: 0.5; + opacity: 0.5 !important; +} + +body button:active, +body a.button:active { + box-shadow: inset 0 0 8px rgba(0,0,0,.6); } button.grey:active, @@ -84,11 +84,27 @@ a.grey:active, button.grey_active, a.dropdown-open { background-color: #7d7d7d; + box-shadow: inset 0 0 4px rgba(0,0,0,.2); color: #777; } -a.button:hover { +a.button:hover, +button:hover { text-decoration: none; + box-shadow: inset 0 0 5px rgba(0,0,0,.4); +} + +a.button.grey:hover, +button.grey:hover { + text-decoration: none; + box-shadow: inset 0 0 4px rgba(0,0,0,.2); +} + +body a.button.disabled:hover, +body button.disabled:hover, +body a.button.disabled:active, +body button.disabled:active { + box-shadow: none; } button.small, diff --git a/webroot/rsrc/css/sprite-gradient.css b/webroot/rsrc/css/sprite-gradient.css index a9b7720675..cbe647dc52 100644 --- a/webroot/rsrc/css/sprite-gradient.css +++ b/webroot/rsrc/css/sprite-gradient.css @@ -3,7 +3,7 @@ * @generated */ -.sprite-gradient, button, a.button, a.button:visited, input.inputsubmit, .phabricator-dark-menu .phabricator-menu-item-type-label, .phabricator-side-menu .phabricator-menu-item-type-label, .device-desktop .phabricator-side-menu a.phabricator-menu-item-type-link:hover, .phabricator-side-menu .phabricator-menu-item-selected, .device-desktop .phabricator-side-menu a.phabricator-menu-item-selected:hover, .phabricator-filetree a.phabricator-filetree-item:hover, .phabricator-filetree a.phabricator-active-nav-focus { +.sprite-gradient, .phabricator-dark-menu .phabricator-menu-item-type-label, .phabricator-side-menu .phabricator-menu-item-type-label, .device-desktop .phabricator-side-menu a.phabricator-menu-item-type-link:hover, .phabricator-side-menu .phabricator-menu-item-selected, .device-desktop .phabricator-side-menu a.phabricator-menu-item-selected:hover, .phabricator-filetree a.phabricator-filetree-item:hover, .phabricator-filetree a.phabricator-active-nav-focus { background-image: url(/rsrc/image/sprite-gradient.png); background-repeat: repeat-x; } @@ -11,60 +11,28 @@ -.gradient-blue-dark, button, a.button, a.button:visited, input.inputsubmit { - background-position: 0px -51px; -} - -.gradient-blue-light, button:active, a.button:active { - background-position: 0px -78px; -} - -.gradient-black-dark, button.black, a.black, a.black:visited { - background-position: 0px -105px; -} - -.gradient-black-light, button.black:active, a.black:active { - background-position: 0px -132px; -} - .gradient-blue-header { - background-position: 0px -357px; + background-position: 0px -141px; } .gradient-breadcrumbs { - background-position: 0px -325px; + background-position: 0px -109px; } .gradient-dark-menu-label, .phabricator-dark-menu .phabricator-menu-item-type-label { background-position: 0px -25px; } -.gradient-green-dark, button.green, a.green, a.green:visited { - background-position: 0px -159px; -} - .gradient-green-header { - background-position: 0px -428px; -} - -.gradient-green-light, button.green:active, a.green:active { - background-position: 0px -186px; -} - -.gradient-grey-dark, button.grey, input.inputaux, a.grey, a.grey:visited, a.button.disabled, button[disabled], button.disabled { - background-position: 0px -213px; + background-position: 0px -212px; } .gradient-grey-header { - background-position: 0px -499px; -} - -.gradient-grey-light, button.grey:active, a.grey:active, button.grey_active, a.dropdown-open { - background-position: 0px -240px; + background-position: 0px -283px; } .gradient-menu-hover, .device-desktop .phabricator-side-menu a.phabricator-menu-item-type-link:hover, .phabricator-filetree a.phabricator-filetree-item:hover { - background-position: 0px -267px; + background-position: 0px -51px; } .gradient-menu-label, .phabricator-side-menu .phabricator-menu-item-type-label { @@ -72,13 +40,13 @@ } .gradient-menu-selected, .phabricator-side-menu .phabricator-menu-item-selected, .device-desktop .phabricator-side-menu a.phabricator-menu-item-selected:hover, .phabricator-nav-local a.phabricator-active-nav-focus { - background-position: 0px -296px; + background-position: 0px -80px; } .gradient-red-header { - background-position: 0px -570px; + background-position: 0px -354px; } .gradient-yellow-header { - background-position: 0px -641px; + background-position: 0px -425px; } diff --git a/webroot/rsrc/image/sprite-gradient.png b/webroot/rsrc/image/sprite-gradient.png index f14aea3de42d6aa184f566be50aef95a5303300f..c484e425a1ebdac20a932fd4470c72fd03031545 100644 GIT binary patch delta 864 zcmV-m1E2in4Cw}t7JmWo2nGNE0D*UFiAu~RA}Dqm_3dpMG%F*$cjO;i-Um# z;_m_+fHNQrSQ8{pz$rlD7I+*44>$lOco-`o3_z^JbVfXktm^H_YRIYCp4~xodHwpu zi&qhuk)3U?zxj>;K$sbRd3nj<<9=~*9mv#mK+2wxJ);ZBh<{;72SoIYTxoPbtVCnv zG}VhnZgo0-ef5koP5TeVk;h(pl%}LpXJ^*st@TI_qI_h#)lt0`jmfr z?9u063xO4oz#qK&R@-qBr5OI(?^g(67?SYaU%_D}uMzuoky103YI{}^9yKs)>u1l< zoCPyn@l;e2UVm!^2`i-m8Ffz4vbkjt5(Sz@-R&?la?!{PiW!;N=0`>#d%Bh#f~AUP z^OCZeA%RO3%`s+O)wKXi2rVQy?1ZNRqt`G)B&6Zc>R}kN#LdgTTFvS7Qj6Cj`o}L| z)?QG;?Wb>MQ^v(qjx_uI&%Tfj`!c=!3IfUkJo&R?W`AHy8+J)4&3dMAv({v#5Teu? zEG1BCE+G?@CI9tOt83m(Eg^Z*?pJwC(S!Lq(_=mZL6T98+NV9)_ z{HqSJ@0sYl)gBL@fH4K#-5?JYva#>OG!P=8b>cw3&mb3L#+Va~uAI5DsuTOWM& zt~MSx>w5#kn}tRjC|1AMhZ;v1v6T_SkRyy7GV0L!%E!tnJ%g=`fI%zQqQj6r?Rkrx zf#*NA)QuRwy1LpZx|&jVVtt(D7C!Dv$bb0dUeIzl1OMx>_5CLwYwO)~v`%lr*dCH6 z$XPPh$nF0s+==L&XqfJ><}ae1V~84WF#PQ3q(SU!~u}VfCCUhMqmjc0R|)QKUE(=Kc>28cH6Vw zwT<{U@|NrU_^NtVo`3Nb0sugW2;#MC*WiC*JUM9zW^4(h^?w}Jb95r6Iuz*$sy&CT zbaVt=Db*Kgctbxbk#R-V{G^&&mT6I-Yi z$J;k=-Nt!8f-in=WI`G@0+}3Pmg`P{M1%pT-U=e9i9ItV4y<%!A_NhpfJm~GI0y)< zo(LLHdPIN-pMS#Shb=l6D|C*n%&IPKRBHR#xuWi$(C483Pe2=B9_kTKkKG3&i%6duqnRSFFg-li?&kD&73uSA>GzVS@;v6ICT+hAgTrbhWAWlo-kep-!p*RI19VEuq z%DR*ve1G&YlhtfCWVXWIqP7U4p_G!4RP5wK6-md0s+636I-&mB84z-sprWL{$_;k?K0)L9ZLtj;@-C9#E9p|jnL8jYc3&46m zxaEhhK7oi?+Z2L5ht3-?F0KrVW0j*IOwEUOE2*D-*uk#`57KlSXlbDi*O!BYXP>O{ z>NoGP8N&NaILHjNO>2{aDD)#v#DDr}_{-Qf9cU1bba#yo^-Gdj2e-5XyA9MHS2@W| zkAJ~j8Pp*i{B^M`ah`EYwY6Q6yxfJEbFormY0fVo)Lv(YQsp{`{V}uQhuHRxtfgd! zyRpaOyl~PJk|mZ3<=Za{=SKqiOei{HkNT11z--|tx*98W&#fF=E6va0#`PjvbrjJ? zhlsS%n%M@fuYxnTk=;9+=eS{3^cZ120V#$kG1P1&Pp7By@D-(Ze+5KRfFz>){B3qha59CBV!!#}r}Rh{ zr>CC*)66Hry}#$wC{oIBFoaN=j(>4j5vogpqa zkzt;hj|rxOcbcYj^p@`qq_qH>JT*f)(Frp}6d}yg_6R``H80?l^@7^M<$u=ZBnS|M zDZtbafPipv0yP0bM4aY(;GCDT8KT_zF_&<{;c(a}_AhsSYtEd|Us#dY{D`oRV}-a_ zK`=JHvh3O(TYikJ@Di+$-0%9x4`8@uZ0Shl6`e?QkUguVL$lci-XOx9O-)AB1DSh+JKQm9Y-n|5f2i zlwOIB%iuUZ5|4z(4_iNd502i1J;8>A)yrZiVq+cp@JiPN-7UgP(6JJ^fa@1Y;r_}E htA8A^BjJ(5*1wEThj~g8jcot`002ovPDHLkV1lI~6ej=x