Page MenuHomestyx hydra
Files F1435373

No OneTemporary
Actions

View Options

diff --git a/resources/sprite/manifest/gradient.json b/resources/sprite/manifest/gradient.json
index 43736710c6..484ab83f2b 100644
--- a/resources/sprite/manifest/gradient.json
+++ b/resources/sprite/manifest/gradient.json
@@ -1,75 +1,75 @@
{
"version" : 1,
"sprites" : {
"gradient-black-dark" : {
"name" : "gradient-black-dark",
"rule" : ".gradient-black-dark, button.black, a.black, a.black:visited",
"hash" : "b9faf8505427bb14a8c51324e13e2f81"
},
"gradient-black-light" : {
"name" : "gradient-black-light",
"rule" : ".gradient-black-light, button.black:active, a.black:active",
"hash" : "812c3375d00ccc93c36c6df2eb565df4"
},
"gradient-blue-dark" : {
"name" : "gradient-blue-dark",
"rule" : ".gradient-blue-dark, button, a.button, a.button:visited, input.inputsubmit",
"hash" : "adc2d0f7397374936384014c5d78550d"
},
"gradient-blue-light" : {
"name" : "gradient-blue-light",
"rule" : ".gradient-blue-light, button:active, a.button:active",
"hash" : "91b841067a63e543a4dcd9d41e0a2e5c"
},
"gradient-breadcrumbs" : {
"name" : "gradient-breadcrumbs",
"rule" : ".gradient-breadcrumbs",
"hash" : "688ab77f50cfbc17ec30d798efb1b39e"
},
"gradient-dark-menu-label" : {
"name" : "gradient-dark-menu-label",
"rule" : ".gradient-dark-menu-label, .phabricator-dark-menu .phabricator-menu-item-type-label",
"hash" : "89a908596142d38fbe61a706694cd321"
},
"gradient-green-dark" : {
"name" : "gradient-green-dark",
"rule" : ".gradient-green-dark, button.green, a.green, a.green:visited",
"hash" : "0d19ab593772b6b406c0db309b3a14fb"
},
"gradient-green-light" : {
"name" : "gradient-green-light",
"rule" : ".gradient-green-light, button.green:active, a.green:active",
"hash" : "71c67916327ec7fc65149ab72c3a2924"
},
"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" : "32651902d28d37dca01cf067072c39c0"
},
"gradient-grey-light" : {
"name" : "gradient-grey-light",
"rule" : ".gradient-grey-light, button.grey:active, a.grey:active, button.grey_active, a.dropdown-open",
"hash" : "c3c9ee1ed6f800a4ac86910b94687877"
},
"gradient-menu-hover" : {
"name" : "gradient-menu-hover",
- "rule" : ".gradient-menu-hover, .device-desktop .phabricator-side-menu a.phabricator-menu-item-type-link:hover",
+ "rule" : ".gradient-menu-hover, .device-desktop .phabricator-side-menu a.phabricator-menu-item-type-link:hover, .phabricator-filetree a.phabricator-filetree-item:hover",
"hash" : "856380207ac8c5cb6770d44dceb245a8"
},
"gradient-menu-label" : {
"name" : "gradient-menu-label",
"rule" : ".gradient-menu-label, .phabricator-side-menu .phabricator-menu-item-type-label",
"hash" : "8ad8352b077ae02820ebbbae26dc669b"
},
"gradient-menu-selected" : {
"name" : "gradient-menu-selected",
- "rule" : ".gradient-menu-selected, .phabricator-side-menu .phabricator-menu-item-selected, .device-desktop .phabricator-side-menu a.phabricator-menu-item-selected:hover",
+ "rule" : ".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",
"hash" : "815bafb94e11c23e1a419ea85dcae113"
}
},
"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 {\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, 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",
"type" : "repeat-x"
}
diff --git a/src/infrastructure/celerity/CeleritySpriteGenerator.php b/src/infrastructure/celerity/CeleritySpriteGenerator.php
index d926b9885e..b9faed446d 100644
--- a/src/infrastructure/celerity/CeleritySpriteGenerator.php
+++ b/src/infrastructure/celerity/CeleritySpriteGenerator.php
@@ -1,434 +1,438 @@
<?php
final class CeleritySpriteGenerator {
public function buildIconSheet() {
$icons = $this->getDirectoryList('icons_1x');
$colors = array(
'',
'grey',
'white',
);
$scales = array(
'1x' => 1,
'2x' => 2,
);
$template = id(new PhutilSprite())
->setSourceSize(14, 14);
$sprites = array();
foreach ($colors as $color) {
foreach ($icons as $icon) {
$prefix = 'icons_';
if (strlen($color)) {
$prefix .= $color.'_';
}
$suffix = '';
if (strlen($color)) {
$suffix = '-'.$color;
}
$sprite = id(clone $template)
->setName('action-'.$icon.$suffix);
if ($color == 'white') {
$sprite->setTargetCSS(
'.action-'.$icon.$suffix.', '.
'.device-desktop .phabricator-action-view:hover .action-'.$icon);
} else {
$sprite->setTargetCSS('.action-'.$icon.$suffix);
}
foreach ($scales as $scale_key => $scale) {
$path = $this->getPath($prefix.$scale_key.'/'.$icon.'.png');
$sprite->setSourceFile($path, $scale);
}
$sprites[] = $sprite;
}
}
$remarkup_icons = $this->getDirectoryList('remarkup_1x');
foreach ($remarkup_icons as $icon) {
$prefix = 'remarkup_';
// Strip 'text_' from these file names.
$class_name = substr($icon, 5);
$sprite = id(clone $template)
->setName('remarkup-assist-'.$icon)
->setTargetCSS('.remarkup-assist-'.$class_name);
foreach ($scales as $scale_key => $scale) {
$path = $this->getPath($prefix.$scale_key.'/'.$icon.'.png');
$sprite->setSourceFile($path, $scale);
}
$sprites[] = $sprite;
}
$sheet = $this->buildSheet('icon', true);
$sheet->setScales($scales);
foreach ($sprites as $sprite) {
$sheet->addSprite($sprite);
}
return $sheet;
}
public function buildMenuSheet() {
$sprites = array();
$sources = array(
'round_bubble' => array(
'x' => 26,
'y' => 26,
'css' => '.phabricator-main-menu-alert-bubble'
),
'bubble' => array(
'x' => 46,
'y' => 26,
'css' => '.phabricator-main-menu-alert-bubble.alert-unread'
),
'seen_read_all' => array(
'x' => 14,
'y' => 14,
'css' =>
'.alert-notifications .phabricator-main-menu-alert-icon',
),
'seen_have_unread' => array(
'x' => 14,
'y' => 14,
'css' =>
'.alert-notifications:hover .phabricator-main-menu-alert-icon',
),
'unseen_any' => array(
'x' => 14,
'y' => 14,
'css' =>
'.alert-notifications.alert-unread .phabricator-main-menu-alert-icon',
),
'arrow-right' => array(
'x' => 9,
'y' => 31,
'css' => '.phabricator-crumb-divider',
),
'eye' => array(
'x' => 24,
'y' => 20,
'css' => '.menu-icon-eye',
),
'app' => array(
'x' => 24,
'y' => 20,
'css' => '.menu-icon-app',
),
'logo' => array(
'x' => 139,
'y' => 25,
'css' => '.phabricator-main-menu-logo-image',
),
);
$scales = array(
'1x' => 1,
'2x' => 2,
);
$template = new PhutilSprite();
foreach ($sources as $name => $spec) {
$sprite = id(clone $template)
->setName($name)
->setSourceSize($spec['x'], $spec['y'])
->setTargetCSS($spec['css']);
foreach ($scales as $scale_name => $scale) {
$path = 'menu_'.$scale_name.'/'.$name.'.png';
$path = $this->getPath($path);
$sprite->setSourceFile($path, $scale);
}
$sprites[] = $sprite;
}
$sheet = $this->buildSheet('menu', true);
$sheet->setScales($scales);
foreach ($sprites as $sprite) {
$sheet->addSprite($sprite);
}
return $sheet;
}
public function buildGradientSheet() {
$gradients = $this->getDirectoryList('gradients');
$template = new PhutilSprite();
$unusual_heights = array(
'dark-menu-label' => 25,
'breadcrumbs' => 31,
'menu-hover' => 28,
'menu-label' => 24,
'menu-selected' => 28,
);
// 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_combine($gradients, $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' =>
', .phabricator-side-menu .phabricator-menu-item-type-label',
'menu-hover' =>
', .device-desktop .phabricator-side-menu '.
- 'a.phabricator-menu-item-type-link:hover',
+ 'a.phabricator-menu-item-type-link:hover, '.
+ '.phabricator-filetree a.phabricator-filetree-item:hover',
'menu-selected' =>
', .phabricator-side-menu .phabricator-menu-item-selected, '.
'.device-desktop .phabricator-side-menu '.
- 'a.phabricator-menu-item-selected:hover',
+ 'a.phabricator-menu-item-selected:hover, '.
+ '.phabricator-nav-local a.phabricator-active-nav-focus',
);
$sprites = array();
foreach ($gradients as $gradient) {
$path = $this->getPath('gradients/'.$gradient.'.png');
$sprite = id(clone $template)
->setName('gradient-'.$gradient)
->setSourceFile($path)
->setTargetCSS('.gradient-'.$gradient.idx($extra_css, $gradient));
$sprite->setSourceSize(4, idx($unusual_heights, $gradient, 26));
$sprites[] = $sprite;
}
$sheet = $this->buildSheet(
'gradient',
false,
PhutilSpriteSheet::TYPE_REPEAT_X,
', 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 ');
+ 'a.phabricator-menu-item-selected:hover, '.
+ '.phabricator-filetree a.phabricator-filetree-item:hover, '.
+ '.phabricator-filetree a.phabricator-active-nav-focus');
foreach ($sprites as $sprite) {
$sheet->addSprite($sprite);
}
return $sheet;
}
public function buildAppsSheet() {
return $this->buildAppsSheetVariant(1);
}
public function buildAppsLargeSheet() {
return $this->buildAppsSheetVariant(2);
}
public function buildAppsXLargeSheet() {
return $this->buildAppsSheetVariant(3);
}
private function buildAppsSheetVariant($variant) {
if ($variant == 1) {
$scales = array(
'1x' => 1,
'2x' => 2,
);
$variant_name = 'apps';
$variant_short = '';
$size_x = 14;
$size_y = 14;
$colors = array(
'dark' => 'dark',
);
} else if ($variant == 2) {
$scales = array(
'2x' => 1,
'4x' => 2,
);
$variant_name = 'apps-large';
$variant_short = '-large';
$size_x = 28;
$size_y = 28;
$colors = array(
'light' => 'lb',
'dark' => 'dark',
'blue' => 'blue',
'glow' => 'glow',
);
} else {
$scales = array(
'4x' => 1,
);
$variant_name = 'apps-xlarge';
$variant_short = '-xlarge';
$size_x = 56;
$size_y = 56;
$colors = array(
'dark' => 'dark',
/*
TODO: These are available but not currently used.
'blue' => 'blue',
'light' => 'lb',
'glow' => 'glow',
*/
);
}
$apps = $this->getDirectoryList('apps_dark_1x');
$template = id(new PhutilSprite())
->setSourceSize($size_x, $size_y);
$sprites = array();
foreach ($apps as $app) {
foreach ($colors as $color => $color_path) {
$css = '.app-'.$app.'-'.$color.$variant_short;
if ($color == 'blue' && $variant_name == 'apps-large') {
$css .= ', .phabricator-crumb-view:hover .app-'.$app.'-dark-large';
}
if ($color == 'glow' && $variant_name == 'apps-large') {
$css .= ', .device-desktop .phabricator-dark-menu a:hover '.
'.app-'.$app.'-light-large';
}
$sprite = id(clone $template)
->setName('app-'.$app.'-'.$color.$variant_short)
->setTargetCSS($css);
foreach ($scales as $scale_name => $scale) {
$path = $this->getPath(
'apps_'.$color_path.'_'.$scale_name.'/'.$app.'.png');
$sprite->setSourceFile($path, $scale);
}
$sprites[] = $sprite;
}
}
$sheet = $this->buildSheet($variant_name, count($scales) > 1);
$sheet->setScales($scales);
foreach ($sprites as $sprite) {
$sheet->addSprite($sprite);
}
return $sheet;
}
private function getPath($to_path = null) {
$root = dirname(phutil_get_library_root('phabricator'));
return $root.'/resources/sprite/'.$to_path;
}
private function getDirectoryList($dir) {
$path = $this->getPath($dir);
$result = array();
$images = Filesystem::listDirectory($path, $include_hidden = false);
foreach ($images as $image) {
if (!preg_match('/\.png$/', $image)) {
throw new Exception(
"Expected file '{$image}' in '{$path}' to be a sprite source ".
"ending in '.png'.");
}
$result[] = substr($image, 0, -4);
}
return $result;
}
private function buildSheet(
$name,
$has_retina,
$type = null,
$extra_css = '') {
$sheet = new PhutilSpriteSheet();
$at = '@';
switch ($type) {
case PhutilSpriteSheet::TYPE_STANDARD:
default:
$type = PhutilSpriteSheet::TYPE_STANDARD;
$repeat_rule = 'no-repeat';
break;
case PhutilSpriteSheet::TYPE_REPEAT_X:
$repeat_rule = 'repeat-x';
break;
case PhutilSpriteSheet::TYPE_REPEAT_Y:
$repeat_rule = 'repeat-y';
break;
}
$retina_rules = null;
if ($has_retina) {
$retina_rules = <<<EOCSS
@media
only screen and (min-device-pixel-ratio: 1.5),
only screen and (-webkit-min-device-pixel-ratio: 1.5) {
.sprite-{$name}{$extra_css} {
background-image: url(/rsrc/image/sprite-{$name}-X2.png);
background-size: {X}px {Y}px;
}
}
EOCSS;
}
$sheet->setSheetType($type);
$sheet->setCSSHeader(<<<EOCSS
/**
* @provides sprite-{$name}-css
* {$at}generated
*/
.sprite-{$name}{$extra_css} {
background-image: url(/rsrc/image/sprite-{$name}.png);
background-repeat: {$repeat_rule};
}
{$retina_rules}
EOCSS
);
return $sheet;
}
}
diff --git a/webroot/rsrc/css/layout/phabricator-filetree-view.css b/webroot/rsrc/css/layout/phabricator-filetree-view.css
index 5b96f71f4a..5cb5026f63 100644
--- a/webroot/rsrc/css/layout/phabricator-filetree-view.css
+++ b/webroot/rsrc/css/layout/phabricator-filetree-view.css
@@ -1,65 +1,57 @@
/**
* @provides phabricator-filetree-view-css
*/
.phabricator-filetree {
padding: 4px 0;
}
/* NOTE: Until the whole side nav situation gets cleaned up, we need to be
highly specific in specifying selectors here, to override side nav styles.
*/
.phabricator-filetree .phabricator-filetree-item {
margin: 0;
padding: 0;
display: block;
}
.phabricator-filetree span.phabricator-filetree-icon {
background-repeat: no-repeat;
background-position: 0 2px;
width: 16px;
height: 20px;
padding: 0;
float: left;
}
.phabricator-filetree span.phabricator-filetree-name {
padding: 0;
margin-left: 4px;
font-size: 11px;
font-weight: normal;
line-height: 20px;
white-space: nowrap;
}
.phabricator-filetree span.phabricator-filetree-item
.phabricator-filetree-name {
color: #a0a0a0;
}
.phabricator-filetree a.phabricator-filetree-item
.phabricator-filetree-name {
color: #fff;
}
.phabricator-filetree a.phabricator-filetree-item:hover {
- background-image: url(/rsrc/image/menu_hover.png);
- background-repeat: repeat-x;
text-decoration: none;
}
.phabricator-filetree-icon-file {
background-image: url(/rsrc/image/icon/fatcow/page_white_text.png);
}
.phabricator-filetree-icon-dir {
background-image: url(/rsrc/image/icon/fatcow/folder.png);
}
-
-.phabricator-nav-local
- a.phabricator-active-nav-focus {
- background-image: url(/rsrc/image/menu_selected.png);
- background-repeat: repeat-x;
-}
diff --git a/webroot/rsrc/css/sprite-gradient.css b/webroot/rsrc/css/sprite-gradient.css
index be9a1a9464..861ebc5249 100644
--- a/webroot/rsrc/css/sprite-gradient.css
+++ b/webroot/rsrc/css/sprite-gradient.css
@@ -1,64 +1,64 @@
/**
* @provides sprite-gradient-css
* @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 {
+.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 {
background-image: url(/rsrc/image/sprite-gradient.png);
background-repeat: repeat-x;
}
.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-breadcrumbs {
background-position: 0px -325px;
}
.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-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;
}
.gradient-grey-light, button.grey:active, a.grey:active, button.grey_active, a.dropdown-open {
background-position: 0px -240px;
}
-.gradient-menu-hover, .device-desktop .phabricator-side-menu a.phabricator-menu-item-type-link:hover {
+.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;
}
.gradient-menu-label, .phabricator-side-menu .phabricator-menu-item-type-label {
background-position: 0px 0px;
}
-.gradient-menu-selected, .phabricator-side-menu .phabricator-menu-item-selected, .device-desktop .phabricator-side-menu a.phabricator-menu-item-selected:hover {
+.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;
}

File Metadata

Mime Type
text/x-diff
Expires
Thu, Nov 6, 11:35 AM (6 h, 40 m)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
321999
Default Alt Text
(22 KB)

Event Timeline

styx copyright 2020 sirocyl / ellie (kymkdd) / ncommander / styx contributors
Use of other names and brands is not intended to reflect a claim of, or right to, use the name or brand.
styx is an operating system using the Linux kernel and components, and "styx Linux" as a phrase does not reflect the inclusion of the Linux brand or trademark in the styx project.
Linux® is the registered trademark of Linus Torvalds in the U.S. and other countries.
Terms and Conditions (TODO: fix this!)