1
0
Fork 0
mirror of https://we.phorge.it/source/phorge.git synced 2024-11-22 23:02:42 +01:00

Styling up Jump Nav text box

Summary:
This actually gives it a smooth look across all OS and browsers. Copy-paste from form inputs.

= Motivation (aka Disclaimer) =

I felt kind of... disturbed that it looked different in every browser / OS combination I have at my disposal. The range is from ugly (Chrome on Ubuntu) to pretty (IE9 on Win7 ¬.¬). I give a few examples

 - Ubuntu
   - Firefox
     - Actually looking very nice. Rounded borders and orange border on focus are default from UA style sheet?
   - Chrome
     - Looks ugly. 2px inset mid-grey border. What you would expect from Win '95
     - 1px inset mid-grey border (Win '98 style) + orange webkit outline.
 - Windows
   - IE9
     - Nice blocky text input with black border. Blue border upon hover. Really black border on focus?
   - IE10
     - Kind of same as IE9, though I had the feeling that it had a deeper black border
   - Firefox
     - Looks so normal that it is actually boring
   - Chrome
     - Looks pretty much normal, until focus where you get the webkit outlines. Ugly

No Mac, since I have no Mac. Also no iPhone/iPad. Have Android 4.1/WP8, though I never visited Phabricator with them

Test Plan:
Looked at it in

 - Ubuntu
   - Mozilla Firefox
   - Google Chrome
 - Windows 7/8
   - IE 9/10
   - Opera (Opera?)
   - Mozilla Firefox
   - Google Chrome

Everything smooth (exceptions in case of no border-radius/box-shadow)

Reviewers: epriestley, btrahan, chad

CC: aran, Korvin

Differential Revision: https://secure.phabricator.com/D5515
This commit is contained in:
Anh Nhan Nguyen 2013-04-01 06:24:18 -07:00 committed by epriestley
parent 48f1a578f8
commit 6e197fe91c
2 changed files with 43 additions and 40 deletions

View file

@ -2975,7 +2975,7 @@ celerity_register_resource_map(array(
),
'phabricator-jump-nav' =>
array(
'uri' => '/res/2e0e2211/rsrc/css/application/directory/phabricator-jump-nav.css',
'uri' => '/res/a5927be8/rsrc/css/application/directory/phabricator-jump-nav.css',
'type' => 'css',
'requires' =>
array(
@ -3805,7 +3805,7 @@ celerity_register_resource_map(array(
), array(
'packages' =>
array(
'4fc2a8f9' =>
'341e7351' =>
array(
'name' => 'core.pkg.css',
'symbols' =>
@ -3847,7 +3847,7 @@ celerity_register_resource_map(array(
34 => 'phabricator-object-item-list-view-css',
35 => 'global-drag-and-drop-css',
),
'uri' => '/res/pkg/4fc2a8f9/core.pkg.css',
'uri' => '/res/pkg/341e7351/core.pkg.css',
'type' => 'css',
),
'def4c982' =>
@ -4038,16 +4038,16 @@ celerity_register_resource_map(array(
'reverse' =>
array(
'aphront-attached-file-view-css' => '6b1fccc6',
'aphront-dialog-view-css' => '4fc2a8f9',
'aphront-error-view-css' => '4fc2a8f9',
'aphront-form-view-css' => '4fc2a8f9',
'aphront-list-filter-view-css' => '4fc2a8f9',
'aphront-pager-view-css' => '4fc2a8f9',
'aphront-panel-view-css' => '4fc2a8f9',
'aphront-table-view-css' => '4fc2a8f9',
'aphront-tokenizer-control-css' => '4fc2a8f9',
'aphront-tooltip-css' => '4fc2a8f9',
'aphront-typeahead-control-css' => '4fc2a8f9',
'aphront-dialog-view-css' => '341e7351',
'aphront-error-view-css' => '341e7351',
'aphront-form-view-css' => '341e7351',
'aphront-list-filter-view-css' => '341e7351',
'aphront-pager-view-css' => '341e7351',
'aphront-panel-view-css' => '341e7351',
'aphront-table-view-css' => '341e7351',
'aphront-tokenizer-control-css' => '341e7351',
'aphront-tooltip-css' => '341e7351',
'aphront-typeahead-control-css' => '341e7351',
'differential-changeset-view-css' => '8aaacd1b',
'differential-core-view-css' => '8aaacd1b',
'differential-inline-comment-editor' => '67ea27d0',
@ -4061,7 +4061,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' => '4fc2a8f9',
'global-drag-and-drop-css' => '341e7351',
'inline-comment-summary-css' => '8aaacd1b',
'javelin-aphlict' => 'def4c982',
'javelin-behavior' => 'fe22443b',
@ -4133,48 +4133,48 @@ celerity_register_resource_map(array(
'javelin-util' => 'fe22443b',
'javelin-vector' => 'fe22443b',
'javelin-workflow' => 'fe22443b',
'lightbox-attachment-css' => '4fc2a8f9',
'lightbox-attachment-css' => '341e7351',
'maniphest-task-summary-css' => '6b1fccc6',
'maniphest-transaction-detail-css' => '6b1fccc6',
'phabricator-busy' => 'def4c982',
'phabricator-content-source-view-css' => '8aaacd1b',
'phabricator-core-buttons-css' => '4fc2a8f9',
'phabricator-core-css' => '4fc2a8f9',
'phabricator-crumbs-view-css' => '4fc2a8f9',
'phabricator-directory-css' => '4fc2a8f9',
'phabricator-core-buttons-css' => '341e7351',
'phabricator-core-css' => '341e7351',
'phabricator-crumbs-view-css' => '341e7351',
'phabricator-directory-css' => '341e7351',
'phabricator-drag-and-drop-file-upload' => '67ea27d0',
'phabricator-dropdown-menu' => 'def4c982',
'phabricator-file-upload' => 'def4c982',
'phabricator-filetree-view-css' => '4fc2a8f9',
'phabricator-flag-css' => '4fc2a8f9',
'phabricator-form-view-css' => '4fc2a8f9',
'phabricator-header-view-css' => '4fc2a8f9',
'phabricator-jump-nav' => '4fc2a8f9',
'phabricator-filetree-view-css' => '341e7351',
'phabricator-flag-css' => '341e7351',
'phabricator-form-view-css' => '341e7351',
'phabricator-header-view-css' => '341e7351',
'phabricator-jump-nav' => '341e7351',
'phabricator-keyboard-shortcut' => 'def4c982',
'phabricator-keyboard-shortcut-manager' => 'def4c982',
'phabricator-main-menu-view' => '4fc2a8f9',
'phabricator-main-menu-view' => '341e7351',
'phabricator-menu-item' => 'def4c982',
'phabricator-nav-view-css' => '4fc2a8f9',
'phabricator-nav-view-css' => '341e7351',
'phabricator-notification' => 'def4c982',
'phabricator-notification-css' => '4fc2a8f9',
'phabricator-notification-menu-css' => '4fc2a8f9',
'phabricator-object-item-list-view-css' => '4fc2a8f9',
'phabricator-notification-css' => '341e7351',
'phabricator-notification-menu-css' => '341e7351',
'phabricator-object-item-list-view-css' => '341e7351',
'phabricator-object-selector-css' => '8aaacd1b',
'phabricator-paste-file-upload' => 'def4c982',
'phabricator-prefab' => 'def4c982',
'phabricator-project-tag-css' => '6b1fccc6',
'phabricator-remarkup-css' => '4fc2a8f9',
'phabricator-remarkup-css' => '341e7351',
'phabricator-shaped-request' => '67ea27d0',
'phabricator-side-menu-view-css' => '4fc2a8f9',
'phabricator-standard-page-view' => '4fc2a8f9',
'phabricator-side-menu-view-css' => '341e7351',
'phabricator-standard-page-view' => '341e7351',
'phabricator-textareautils' => 'def4c982',
'phabricator-tooltip' => 'def4c982',
'phabricator-transaction-view-css' => '4fc2a8f9',
'phabricator-zindex-css' => '4fc2a8f9',
'sprite-apps-large-css' => '4fc2a8f9',
'sprite-gradient-css' => '4fc2a8f9',
'sprite-icon-css' => '4fc2a8f9',
'sprite-menu-css' => '4fc2a8f9',
'syntax-highlighting-css' => '4fc2a8f9',
'phabricator-transaction-view-css' => '341e7351',
'phabricator-zindex-css' => '341e7351',
'sprite-apps-large-css' => '341e7351',
'sprite-gradient-css' => '341e7351',
'sprite-icon-css' => '341e7351',
'sprite-menu-css' => '341e7351',
'syntax-highlighting-css' => '341e7351',
),
));

View file

@ -11,7 +11,10 @@
.phabricator-jump-nav {
font-size: 16px;
width: 100%;
padding: 2px 0;
padding: 4px;
border-radius: 3px;
border: 1px solid #96A6C5;
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
}
.phabricator-jump-nav-caption {