1
0
Fork 0
mirror of https://we.phorge.it/source/phorge.git synced 2024-11-18 12:52:42 +01:00

Pop the buttons

Summary: Keeping in step with the gradients on the grey buttons, this adds slight gradients and hover states to blue and green. I feel like they are much more obviously buttons now in the UI (on headers for example).

Test Plan:
Review UI Buttons, check differential, actions, other random buttons.

{F1137208}

Reviewers: epriestley

Reviewed By: epriestley

Subscribers: Korvin

Differential Revision: https://secure.phabricator.com/D15379
This commit is contained in:
Chad Little 2016-03-01 21:14:19 +00:00 committed by chad
parent db4fdf8c2d
commit 58aac5de0e
2 changed files with 18 additions and 6 deletions

View file

@ -7,7 +7,7 @@
*/ */
return array( return array(
'names' => array( 'names' => array(
'core.pkg.css' => '3b2e293c', 'core.pkg.css' => '80c32191',
'core.pkg.js' => '7d8faf57', 'core.pkg.js' => '7d8faf57',
'darkconsole.pkg.js' => 'e7393ebb', 'darkconsole.pkg.js' => 'e7393ebb',
'differential.pkg.css' => '2de124c9', 'differential.pkg.css' => '2de124c9',
@ -124,7 +124,7 @@ return array(
'rsrc/css/phui/phui-badge.css' => 'f25c3476', 'rsrc/css/phui/phui-badge.css' => 'f25c3476',
'rsrc/css/phui/phui-big-info-view.css' => 'bd903741', 'rsrc/css/phui/phui-big-info-view.css' => 'bd903741',
'rsrc/css/phui/phui-box.css' => '348bd872', 'rsrc/css/phui/phui-box.css' => '348bd872',
'rsrc/css/phui/phui-button.css' => 'c096e4e9', 'rsrc/css/phui/phui-button.css' => 'a64a8de6',
'rsrc/css/phui/phui-chart.css' => '6bf6f78e', 'rsrc/css/phui/phui-chart.css' => '6bf6f78e',
'rsrc/css/phui/phui-crumbs-view.css' => '79d536e5', 'rsrc/css/phui/phui-crumbs-view.css' => '79d536e5',
'rsrc/css/phui/phui-document-pro.css' => '92d5b648', 'rsrc/css/phui/phui-document-pro.css' => '92d5b648',
@ -804,7 +804,7 @@ return array(
'phui-badge-view-css' => 'f25c3476', 'phui-badge-view-css' => 'f25c3476',
'phui-big-info-view-css' => 'bd903741', 'phui-big-info-view-css' => 'bd903741',
'phui-box-css' => '348bd872', 'phui-box-css' => '348bd872',
'phui-button-css' => 'c096e4e9', 'phui-button-css' => 'a64a8de6',
'phui-calendar-css' => 'ccabe893', 'phui-calendar-css' => 'ccabe893',
'phui-calendar-day-css' => 'd1cf6f93', 'phui-calendar-day-css' => 'd1cf6f93',
'phui-calendar-list-css' => 'c1c7f338', 'phui-calendar-list-css' => 'c1c7f338',

View file

@ -26,8 +26,9 @@ button,
a.button, a.button,
a.button:visited, a.button:visited,
input[type="submit"] { input[type="submit"] {
background-color: {$blue}; background-color: #2980b9;
border: 1px solid {$blue}; border: 1px solid #2980b9;
background-image: linear-gradient(to bottom, #3498db, #2980b9);
color: white; color: white;
cursor: pointer; cursor: pointer;
font-weight: bold; font-weight: bold;
@ -53,6 +54,7 @@ a.green,
a.green:visited { a.green:visited {
background-color: {$green}; background-color: {$green};
border-color: {$green}; border-color: {$green};
background-image: linear-gradient(to bottom, #23BB5B, #139543);
} }
button.grey, button.grey,
@ -101,7 +103,9 @@ a.phuix-dropdown-open {
a.button:hover, a.button:hover,
button:hover { button:hover {
text-decoration: none; text-decoration: none;
background-color: {$sky}; background-color: #2980b9;
background-image: linear-gradient(to bottom, #3498db, #1b6ba0);
border-color: #115988;
transition: 0.1s; transition: 0.1s;
} }
@ -114,13 +118,16 @@ button.grey:hover {
a.button.green:hover, a.button.green:hover,
button.green:hover { button.green:hover {
border-color: #127336;
background-color: #0DAD48; background-color: #0DAD48;
background-image: linear-gradient(to bottom, #23BB5B, #178841);
transition: 0.1s; transition: 0.1s;
} }
a.button.simple:hover, a.button.simple:hover,
button.simple:hover { button.simple:hover {
background-color: {$blue}; background-color: {$blue};
background-image: linear-gradient(to bottom, {$blue}, {$blue});
color: #fff; color: #fff;
transition: 0.1s; transition: 0.1s;
} }
@ -165,6 +172,7 @@ button.link {
display: inline; display: inline;
border: none; border: none;
background: transparent; background: transparent;
background-image: none;
font-weight: normal; font-weight: normal;
padding: 0; padding: 0;
margin: 0; margin: 0;
@ -310,6 +318,7 @@ a.policy-control .caret {
.phui-button-bar-borderless .button { .phui-button-bar-borderless .button {
border: 0; border: 0;
background-color: transparent; background-color: transparent;
background-image: none;
padding-left: 10px; padding-left: 10px;
padding-right: 10px; padding-right: 10px;
} }
@ -321,6 +330,7 @@ a.policy-control .caret {
.phui-button-bar-borderless .button:hover { .phui-button-bar-borderless .button:hover {
background-color: transparent; background-color: transparent;
background-image: none;
border-radius: 3px; border-radius: 3px;
} }
@ -357,10 +367,12 @@ a.policy-control .caret {
.phui-button-bar .button.simple:hover { .phui-button-bar .button.simple:hover {
border-color: {$lightblueborder}; border-color: {$lightblueborder};
background-color: #fff; background-color: #fff;
background-image: none;
color: {$sky}; color: {$sky};
} }
.phui-button-bar .button.simple:hover .phui-icon-view { .phui-button-bar .button.simple:hover .phui-icon-view {
border-color: {$lightblueborder}; border-color: {$lightblueborder};
color: {$sky}; color: {$sky};
background-image: none;
} }