From 0a3b3911360694ee4d29a6905b05a925d03bbcf9 Mon Sep 17 00:00:00 2001 From: Chad Little Date: Fri, 2 Jun 2017 17:32:39 +0000 Subject: [PATCH] Add more simple button colors Summary: Saturate the color a little more, add yellow Test Plan: uiexamples Reviewers: epriestley Reviewed By: epriestley Subscribers: Korvin Differential Revision: https://secure.phabricator.com/D18068 --- resources/celerity/map.php | 12 +++--- .../uiexample/examples/PHUIButtonExample.php | 18 +++++---- .../css/phui/button/phui-button-simple.css | 38 ++++++++++++++++--- 3 files changed, 49 insertions(+), 19 deletions(-) diff --git a/resources/celerity/map.php b/resources/celerity/map.php index c78cd104c5..702bc0e609 100644 --- a/resources/celerity/map.php +++ b/resources/celerity/map.php @@ -9,7 +9,7 @@ return array( 'names' => array( 'conpherence.pkg.css' => 'ff161f2d', 'conpherence.pkg.js' => 'b5b51108', - 'core.pkg.css' => 'e8d63571', + 'core.pkg.css' => 'ea94e844', 'core.pkg.js' => '1475bd91', 'darkconsole.pkg.js' => '1f9a31bc', 'differential.pkg.css' => 'a2755617', @@ -125,7 +125,7 @@ return array( 'rsrc/css/layout/phabricator-filetree-view.css' => 'fccf9f82', 'rsrc/css/layout/phabricator-source-code-view.css' => '4383192f', 'rsrc/css/phui/button/phui-button-bar.css' => '39fe680c', - 'rsrc/css/phui/button/phui-button-simple.css' => 'd410596b', + 'rsrc/css/phui/button/phui-button-simple.css' => '081cfeea', 'rsrc/css/phui/button/phui-button.css' => '9f13ddcc', 'rsrc/css/phui/calendar/phui-calendar-day.css' => '572b1893', 'rsrc/css/phui/calendar/phui-calendar-list.css' => '576be600', @@ -821,7 +821,7 @@ return array( 'phui-box-css' => '269cbc99', 'phui-button-bar-css' => '39fe680c', 'phui-button-css' => '9f13ddcc', - 'phui-button-simple-css' => 'd410596b', + 'phui-button-simple-css' => '081cfeea', 'phui-calendar-css' => '477acfaa', 'phui-calendar-day-css' => '572b1893', 'phui-calendar-list-css' => '576be600', @@ -936,6 +936,9 @@ return array( 'javelin-stratcom', 'javelin-workflow', ), + '081cfeea' => array( + 'phui-button-css', + ), '0825c27a' => array( 'javelin-behavior', 'javelin-dom', @@ -1979,9 +1982,6 @@ return array( 'd254d646' => array( 'javelin-util', ), - 'd410596b' => array( - 'phui-button-css', - ), 'd4505101' => array( 'javelin-stratcom', 'javelin-install', diff --git a/src/applications/uiexample/examples/PHUIButtonExample.php b/src/applications/uiexample/examples/PHUIButtonExample.php index 8758264e7d..aed5d5bf08 100644 --- a/src/applications/uiexample/examples/PHUIButtonExample.php +++ b/src/applications/uiexample/examples/PHUIButtonExample.php @@ -175,15 +175,19 @@ final class PHUIButtonExample extends PhabricatorUIExample { $designs = array( PHUIButtonView::BUTTONTYPE_SIMPLE, ); + $colors = array('', 'red', 'green', 'yellow'); $column = array(); foreach ($designs as $design) { - foreach ($icons as $text => $icon) { - $column[] = id(new PHUIButtonView()) - ->setTag('a') - ->setButtonType($design) - ->setIcon($icon) - ->setText($text) - ->addClass(PHUI::MARGIN_SMALL_RIGHT); + foreach ($colors as $color) { + foreach ($icons as $text => $icon) { + $column[] = id(new PHUIButtonView()) + ->setTag('a') + ->setButtonType($design) + ->setColor($color) + ->setIcon($icon) + ->setText($text) + ->addClass(PHUI::MARGIN_SMALL_RIGHT); + } } } diff --git a/webroot/rsrc/css/phui/button/phui-button-simple.css b/webroot/rsrc/css/phui/button/phui-button-simple.css index f631604936..fa0a8d11b2 100644 --- a/webroot/rsrc/css/phui/button/phui-button-simple.css +++ b/webroot/rsrc/css/phui/button/phui-button-simple.css @@ -41,7 +41,7 @@ button.simple.red, input[type="submit"].simple.red, a.simple.red, a.simple.red:visited { - background: #fff; + background: {$sh-redbackground}; color: {$redtext}; border: 1px solid {$sh-redborder}; } @@ -55,9 +55,9 @@ a.simple.red:visited .phui-icon-view { a.button.simple.red:hover, button.simple.red:hover { - border-color: {$red}; + border-color: {$sh-redtext}; background-image: none; - background-color: #fff; + background-color: {$sh-redbackground}; transition: 0s; } @@ -67,7 +67,7 @@ button.simple.green, input[type="submit"].simple.green, a.simple.green, a.simple.green:visited { - background: #fff; + background: {$sh-greenbackground}; color: {$greentext}; border: 1px solid {$sh-greenborder}; } @@ -81,9 +81,35 @@ a.simple.green:visited .phui-icon-view { a.button.simple.green:hover, button.simple.green:hover { - border-color: {$green}; + border-color: {$sh-greentext}; background-image: none; - background-color: #fff; + background-color: {$sh-greenbackground}; + transition: 0s; +} + +/* - Yellow -----------------------------------------------------------------*/ + +button.simple.yellow, +input[type="submit"].simple.yellow, +a.simple.yellow, +a.simple.yellow:visited { + background-color: {$sh-yellowbackground}; + color: {$sh-yellowtext}; + border: 1px solid {$sh-yellowborder}; +} + +button.simple.yellow .phui-icon-view, +input[type="submit"].simple.yellow .phui-icon-view, +a.simple.yellow .phui-icon-view, +a.simple.yellow:visited .phui-icon-view { + color: {$sh-yellowicon}; +} + +a.button.simple.yellow:hover, +button.simple.yellow:hover { + border-color: {$sh-yellowtext}; + background-image: none; + background-color: {$sh-yellowbackground}; transition: 0s; }