1
0
Fork 0
mirror of https://we.phorge.it/source/phorge.git synced 2024-11-09 16:32:39 +01:00

PHUIListView Examples, CSS

Summary: This adds examples and abstracts out CSS for common nav re-use.

Test Plan: Tested DocumentExample and ListExample

Reviewers: epriestley

Reviewed By: epriestley

CC: aran, Korvin

Differential Revision: https://secure.phabricator.com/D6138
This commit is contained in:
Chad Little 2013-06-05 15:03:56 -07:00
parent 8b95669e82
commit 3029d72d5c
10 changed files with 542 additions and 262 deletions

View file

@ -13,7 +13,7 @@
},
"icons-action-menu-white" : {
"name" : "icons-action-menu-white",
"rule" : ".icons-action-menu-white, .device-desktop .phabricator-action-view:hover .icons-action-menu",
"rule" : ".icons-action-menu-white, .device-desktop .phabricator-action-view:hover .icons-action-menu, .device-desktop .phui-list-item-href:hover .icons-action-menu",
"hash" : "9d55cbd69e36bd5ead2bf6164d3db1e1"
},
"icons-arrow_left" : {
@ -28,7 +28,7 @@
},
"icons-arrow_left-white" : {
"name" : "icons-arrow_left-white",
"rule" : ".icons-arrow_left-white, .device-desktop .phabricator-action-view:hover .icons-arrow_left",
"rule" : ".icons-arrow_left-white, .device-desktop .phabricator-action-view:hover .icons-arrow_left, .device-desktop .phui-list-item-href:hover .icons-arrow_left",
"hash" : "db6e133e414df16ba763804d021b435d"
},
"icons-arrow_right" : {
@ -43,7 +43,7 @@
},
"icons-arrow_right-white" : {
"name" : "icons-arrow_right-white",
"rule" : ".icons-arrow_right-white, .device-desktop .phabricator-action-view:hover .icons-arrow_right",
"rule" : ".icons-arrow_right-white, .device-desktop .phabricator-action-view:hover .icons-arrow_right, .device-desktop .phui-list-item-href:hover .icons-arrow_right",
"hash" : "6925b13d5542e921bcc7c2eb623f7582"
},
"icons-attach" : {
@ -58,7 +58,7 @@
},
"icons-attach-white" : {
"name" : "icons-attach-white",
"rule" : ".icons-attach-white, .device-desktop .phabricator-action-view:hover .icons-attach",
"rule" : ".icons-attach-white, .device-desktop .phabricator-action-view:hover .icons-attach, .device-desktop .phui-list-item-href:hover .icons-attach",
"hash" : "9ae9dc42073237e7b085f4caef712048"
},
"icons-blame" : {
@ -73,7 +73,7 @@
},
"icons-blame-white" : {
"name" : "icons-blame-white",
"rule" : ".icons-blame-white, .device-desktop .phabricator-action-view:hover .icons-blame",
"rule" : ".icons-blame-white, .device-desktop .phabricator-action-view:hover .icons-blame, .device-desktop .phui-list-item-href:hover .icons-blame",
"hash" : "f8d98f5c027b095ac7605d8dae9bf3d9"
},
"icons-check" : {
@ -88,7 +88,7 @@
},
"icons-check-white" : {
"name" : "icons-check-white",
"rule" : ".icons-check-white, .device-desktop .phabricator-action-view:hover .icons-check",
"rule" : ".icons-check-white, .device-desktop .phabricator-action-view:hover .icons-check, .device-desktop .phui-list-item-href:hover .icons-check",
"hash" : "b445190f6c89fb147aa8c3dee3afe0a0"
},
"icons-comment" : {
@ -103,7 +103,7 @@
},
"icons-comment-white" : {
"name" : "icons-comment-white",
"rule" : ".icons-comment-white, .device-desktop .phabricator-action-view:hover .icons-comment",
"rule" : ".icons-comment-white, .device-desktop .phabricator-action-view:hover .icons-comment, .device-desktop .phui-list-item-href:hover .icons-comment",
"hash" : "10021e512033d0d200f88c27e35a88e4"
},
"icons-computer" : {
@ -118,7 +118,7 @@
},
"icons-computer-white" : {
"name" : "icons-computer-white",
"rule" : ".icons-computer-white, .device-desktop .phabricator-action-view:hover .icons-computer",
"rule" : ".icons-computer-white, .device-desktop .phabricator-action-view:hover .icons-computer, .device-desktop .phui-list-item-href:hover .icons-computer",
"hash" : "83a148289ede93d1fa4e11a4dc5e0f92"
},
"icons-create" : {
@ -133,7 +133,7 @@
},
"icons-create-white" : {
"name" : "icons-create-white",
"rule" : ".icons-create-white, .device-desktop .phabricator-action-view:hover .icons-create",
"rule" : ".icons-create-white, .device-desktop .phabricator-action-view:hover .icons-create, .device-desktop .phui-list-item-href:hover .icons-create",
"hash" : "e7a13473ba24e316437fa28ea8a85c06"
},
"icons-delete" : {
@ -148,7 +148,7 @@
},
"icons-delete-white" : {
"name" : "icons-delete-white",
"rule" : ".icons-delete-white, .device-desktop .phabricator-action-view:hover .icons-delete",
"rule" : ".icons-delete-white, .device-desktop .phabricator-action-view:hover .icons-delete, .device-desktop .phui-list-item-href:hover .icons-delete",
"hash" : "859a31bba89ed651528214fe87d9e45e"
},
"icons-disable" : {
@ -163,7 +163,7 @@
},
"icons-disable-white" : {
"name" : "icons-disable-white",
"rule" : ".icons-disable-white, .device-desktop .phabricator-action-view:hover .icons-disable",
"rule" : ".icons-disable-white, .device-desktop .phabricator-action-view:hover .icons-disable, .device-desktop .phui-list-item-href:hover .icons-disable",
"hash" : "1b2f7d22aceda27bbad8e3ff78c144fc"
},
"icons-dislike" : {
@ -178,7 +178,7 @@
},
"icons-dislike-white" : {
"name" : "icons-dislike-white",
"rule" : ".icons-dislike-white, .device-desktop .phabricator-action-view:hover .icons-dislike",
"rule" : ".icons-dislike-white, .device-desktop .phabricator-action-view:hover .icons-dislike, .device-desktop .phui-list-item-href:hover .icons-dislike",
"hash" : "0858f0215de582e863392d08e551e872"
},
"icons-download" : {
@ -198,7 +198,7 @@
},
"icons-download-alt-white" : {
"name" : "icons-download-alt-white",
"rule" : ".icons-download-alt-white, .device-desktop .phabricator-action-view:hover .icons-download-alt",
"rule" : ".icons-download-alt-white, .device-desktop .phabricator-action-view:hover .icons-download-alt, .device-desktop .phui-list-item-href:hover .icons-download-alt",
"hash" : "cf729645fbc76e20988e306919b6dcd6"
},
"icons-download-grey" : {
@ -208,7 +208,7 @@
},
"icons-download-white" : {
"name" : "icons-download-white",
"rule" : ".icons-download-white, .device-desktop .phabricator-action-view:hover .icons-download",
"rule" : ".icons-download-white, .device-desktop .phabricator-action-view:hover .icons-download, .device-desktop .phui-list-item-href:hover .icons-download",
"hash" : "8c2b2afa0486b8ef8113a21046189b43"
},
"icons-edit" : {
@ -223,7 +223,7 @@
},
"icons-edit-white" : {
"name" : "icons-edit-white",
"rule" : ".icons-edit-white, .device-desktop .phabricator-action-view:hover .icons-edit",
"rule" : ".icons-edit-white, .device-desktop .phabricator-action-view:hover .icons-edit, .device-desktop .phui-list-item-href:hover .icons-edit",
"hash" : "b1526e67cd65bd60607147caf9aa3369"
},
"icons-enable" : {
@ -238,7 +238,7 @@
},
"icons-enable-white" : {
"name" : "icons-enable-white",
"rule" : ".icons-enable-white, .device-desktop .phabricator-action-view:hover .icons-enable",
"rule" : ".icons-enable-white, .device-desktop .phabricator-action-view:hover .icons-enable, .device-desktop .phui-list-item-href:hover .icons-enable",
"hash" : "5b9fdd94fcde1c7a2e074c71d464c1ed"
},
"icons-file" : {
@ -253,7 +253,7 @@
},
"icons-file-white" : {
"name" : "icons-file-white",
"rule" : ".icons-file-white, .device-desktop .phabricator-action-view:hover .icons-file",
"rule" : ".icons-file-white, .device-desktop .phabricator-action-view:hover .icons-file, .device-desktop .phui-list-item-href:hover .icons-file",
"hash" : "275b41e31652cd9b7556dd985b4d5eed"
},
"icons-flag" : {
@ -273,7 +273,7 @@
},
"icons-flag-0-white" : {
"name" : "icons-flag-0-white",
"rule" : ".icons-flag-0-white, .device-desktop .phabricator-action-view:hover .icons-flag-0",
"rule" : ".icons-flag-0-white, .device-desktop .phabricator-action-view:hover .icons-flag-0, .device-desktop .phui-list-item-href:hover .icons-flag-0",
"hash" : "00c6591396c05743e54ee04f5b0f68fc"
},
"icons-flag-1" : {
@ -288,7 +288,7 @@
},
"icons-flag-1-white" : {
"name" : "icons-flag-1-white",
"rule" : ".icons-flag-1-white, .device-desktop .phabricator-action-view:hover .icons-flag-1",
"rule" : ".icons-flag-1-white, .device-desktop .phabricator-action-view:hover .icons-flag-1, .device-desktop .phui-list-item-href:hover .icons-flag-1",
"hash" : "2fffee21ac589b14f132bbcc45651eb6"
},
"icons-flag-2" : {
@ -303,7 +303,7 @@
},
"icons-flag-2-white" : {
"name" : "icons-flag-2-white",
"rule" : ".icons-flag-2-white, .device-desktop .phabricator-action-view:hover .icons-flag-2",
"rule" : ".icons-flag-2-white, .device-desktop .phabricator-action-view:hover .icons-flag-2, .device-desktop .phui-list-item-href:hover .icons-flag-2",
"hash" : "ccd24334d37322a785412bee002e0d15"
},
"icons-flag-3" : {
@ -318,7 +318,7 @@
},
"icons-flag-3-white" : {
"name" : "icons-flag-3-white",
"rule" : ".icons-flag-3-white, .device-desktop .phabricator-action-view:hover .icons-flag-3",
"rule" : ".icons-flag-3-white, .device-desktop .phabricator-action-view:hover .icons-flag-3, .device-desktop .phui-list-item-href:hover .icons-flag-3",
"hash" : "17e284ba1e90eb6c497305c1517acf63"
},
"icons-flag-4" : {
@ -333,7 +333,7 @@
},
"icons-flag-4-white" : {
"name" : "icons-flag-4-white",
"rule" : ".icons-flag-4-white, .device-desktop .phabricator-action-view:hover .icons-flag-4",
"rule" : ".icons-flag-4-white, .device-desktop .phabricator-action-view:hover .icons-flag-4, .device-desktop .phui-list-item-href:hover .icons-flag-4",
"hash" : "242afc477e6dfa080265c8ceffd6abc5"
},
"icons-flag-5" : {
@ -348,7 +348,7 @@
},
"icons-flag-5-white" : {
"name" : "icons-flag-5-white",
"rule" : ".icons-flag-5-white, .device-desktop .phabricator-action-view:hover .icons-flag-5",
"rule" : ".icons-flag-5-white, .device-desktop .phabricator-action-view:hover .icons-flag-5, .device-desktop .phui-list-item-href:hover .icons-flag-5",
"hash" : "71304837f9d833d9e984075a8b7fcaf6"
},
"icons-flag-6" : {
@ -363,7 +363,7 @@
},
"icons-flag-6-white" : {
"name" : "icons-flag-6-white",
"rule" : ".icons-flag-6-white, .device-desktop .phabricator-action-view:hover .icons-flag-6",
"rule" : ".icons-flag-6-white, .device-desktop .phabricator-action-view:hover .icons-flag-6, .device-desktop .phui-list-item-href:hover .icons-flag-6",
"hash" : "bb856ce0de517204504e40cafb26f86b"
},
"icons-flag-7" : {
@ -378,7 +378,7 @@
},
"icons-flag-7-white" : {
"name" : "icons-flag-7-white",
"rule" : ".icons-flag-7-white, .device-desktop .phabricator-action-view:hover .icons-flag-7",
"rule" : ".icons-flag-7-white, .device-desktop .phabricator-action-view:hover .icons-flag-7, .device-desktop .phui-list-item-href:hover .icons-flag-7",
"hash" : "2bc5f6646db390b093e251ef1323abab"
},
"icons-flag-ghost" : {
@ -393,7 +393,7 @@
},
"icons-flag-ghost-white" : {
"name" : "icons-flag-ghost-white",
"rule" : ".icons-flag-ghost-white, .device-desktop .phabricator-action-view:hover .icons-flag-ghost",
"rule" : ".icons-flag-ghost-white, .device-desktop .phabricator-action-view:hover .icons-flag-ghost, .device-desktop .phui-list-item-href:hover .icons-flag-ghost",
"hash" : "9a63ac63142d07a43cb94ef68605cfe5"
},
"icons-flag-grey" : {
@ -403,7 +403,7 @@
},
"icons-flag-white" : {
"name" : "icons-flag-white",
"rule" : ".icons-flag-white, .device-desktop .phabricator-action-view:hover .icons-flag",
"rule" : ".icons-flag-white, .device-desktop .phabricator-action-view:hover .icons-flag, .device-desktop .phui-list-item-href:hover .icons-flag",
"hash" : "ebf95ab2f5c0e7ffc271848260c08379"
},
"icons-folder-open" : {
@ -418,7 +418,7 @@
},
"icons-folder-open-white" : {
"name" : "icons-folder-open-white",
"rule" : ".icons-folder-open-white, .device-desktop .phabricator-action-view:hover .icons-folder-open",
"rule" : ".icons-folder-open-white, .device-desktop .phabricator-action-view:hover .icons-folder-open, .device-desktop .phui-list-item-href:hover .icons-folder-open",
"hash" : "d910fa40ee5b3e7096d29f29cd1ebe6a"
},
"icons-fork" : {
@ -433,7 +433,7 @@
},
"icons-fork-white" : {
"name" : "icons-fork-white",
"rule" : ".icons-fork-white, .device-desktop .phabricator-action-view:hover .icons-fork",
"rule" : ".icons-fork-white, .device-desktop .phabricator-action-view:hover .icons-fork, .device-desktop .phui-list-item-href:hover .icons-fork",
"hash" : "3b0887096e1cb13884cbfd2530574483"
},
"icons-herald" : {
@ -448,7 +448,7 @@
},
"icons-herald-white" : {
"name" : "icons-herald-white",
"rule" : ".icons-herald-white, .device-desktop .phabricator-action-view:hover .icons-herald",
"rule" : ".icons-herald-white, .device-desktop .phabricator-action-view:hover .icons-herald, .device-desktop .phui-list-item-href:hover .icons-herald",
"hash" : "6242153ab3c8f93f4955d292d8522948"
},
"icons-highlight" : {
@ -463,7 +463,7 @@
},
"icons-highlight-white" : {
"name" : "icons-highlight-white",
"rule" : ".icons-highlight-white, .device-desktop .phabricator-action-view:hover .icons-highlight",
"rule" : ".icons-highlight-white, .device-desktop .phabricator-action-view:hover .icons-highlight, .device-desktop .phui-list-item-href:hover .icons-highlight",
"hash" : "b5efcd2a6ec49595792bad47c331c0d3"
},
"icons-history" : {
@ -478,7 +478,7 @@
},
"icons-history-white" : {
"name" : "icons-history-white",
"rule" : ".icons-history-white, .device-desktop .phabricator-action-view:hover .icons-history",
"rule" : ".icons-history-white, .device-desktop .phabricator-action-view:hover .icons-history, .device-desktop .phui-list-item-href:hover .icons-history",
"hash" : "4fd4dfabc22f4346d820a8f501b56b0e"
},
"icons-image" : {
@ -493,7 +493,7 @@
},
"icons-image-white" : {
"name" : "icons-image-white",
"rule" : ".icons-image-white, .device-desktop .phabricator-action-view:hover .icons-image",
"rule" : ".icons-image-white, .device-desktop .phabricator-action-view:hover .icons-image, .device-desktop .phui-list-item-href:hover .icons-image",
"hash" : "941cbbb2912d6571fae11dbb7c36eee2"
},
"icons-like" : {
@ -508,7 +508,7 @@
},
"icons-like-white" : {
"name" : "icons-like-white",
"rule" : ".icons-like-white, .device-desktop .phabricator-action-view:hover .icons-like",
"rule" : ".icons-like-white, .device-desktop .phabricator-action-view:hover .icons-like, .device-desktop .phui-list-item-href:hover .icons-like",
"hash" : "db11b26d7560f9ba08b8ad93c2117fca"
},
"icons-link" : {
@ -523,7 +523,7 @@
},
"icons-link-white" : {
"name" : "icons-link-white",
"rule" : ".icons-link-white, .device-desktop .phabricator-action-view:hover .icons-link",
"rule" : ".icons-link-white, .device-desktop .phabricator-action-view:hover .icons-link, .device-desktop .phui-list-item-href:hover .icons-link",
"hash" : "cf9aa020ac4ec5295c4e1fead1bc3392"
},
"icons-lint-info" : {
@ -538,7 +538,7 @@
},
"icons-lint-info-white" : {
"name" : "icons-lint-info-white",
"rule" : ".icons-lint-info-white, .device-desktop .phabricator-action-view:hover .icons-lint-info",
"rule" : ".icons-lint-info-white, .device-desktop .phabricator-action-view:hover .icons-lint-info, .device-desktop .phui-list-item-href:hover .icons-lint-info",
"hash" : "a5577ebb3c32f2a7ae9b27acfa382dc1"
},
"icons-lint-ok" : {
@ -553,7 +553,7 @@
},
"icons-lint-ok-white" : {
"name" : "icons-lint-ok-white",
"rule" : ".icons-lint-ok-white, .device-desktop .phabricator-action-view:hover .icons-lint-ok",
"rule" : ".icons-lint-ok-white, .device-desktop .phabricator-action-view:hover .icons-lint-ok, .device-desktop .phui-list-item-href:hover .icons-lint-ok",
"hash" : "fa0d4b920cc7d3a946a3f6101a13d213"
},
"icons-lint-warning" : {
@ -568,7 +568,7 @@
},
"icons-lint-warning-white" : {
"name" : "icons-lint-warning-white",
"rule" : ".icons-lint-warning-white, .device-desktop .phabricator-action-view:hover .icons-lint-warning",
"rule" : ".icons-lint-warning-white, .device-desktop .phabricator-action-view:hover .icons-lint-warning, .device-desktop .phui-list-item-href:hover .icons-lint-warning",
"hash" : "da6c36d4248622da96531e8e751d37b8"
},
"icons-lock" : {
@ -583,7 +583,7 @@
},
"icons-lock-white" : {
"name" : "icons-lock-white",
"rule" : ".icons-lock-white, .device-desktop .phabricator-action-view:hover .icons-lock",
"rule" : ".icons-lock-white, .device-desktop .phabricator-action-view:hover .icons-lock, .device-desktop .phui-list-item-href:hover .icons-lock",
"hash" : "cb5142f12c3ac17a1076e5419615b991"
},
"icons-love" : {
@ -598,7 +598,7 @@
},
"icons-love-white" : {
"name" : "icons-love-white",
"rule" : ".icons-love-white, .device-desktop .phabricator-action-view:hover .icons-love",
"rule" : ".icons-love-white, .device-desktop .phabricator-action-view:hover .icons-love, .device-desktop .phui-list-item-href:hover .icons-love",
"hash" : "69bda98d0964ee957c4a4f23449363d9"
},
"icons-merge" : {
@ -613,7 +613,7 @@
},
"icons-merge-white" : {
"name" : "icons-merge-white",
"rule" : ".icons-merge-white, .device-desktop .phabricator-action-view:hover .icons-merge",
"rule" : ".icons-merge-white, .device-desktop .phabricator-action-view:hover .icons-merge, .device-desktop .phui-list-item-href:hover .icons-merge",
"hash" : "19acb42aa5b1d67f704d686fd5bedfe5"
},
"icons-message" : {
@ -628,7 +628,7 @@
},
"icons-message-white" : {
"name" : "icons-message-white",
"rule" : ".icons-message-white, .device-desktop .phabricator-action-view:hover .icons-message",
"rule" : ".icons-message-white, .device-desktop .phabricator-action-view:hover .icons-message, .device-desktop .phui-list-item-href:hover .icons-message",
"hash" : "266f823f1b6b3c562153933a987dca74"
},
"icons-meta-mta" : {
@ -643,7 +643,7 @@
},
"icons-meta-mta-white" : {
"name" : "icons-meta-mta-white",
"rule" : ".icons-meta-mta-white, .device-desktop .phabricator-action-view:hover .icons-meta-mta",
"rule" : ".icons-meta-mta-white, .device-desktop .phabricator-action-view:hover .icons-meta-mta, .device-desktop .phui-list-item-href:hover .icons-meta-mta",
"hash" : "95214092adabf4bc7f7b28b088169e22"
},
"icons-move" : {
@ -658,7 +658,7 @@
},
"icons-move-white" : {
"name" : "icons-move-white",
"rule" : ".icons-move-white, .device-desktop .phabricator-action-view:hover .icons-move",
"rule" : ".icons-move-white, .device-desktop .phabricator-action-view:hover .icons-move, .device-desktop .phui-list-item-href:hover .icons-move",
"hash" : "e507b446f07772de65082d5aafd96bab"
},
"icons-new" : {
@ -673,7 +673,7 @@
},
"icons-new-white" : {
"name" : "icons-new-white",
"rule" : ".icons-new-white, .device-desktop .phabricator-action-view:hover .icons-new, .phabricator-application-launch-create:hover .phabricator-application-create-icon.icons-new-grey",
"rule" : ".icons-new-white, .device-desktop .phabricator-action-view:hover .icons-new, .device-desktop .phui-list-item-href:hover .icons-new, .phabricator-application-launch-create:hover .phabricator-application-create-icon.icons-new-grey",
"hash" : "faeafa22b4bbb23ee77b13105b035236"
},
"icons-none" : {
@ -688,7 +688,7 @@
},
"icons-none-white" : {
"name" : "icons-none-white",
"rule" : ".icons-none-white, .device-desktop .phabricator-action-view:hover .icons-none",
"rule" : ".icons-none-white, .device-desktop .phabricator-action-view:hover .icons-none, .device-desktop .phui-list-item-href:hover .icons-none",
"hash" : "d3a9680ac5eb860e3ccd131f43bc1fc2"
},
"icons-perflab" : {
@ -703,7 +703,7 @@
},
"icons-perflab-white" : {
"name" : "icons-perflab-white",
"rule" : ".icons-perflab-white, .device-desktop .phabricator-action-view:hover .icons-perflab",
"rule" : ".icons-perflab-white, .device-desktop .phabricator-action-view:hover .icons-perflab, .device-desktop .phui-list-item-href:hover .icons-perflab",
"hash" : "39b6b7d9f25fb3c7c6bf34b7dc4de9fb"
},
"icons-preview" : {
@ -718,7 +718,7 @@
},
"icons-preview-white" : {
"name" : "icons-preview-white",
"rule" : ".icons-preview-white, .device-desktop .phabricator-action-view:hover .icons-preview",
"rule" : ".icons-preview-white, .device-desktop .phabricator-action-view:hover .icons-preview, .device-desktop .phui-list-item-href:hover .icons-preview",
"hash" : "683af44bb69378f1822d3d5c9de54dd0"
},
"icons-refresh" : {
@ -733,7 +733,7 @@
},
"icons-refresh-white" : {
"name" : "icons-refresh-white",
"rule" : ".icons-refresh-white, .device-desktop .phabricator-action-view:hover .icons-refresh",
"rule" : ".icons-refresh-white, .device-desktop .phabricator-action-view:hover .icons-refresh, .device-desktop .phui-list-item-href:hover .icons-refresh",
"hash" : "781055b580c71ddb228d8fdac6a8fd8e"
},
"icons-remove" : {
@ -748,7 +748,7 @@
},
"icons-remove-white" : {
"name" : "icons-remove-white",
"rule" : ".icons-remove-white, .device-desktop .phabricator-action-view:hover .icons-remove",
"rule" : ".icons-remove-white, .device-desktop .phabricator-action-view:hover .icons-remove, .device-desktop .phui-list-item-href:hover .icons-remove",
"hash" : "6c30d2f5cbc53b10c6e0a4458534954d"
},
"icons-search" : {
@ -763,7 +763,7 @@
},
"icons-search-white" : {
"name" : "icons-search-white",
"rule" : ".icons-search-white, .device-desktop .phabricator-action-view:hover .icons-search",
"rule" : ".icons-search-white, .device-desktop .phabricator-action-view:hover .icons-search, .device-desktop .phui-list-item-href:hover .icons-search",
"hash" : "f213c5cad68198ee5ed51fcae375e456"
},
"icons-start-sandcastle" : {
@ -778,7 +778,7 @@
},
"icons-start-sandcastle-white" : {
"name" : "icons-start-sandcastle-white",
"rule" : ".icons-start-sandcastle-white, .device-desktop .phabricator-action-view:hover .icons-start-sandcastle",
"rule" : ".icons-start-sandcastle-white, .device-desktop .phabricator-action-view:hover .icons-start-sandcastle, .device-desktop .phui-list-item-href:hover .icons-start-sandcastle",
"hash" : "8a95549367b6b8e63d32f42c13567a47"
},
"icons-subscribe-add" : {
@ -793,7 +793,7 @@
},
"icons-subscribe-add-white" : {
"name" : "icons-subscribe-add-white",
"rule" : ".icons-subscribe-add-white, .device-desktop .phabricator-action-view:hover .icons-subscribe-add",
"rule" : ".icons-subscribe-add-white, .device-desktop .phabricator-action-view:hover .icons-subscribe-add, .device-desktop .phui-list-item-href:hover .icons-subscribe-add",
"hash" : "33c689841830dc67cdf9df9d83ae7889"
},
"icons-subscribe-auto" : {
@ -808,7 +808,7 @@
},
"icons-subscribe-auto-white" : {
"name" : "icons-subscribe-auto-white",
"rule" : ".icons-subscribe-auto-white, .device-desktop .phabricator-action-view:hover .icons-subscribe-auto",
"rule" : ".icons-subscribe-auto-white, .device-desktop .phabricator-action-view:hover .icons-subscribe-auto, .device-desktop .phui-list-item-href:hover .icons-subscribe-auto",
"hash" : "7fc22d1762159d886887f225a6f2d690"
},
"icons-subscribe-delete" : {
@ -823,7 +823,7 @@
},
"icons-subscribe-delete-white" : {
"name" : "icons-subscribe-delete-white",
"rule" : ".icons-subscribe-delete-white, .device-desktop .phabricator-action-view:hover .icons-subscribe-delete",
"rule" : ".icons-subscribe-delete-white, .device-desktop .phabricator-action-view:hover .icons-subscribe-delete, .device-desktop .phui-list-item-href:hover .icons-subscribe-delete",
"hash" : "0ff61bf03d829b0648869d46fdb76d45"
},
"icons-tag" : {
@ -838,7 +838,7 @@
},
"icons-tag-white" : {
"name" : "icons-tag-white",
"rule" : ".icons-tag-white, .device-desktop .phabricator-action-view:hover .icons-tag",
"rule" : ".icons-tag-white, .device-desktop .phabricator-action-view:hover .icons-tag, .device-desktop .phui-list-item-href:hover .icons-tag",
"hash" : "fdc903ecdd6b2a16a44fabfa4551f2d3"
},
"icons-transcript" : {
@ -853,7 +853,7 @@
},
"icons-transcript-white" : {
"name" : "icons-transcript-white",
"rule" : ".icons-transcript-white, .device-desktop .phabricator-action-view:hover .icons-transcript",
"rule" : ".icons-transcript-white, .device-desktop .phabricator-action-view:hover .icons-transcript, .device-desktop .phui-list-item-href:hover .icons-transcript",
"hash" : "518e24e54a4095fc0a2a6c0752662d65"
},
"icons-undo" : {
@ -868,7 +868,7 @@
},
"icons-undo-white" : {
"name" : "icons-undo-white",
"rule" : ".icons-undo-white, .device-desktop .phabricator-action-view:hover .icons-undo",
"rule" : ".icons-undo-white, .device-desktop .phabricator-action-view:hover .icons-undo, .device-desktop .phui-list-item-href:hover .icons-undo",
"hash" : "a2766e33d10f8cbe55e94c3d0d313e4a"
},
"icons-unlock" : {
@ -883,7 +883,7 @@
},
"icons-unlock-white" : {
"name" : "icons-unlock-white",
"rule" : ".icons-unlock-white, .device-desktop .phabricator-action-view:hover .icons-unlock",
"rule" : ".icons-unlock-white, .device-desktop .phabricator-action-view:hover .icons-unlock, .device-desktop .phui-list-item-href:hover .icons-unlock",
"hash" : "3455ecf827b08af2c56e0ae5aeb543ab"
},
"icons-unmerge" : {
@ -898,7 +898,7 @@
},
"icons-unmerge-white" : {
"name" : "icons-unmerge-white",
"rule" : ".icons-unmerge-white, .device-desktop .phabricator-action-view:hover .icons-unmerge",
"rule" : ".icons-unmerge-white, .device-desktop .phabricator-action-view:hover .icons-unmerge, .device-desktop .phui-list-item-href:hover .icons-unmerge",
"hash" : "a464ce2e952821cb8267d00158411237"
},
"icons-unpublish" : {
@ -913,7 +913,7 @@
},
"icons-unpublish-white" : {
"name" : "icons-unpublish-white",
"rule" : ".icons-unpublish-white, .device-desktop .phabricator-action-view:hover .icons-unpublish",
"rule" : ".icons-unpublish-white, .device-desktop .phabricator-action-view:hover .icons-unpublish, .device-desktop .phui-list-item-href:hover .icons-unpublish",
"hash" : "15f90c044431a8a6a6c1b3122c5959ff"
},
"icons-upload" : {
@ -928,7 +928,7 @@
},
"icons-upload-white" : {
"name" : "icons-upload-white",
"rule" : ".icons-upload-white, .device-desktop .phabricator-action-view:hover .icons-upload",
"rule" : ".icons-upload-white, .device-desktop .phabricator-action-view:hover .icons-upload, .device-desktop .phui-list-item-href:hover .icons-upload",
"hash" : "eb28e0b27012785e4e538e3fd85106ff"
},
"icons-warning" : {
@ -943,7 +943,7 @@
},
"icons-warning-white" : {
"name" : "icons-warning-white",
"rule" : ".icons-warning-white, .device-desktop .phabricator-action-view:hover .icons-warning",
"rule" : ".icons-warning-white, .device-desktop .phabricator-action-view:hover .icons-warning, .device-desktop .phui-list-item-href:hover .icons-warning",
"hash" : "6f671317e7c4d180ff903827c841a475"
},
"icons-world" : {
@ -958,7 +958,7 @@
},
"icons-world-white" : {
"name" : "icons-world-white",
"rule" : ".icons-world-white, .device-desktop .phabricator-action-view:hover .icons-world",
"rule" : ".icons-world-white, .device-desktop .phabricator-action-view:hover .icons-world, .device-desktop .phui-list-item-href:hover .icons-world",
"hash" : "ea1cad23e9908ab4ed9a392ab7b7abb8"
},
"remarkup-assist-text_b" : {

View file

@ -3669,7 +3669,7 @@ celerity_register_resource_map(array(
),
'phui-document-view-css' =>
array(
'uri' => '/res/1b54e1c1/rsrc/css/phui/phui-document.css',
'uri' => '/res/994a3474/rsrc/css/phui/phui-document.css',
'type' => 'css',
'requires' =>
array(
@ -3705,7 +3705,7 @@ celerity_register_resource_map(array(
),
'phui-list-view-css' =>
array(
'uri' => '/res/c27c269d/rsrc/css/phui/phui-list.css',
'uri' => '/res/0dc7b882/rsrc/css/phui/phui-list.css',
'type' => 'css',
'requires' =>
array(
@ -3948,7 +3948,7 @@ celerity_register_resource_map(array(
),
'sprite-icons-css' =>
array(
'uri' => '/res/cc45e87c/rsrc/css/sprite-icons.css',
'uri' => '/res/2d44ffb0/rsrc/css/sprite-icons.css',
'type' => 'css',
'requires' =>
array(
@ -4012,7 +4012,7 @@ celerity_register_resource_map(array(
), array(
'packages' =>
array(
'2626aa1d' =>
'21f9f13d' =>
array(
'name' => 'core.pkg.css',
'symbols' =>
@ -4060,7 +4060,7 @@ celerity_register_resource_map(array(
40 => 'phabricator-property-list-view-css',
41 => 'phabricator-tag-view-css',
),
'uri' => '/res/pkg/2626aa1d/core.pkg.css',
'uri' => '/res/pkg/21f9f13d/core.pkg.css',
'type' => 'css',
),
'98f60e3f' =>
@ -4254,16 +4254,16 @@ celerity_register_resource_map(array(
'reverse' =>
array(
'aphront-attached-file-view-css' => '03ab92cf',
'aphront-dialog-view-css' => '2626aa1d',
'aphront-error-view-css' => '2626aa1d',
'aphront-form-view-css' => '2626aa1d',
'aphront-list-filter-view-css' => '2626aa1d',
'aphront-pager-view-css' => '2626aa1d',
'aphront-panel-view-css' => '2626aa1d',
'aphront-table-view-css' => '2626aa1d',
'aphront-tokenizer-control-css' => '2626aa1d',
'aphront-tooltip-css' => '2626aa1d',
'aphront-typeahead-control-css' => '2626aa1d',
'aphront-dialog-view-css' => '21f9f13d',
'aphront-error-view-css' => '21f9f13d',
'aphront-form-view-css' => '21f9f13d',
'aphront-list-filter-view-css' => '21f9f13d',
'aphront-pager-view-css' => '21f9f13d',
'aphront-panel-view-css' => '21f9f13d',
'aphront-table-view-css' => '21f9f13d',
'aphront-tokenizer-control-css' => '21f9f13d',
'aphront-tooltip-css' => '21f9f13d',
'aphront-typeahead-control-css' => '21f9f13d',
'differential-changeset-view-css' => 'dd27a69b',
'differential-core-view-css' => 'dd27a69b',
'differential-inline-comment-editor' => '9488bb69',
@ -4277,7 +4277,7 @@ celerity_register_resource_map(array(
'differential-table-of-contents-css' => 'dd27a69b',
'diffusion-commit-view-css' => 'c8ce2d88',
'diffusion-icons-css' => 'c8ce2d88',
'global-drag-and-drop-css' => '2626aa1d',
'global-drag-and-drop-css' => '21f9f13d',
'inline-comment-summary-css' => 'dd27a69b',
'javelin-aphlict' => '98f60e3f',
'javelin-behavior' => 'a9f14d76',
@ -4351,55 +4351,55 @@ celerity_register_resource_map(array(
'javelin-util' => 'a9f14d76',
'javelin-vector' => 'a9f14d76',
'javelin-workflow' => 'a9f14d76',
'lightbox-attachment-css' => '2626aa1d',
'lightbox-attachment-css' => '21f9f13d',
'maniphest-task-summary-css' => '03ab92cf',
'maniphest-transaction-detail-css' => '03ab92cf',
'phabricator-action-list-view-css' => '2626aa1d',
'phabricator-application-launch-view-css' => '2626aa1d',
'phabricator-action-list-view-css' => '21f9f13d',
'phabricator-application-launch-view-css' => '21f9f13d',
'phabricator-busy' => '98f60e3f',
'phabricator-content-source-view-css' => 'dd27a69b',
'phabricator-core-buttons-css' => '2626aa1d',
'phabricator-core-css' => '2626aa1d',
'phabricator-crumbs-view-css' => '2626aa1d',
'phabricator-core-buttons-css' => '21f9f13d',
'phabricator-core-css' => '21f9f13d',
'phabricator-crumbs-view-css' => '21f9f13d',
'phabricator-drag-and-drop-file-upload' => '9488bb69',
'phabricator-dropdown-menu' => '98f60e3f',
'phabricator-file-upload' => '98f60e3f',
'phabricator-filetree-view-css' => '2626aa1d',
'phabricator-flag-css' => '2626aa1d',
'phabricator-form-view-css' => '2626aa1d',
'phabricator-header-view-css' => '2626aa1d',
'phabricator-filetree-view-css' => '21f9f13d',
'phabricator-flag-css' => '21f9f13d',
'phabricator-form-view-css' => '21f9f13d',
'phabricator-header-view-css' => '21f9f13d',
'phabricator-hovercard' => '98f60e3f',
'phabricator-jump-nav' => '2626aa1d',
'phabricator-jump-nav' => '21f9f13d',
'phabricator-keyboard-shortcut' => '98f60e3f',
'phabricator-keyboard-shortcut-manager' => '98f60e3f',
'phabricator-main-menu-view' => '2626aa1d',
'phabricator-main-menu-view' => '21f9f13d',
'phabricator-menu-item' => '98f60e3f',
'phabricator-nav-view-css' => '2626aa1d',
'phabricator-nav-view-css' => '21f9f13d',
'phabricator-notification' => '98f60e3f',
'phabricator-notification-css' => '2626aa1d',
'phabricator-notification-menu-css' => '2626aa1d',
'phabricator-object-item-list-view-css' => '2626aa1d',
'phabricator-notification-css' => '21f9f13d',
'phabricator-notification-menu-css' => '21f9f13d',
'phabricator-object-item-list-view-css' => '21f9f13d',
'phabricator-object-selector-css' => 'dd27a69b',
'phabricator-phtize' => '98f60e3f',
'phabricator-prefab' => '98f60e3f',
'phabricator-project-tag-css' => '03ab92cf',
'phabricator-property-list-view-css' => '2626aa1d',
'phabricator-remarkup-css' => '2626aa1d',
'phabricator-property-list-view-css' => '21f9f13d',
'phabricator-remarkup-css' => '21f9f13d',
'phabricator-shaped-request' => '9488bb69',
'phabricator-side-menu-view-css' => '2626aa1d',
'phabricator-standard-page-view' => '2626aa1d',
'phabricator-tag-view-css' => '2626aa1d',
'phabricator-side-menu-view-css' => '21f9f13d',
'phabricator-standard-page-view' => '21f9f13d',
'phabricator-tag-view-css' => '21f9f13d',
'phabricator-textareautils' => '98f60e3f',
'phabricator-tooltip' => '98f60e3f',
'phabricator-transaction-view-css' => '2626aa1d',
'phabricator-zindex-css' => '2626aa1d',
'phui-form-css' => '2626aa1d',
'phui-icon-view-css' => '2626aa1d',
'spacing-css' => '2626aa1d',
'sprite-apps-large-css' => '2626aa1d',
'sprite-gradient-css' => '2626aa1d',
'sprite-icons-css' => '2626aa1d',
'sprite-menu-css' => '2626aa1d',
'syntax-highlighting-css' => '2626aa1d',
'phabricator-transaction-view-css' => '21f9f13d',
'phabricator-zindex-css' => '21f9f13d',
'phui-form-css' => '21f9f13d',
'phui-icon-view-css' => '21f9f13d',
'spacing-css' => '21f9f13d',
'sprite-apps-large-css' => '21f9f13d',
'sprite-gradient-css' => '21f9f13d',
'sprite-icons-css' => '21f9f13d',
'sprite-menu-css' => '21f9f13d',
'syntax-highlighting-css' => '21f9f13d',
),
));

View file

@ -696,6 +696,7 @@ phutil_register_library_map(array(
'PHUIFormPageView' => 'view/form/PHUIFormPageView.php',
'PHUIIconExample' => 'applications/uiexample/examples/PHUIIconExample.php',
'PHUIIconView' => 'view/phui/PHUIIconView.php',
'PHUIListExample' => 'applications/uiexample/examples/PHUIListExample.php',
'PHUIListItemView' => 'view/phui/PHUIListItemView.php',
'PHUIListView' => 'view/phui/PHUIListView.php',
'PHUIListViewTestCase' => 'view/layout/__tests__/PHUIListViewTestCase.php',
@ -2516,6 +2517,7 @@ phutil_register_library_map(array(
'PHUIFormPageView' => 'AphrontView',
'PHUIIconExample' => 'PhabricatorUIExample',
'PHUIIconView' => 'AphrontTagView',
'PHUIListExample' => 'PhabricatorUIExample',
'PHUIListItemView' => 'AphrontTagView',
'PHUIListView' => 'AphrontTagView',
'PHUIListViewTestCase' => 'PhabricatorTestCase',

View file

@ -83,6 +83,7 @@ final class PHUIDocumentExample extends PhabricatorUIExample {
->setType(PHUIListItemView::TYPE_LINK);
$sidenav = id(new PHUIListView())
->setType(PHUIListView::SIDENAV_LIST)
->addMenuItem($action)
->addMenuItem($action1)
->addMenuItem($action2)
@ -128,6 +129,7 @@ final class PHUIDocumentExample extends PhabricatorUIExample {
->setType(PHUIListItemView::TYPE_LINK);
$topnav = id(new PHUIListView())
->setType(PHUIListView::NAVBAR_LIST)
->addMenuItem($home)
->addMenuItem($item1)
->addMenuItem($item2)

View file

@ -0,0 +1,234 @@
<?php
final class PHUIListExample extends PhabricatorUIExample {
public function getName() {
return 'Lists';
}
public function getDescription() {
return 'Create a fanciful list of objects and prismatic donuts.';
}
public function renderExample() {
/* Action Menu */
$action1 = id(new PHUIListItemView())
->setName('Edit Document')
->setHref('#')
->setIcon('edit')
->setType(PHUIListItemView::TYPE_LINK);
$action2 = id(new PHUIListItemView())
->setName('Move Document')
->setHref('#')
->setIcon('move')
->setType(PHUIListItemView::TYPE_LINK);
$action3 = id(new PHUIListItemView())
->setName('Delete Document')
->setHref('#')
->setIcon('delete')
->setType(PHUIListItemView::TYPE_LINK);
$action4 = id(new PHUIListItemView())
->setName('View History')
->setHref('#')
->setIcon('history')
->setType(PHUIListItemView::TYPE_LINK);
$action5 = id(new PHUIListItemView())
->setName('Subscribe')
->setHref('#')
->setIcon('subscribe-add')
->setType(PHUIListItemView::TYPE_LINK);
$actionmenu = id(new PHUIListView())
->setType(PHUIListView::SIDENAV_LIST)
->addMenuItem($action1)
->addMenuItem($action2)
->addMenuItem($action3)
->addMenuItem($action4)
->addMenuItem($action5);
/* Side Navigation */
$label1 = id(new PHUIListItemView())
->setName('Getting Started')
->setType(PHUIListItemView::TYPE_LABEL);
$label2 = id(new PHUIListItemView())
->setName('Documentation')
->setType(PHUIListItemView::TYPE_LABEL);
$item1 = id(new PHUIListItemView())
->setName('Installation')
->setHref('#')
->setType(PHUIListItemView::TYPE_LINK);
$item2 = id(new PHUIListItemView())
->setName('Webserver Config')
->setHref('#')
->setType(PHUIListItemView::TYPE_LINK);
$item3 = id(new PHUIListItemView())
->setName('Adding Users')
->setHref('#')
->setType(PHUIListItemView::TYPE_LINK);
$item4 = id(new PHUIListItemView())
->setName('Debugging')
->setHref('#')
->setType(PHUIListItemView::TYPE_LINK);
$divider = id(new PHUIListItemView)
->setType(PHUIListItemView::TYPE_DIVIDER);
$sidenav = id(new PHUIListView())
->setType(PHUIListView::SIDENAV_LIST)
->addMenuItem($label1)
->addMenuItem($item3)
->addMenuItem($item2)
->addMenuItem($item1)
->addMenuItem($item4)
->addMenuItem($divider)
->addMenuItem($label2)
->addMenuItem($item3)
->addMenuItem($item2)
->addMenuItem($item1)
->addMenuItem($item4);
/* Unstyled */
$item1 = id(new PHUIListItemView())
->setName('Rain');
$item2 = id(new PHUIListItemView())
->setName('Spain');
$item3 = id(new PHUIListItemView())
->setName('Mainly');
$item4 = id(new PHUIListItemView())
->setName('Plains');
$unstyled = id(new PHUIListView())
->addMenuItem($item1)
->addMenuItem($item2)
->addMenuItem($item3)
->addMenuItem($item4);
/* Top Navigation */
$home = id(new PHUIListItemView())
->setIcon('transcript')
->setHref('#')
->setType(PHUIListItemView::TYPE_ICON);
$item1 = id(new PHUIListItemView())
->setName('Installation')
->setHref('#')
->setSelected(true)
->setType(PHUIListItemView::TYPE_LINK);
$item2 = id(new PHUIListItemView())
->setName('Webserver Config')
->setHref('#')
->setType(PHUIListItemView::TYPE_LINK);
$item3 = id(new PHUIListItemView())
->setName('Adding Users')
->setHref('#')
->setType(PHUIListItemView::TYPE_LINK);
$item4 = id(new PHUIListItemView())
->setName('Debugging')
->setHref('#')
->setType(PHUIListItemView::TYPE_LINK);
$topnav = id(new PHUIListView())
->setType(PHUIListView::NAVBAR_LIST)
->addMenuItem($home)
->addMenuItem($item1)
->addMenuItem($item2)
->addMenuItem($item3)
->addMenuItem($item4);
$layout1 =
array(
id(new PHUIBoxView())
->appendChild($unstyled)
->addMargin(PHUI::MARGIN_MEDIUM)
->addPadding(PHUI::PADDING_SMALL)
->setShadow(true));
$layout2 =
array(
id(new PHUIBoxView())
->appendChild($sidenav)
->addMargin(PHUI::MARGIN_MEDIUM)
->setShadow(true));
$layout3 =
array(
id(new PHUIBoxView())
->appendChild($topnav)
->addMargin(PHUI::MARGIN_MEDIUM)
->setShadow(true));
$layout4 =
array(
id(new PHUIBoxView())
->appendChild($actionmenu)
->addMargin(PHUI::MARGIN_MEDIUM)
->setShadow(true));
$head1 = id(new PhabricatorHeaderView())
->setHeader(pht('Unstyled'));
$head2 = id(new PhabricatorHeaderView())
->setHeader(pht('Side Navigation'));
$head3 = id(new PhabricatorHeaderView())
->setHeader(pht('Top Navigation'));
$head4 = id(new PhabricatorHeaderView())
->setHeader(pht('Action Menu'));
$wrap1 = id(new PHUIBoxView())
->appendChild($layout1)
->addMargin(PHUI::MARGIN_LARGE);
$wrap2 = id(new PHUIBoxView())
->appendChild($layout2)
->addMargin(PHUI::MARGIN_LARGE);
$wrap3 = id(new PHUIBoxView())
->appendChild($layout3)
->addMargin(PHUI::MARGIN_LARGE);
$wrap4 = id(new PHUIBoxView())
->appendChild($layout4)
->addMargin(PHUI::MARGIN_LARGE);
return phutil_tag(
'div',
array(
'class' => 'phui-list-example',
),
array(
$head1,
$wrap1,
$head2,
$wrap2,
$head3,
$wrap3,
$head4,
$wrap4
));
}
}

View file

@ -40,6 +40,8 @@ final class CeleritySpriteGenerator {
if ($color == 'white') {
$tcss[] = '.device-desktop .phabricator-action-view:hover '.
'.icons-'.$icon;
$tcss[] = '.device-desktop .phui-list-item-href:hover '.
'.icons-'.$icon;
if ($icon == 'new') {
// Hover state for the "+" icons on homepage tiles.
$tcss[] = '.phabricator-application-launch-create:hover '.

View file

@ -2,7 +2,12 @@
final class PHUIListView extends AphrontTagView {
const NAVBAR_LIST = 'phui-list-navbar';
const SIDENAV_LIST = 'phui-list-sidenav';
const TABBAR_LIST = 'phui-list-tabbar';
private $items = array();
private $type;
protected function canAppendChild() {
return false;
@ -165,9 +170,20 @@ final class PHUIListView extends AphrontTagView {
return 'ul';
}
public function setType($type) {
$this->type = $type;
return $this;
}
protected function getTagAttributes() {
require_celerity_resource('phui-list-view-css');
$classes = array();
$classes[] = 'phui-list-view';
if ($this->type) {
$classes[] = $this->type;
}
return array(
'class' => 'phui-list-view',
'class' => implode(' ', $classes),
);
}

View file

@ -21,9 +21,8 @@
.phui-document-sidenav {
position:absolute;
width: 182px;
width: 200px;
text-overflow: ellipsis;
padding: 6px 8px 8px 8px;
top: 0;
right: 0;
}
@ -124,87 +123,3 @@
.device-desktop .phui-document-offset {
padding-right: 160px;
}
/* Sidenav */
.phui-document-sidenav .phui-list-item-view {
line-height: 20px;
}
.phui-document-sidenav .phui-list-item-type-link {
margin-left: 8px;
}
.phui-document-sidenav .phui-list-item-type-label .phui-list-item-name {
font-size: 12px;
font-weight: bold;
color: #9ca5b5;
text-transform: uppercase;
}
.phui-document-sidenav .phui-list-item-type-divider {
margin: 8px 0;
border-bottom: 1px solid #e7e7e7;
}
.phui-document-sidenav .phui-list-item-icon {
height: 14px;
width: 14px;
display: inline-block;
position: absolute;
top: 2px;
}
.phui-document-sidenav .phui-list-item-icon + .phui-list-item-name {
padding-left: 20px;
}
.phui-document-sidenav .phui-list-item-has-icon {
margin: 0;
position: relative;
}
.phui-document-sidenav .phui-list-item-has-icon .phui-list-item-href {
color: #000;
}
/* Topnav */
.phui-document-topnav .phui-list-view {
list-style: none;
overflow: hidden;
border-bottom: 1px solid #e7e7e7;
}
.phui-document-topnav .phui-list-view > li {
list-style: none;
float: left;
display: block;
border-right: 1px solid #e7e7e7;
}
.phui-document-topnav .phui-list-view > li > * {
display: block;
}
.phui-document-topnav .phui-list-item-href {
color: #9ca5b5;
padding: 8px 16px;
font-size: 12px;
}
.phui-document-topnav .phui-list-item-selected .phui-list-item-href {
background: #f6f7f8;
color: #555;
}
.phui-document-topnav .phui-list-item-href:hover {
background: #e8e9ec;
color: #555;
text-decoration: none;
}
.phui-document-topnav .phui-list-item-icon {
height: 14px;
width: 14px;
display: block;
}

View file

@ -14,3 +14,112 @@
font-size: 12px;
text-shadow: 0 1px 0 rgba(255,255,255,0.90);
}
/* - Sidenav and Actions -------------------------------------------------------
Sidebar and Action Menus
*/
.phui-list-sidenav {
padding: 4px 0;
}
.phui-list-sidenav .phui-list-item-type-label .phui-list-item-name {
font-size: 12px;
font-weight: bold;
color: #9ca5b5;
text-transform: uppercase;
padding: 4px 8px 4px 8px;
display: block;
}
.phui-list-sidenav .phui-list-item-type-divider {
margin: 8px 8px 12px 8px;
border-bottom: 1px solid #e7e7e7;
}
.phui-list-sidenav .phui-list-item-icon {
height: 14px;
width: 14px;
display: inline-block;
position: absolute;
top: 4px;
}
.phui-list-sidenav .phui-list-item-icon + .phui-list-item-name {
padding-left: 20px;
}
.phui-list-sidenav .phui-list-item-has-icon {
margin: 0;
position: relative;
}
.phui-list-sidenav .phui-list-item-href {
display: block;
padding: 2px 16px;
clear: both;
line-height: 20px;
color: #333333;
white-space: nowrap;
}
.phui-list-sidenav .phui-list-item-has-icon .phui-list-item-href {
padding: 2px 10px;
}
.phui-list-sidenav .phui-list-item-href:hover {
background: #005588;
background-image: linear-gradient(to bottom, #3b86c4, #2b628f);
background-image: -webkit-linear-gradient(top, #3b86c4, #2b628f);
color: white;
cursor: pointer;
text-decoration: none;
}
/* - Top, Full Width Navigations -----------------------------------------------
Sets a page or box with a top navbar
*/
.phui-list-view.phui-list-navbar {
list-style: none;
overflow: hidden;
border-bottom: 1px solid #e7e7e7;
}
.phui-list-view.phui-list-navbar > li {
list-style: none;
float: left;
display: block;
border-right: 1px solid #e7e7e7;
}
.phui-list-view.phui-list-navbar > li > * {
display: block;
}
.phui-list-navbar .phui-list-item-href {
color: #9ca5b5;
padding: 8px 16px;
font-size: 12px;
}
.phui-list-navbar .phui-list-item-selected .phui-list-item-href {
background: #f6f7f8;
color: #555;
}
.phui-list-navbar .phui-list-item-href:hover {
background: #e8e9ec;
color: #555;
text-decoration: none;
}
.phui-list-navbar .phui-list-item-icon {
height: 14px;
width: 14px;
display: block;
}

View file

@ -530,259 +530,259 @@ only screen and (-webkit-min-device-pixel-ratio: 1.5) {
background-position: -15px -135px;
}
.icons-action-menu-white, .device-desktop .phabricator-action-view:hover .icons-action-menu {
.icons-action-menu-white, .device-desktop .phabricator-action-view:hover .icons-action-menu, .device-desktop .phui-list-item-href:hover .icons-action-menu {
background-position: -30px -135px;
}
.icons-arrow_left-white, .device-desktop .phabricator-action-view:hover .icons-arrow_left {
.icons-arrow_left-white, .device-desktop .phabricator-action-view:hover .icons-arrow_left, .device-desktop .phui-list-item-href:hover .icons-arrow_left {
background-position: -45px -135px;
}
.icons-arrow_right-white, .device-desktop .phabricator-action-view:hover .icons-arrow_right {
.icons-arrow_right-white, .device-desktop .phabricator-action-view:hover .icons-arrow_right, .device-desktop .phui-list-item-href:hover .icons-arrow_right {
background-position: -60px -135px;
}
.icons-attach-white, .device-desktop .phabricator-action-view:hover .icons-attach {
.icons-attach-white, .device-desktop .phabricator-action-view:hover .icons-attach, .device-desktop .phui-list-item-href:hover .icons-attach {
background-position: -75px -135px;
}
.icons-blame-white, .device-desktop .phabricator-action-view:hover .icons-blame {
.icons-blame-white, .device-desktop .phabricator-action-view:hover .icons-blame, .device-desktop .phui-list-item-href:hover .icons-blame {
background-position: -90px -135px;
}
.icons-check-white, .device-desktop .phabricator-action-view:hover .icons-check {
.icons-check-white, .device-desktop .phabricator-action-view:hover .icons-check, .device-desktop .phui-list-item-href:hover .icons-check {
background-position: -105px -135px;
}
.icons-comment-white, .device-desktop .phabricator-action-view:hover .icons-comment {
.icons-comment-white, .device-desktop .phabricator-action-view:hover .icons-comment, .device-desktop .phui-list-item-href:hover .icons-comment {
background-position: -120px -135px;
}
.icons-computer-white, .device-desktop .phabricator-action-view:hover .icons-computer {
.icons-computer-white, .device-desktop .phabricator-action-view:hover .icons-computer, .device-desktop .phui-list-item-href:hover .icons-computer {
background-position: -135px -135px;
}
.icons-create-white, .device-desktop .phabricator-action-view:hover .icons-create {
.icons-create-white, .device-desktop .phabricator-action-view:hover .icons-create, .device-desktop .phui-list-item-href:hover .icons-create {
background-position: -150px -135px;
}
.icons-delete-white, .device-desktop .phabricator-action-view:hover .icons-delete {
.icons-delete-white, .device-desktop .phabricator-action-view:hover .icons-delete, .device-desktop .phui-list-item-href:hover .icons-delete {
background-position: -165px -135px;
}
.icons-disable-white, .device-desktop .phabricator-action-view:hover .icons-disable {
.icons-disable-white, .device-desktop .phabricator-action-view:hover .icons-disable, .device-desktop .phui-list-item-href:hover .icons-disable {
background-position: -180px -135px;
}
.icons-dislike-white, .device-desktop .phabricator-action-view:hover .icons-dislike {
.icons-dislike-white, .device-desktop .phabricator-action-view:hover .icons-dislike, .device-desktop .phui-list-item-href:hover .icons-dislike {
background-position: -195px -135px;
}
.icons-download-alt-white, .device-desktop .phabricator-action-view:hover .icons-download-alt {
.icons-download-alt-white, .device-desktop .phabricator-action-view:hover .icons-download-alt, .device-desktop .phui-list-item-href:hover .icons-download-alt {
background-position: 0px -150px;
}
.icons-download-white, .device-desktop .phabricator-action-view:hover .icons-download {
.icons-download-white, .device-desktop .phabricator-action-view:hover .icons-download, .device-desktop .phui-list-item-href:hover .icons-download {
background-position: -15px -150px;
}
.icons-edit-white, .device-desktop .phabricator-action-view:hover .icons-edit {
.icons-edit-white, .device-desktop .phabricator-action-view:hover .icons-edit, .device-desktop .phui-list-item-href:hover .icons-edit {
background-position: -30px -150px;
}
.icons-enable-white, .device-desktop .phabricator-action-view:hover .icons-enable {
.icons-enable-white, .device-desktop .phabricator-action-view:hover .icons-enable, .device-desktop .phui-list-item-href:hover .icons-enable {
background-position: -45px -150px;
}
.icons-file-white, .device-desktop .phabricator-action-view:hover .icons-file {
.icons-file-white, .device-desktop .phabricator-action-view:hover .icons-file, .device-desktop .phui-list-item-href:hover .icons-file {
background-position: -60px -150px;
}
.icons-flag-0-white, .device-desktop .phabricator-action-view:hover .icons-flag-0 {
.icons-flag-0-white, .device-desktop .phabricator-action-view:hover .icons-flag-0, .device-desktop .phui-list-item-href:hover .icons-flag-0 {
background-position: -75px -150px;
}
.icons-flag-1-white, .device-desktop .phabricator-action-view:hover .icons-flag-1 {
.icons-flag-1-white, .device-desktop .phabricator-action-view:hover .icons-flag-1, .device-desktop .phui-list-item-href:hover .icons-flag-1 {
background-position: -90px -150px;
}
.icons-flag-2-white, .device-desktop .phabricator-action-view:hover .icons-flag-2 {
.icons-flag-2-white, .device-desktop .phabricator-action-view:hover .icons-flag-2, .device-desktop .phui-list-item-href:hover .icons-flag-2 {
background-position: -105px -150px;
}
.icons-flag-3-white, .device-desktop .phabricator-action-view:hover .icons-flag-3 {
.icons-flag-3-white, .device-desktop .phabricator-action-view:hover .icons-flag-3, .device-desktop .phui-list-item-href:hover .icons-flag-3 {
background-position: -120px -150px;
}
.icons-flag-4-white, .device-desktop .phabricator-action-view:hover .icons-flag-4 {
.icons-flag-4-white, .device-desktop .phabricator-action-view:hover .icons-flag-4, .device-desktop .phui-list-item-href:hover .icons-flag-4 {
background-position: -135px -150px;
}
.icons-flag-5-white, .device-desktop .phabricator-action-view:hover .icons-flag-5 {
.icons-flag-5-white, .device-desktop .phabricator-action-view:hover .icons-flag-5, .device-desktop .phui-list-item-href:hover .icons-flag-5 {
background-position: -150px -150px;
}
.icons-flag-6-white, .device-desktop .phabricator-action-view:hover .icons-flag-6 {
.icons-flag-6-white, .device-desktop .phabricator-action-view:hover .icons-flag-6, .device-desktop .phui-list-item-href:hover .icons-flag-6 {
background-position: -165px -150px;
}
.icons-flag-7-white, .device-desktop .phabricator-action-view:hover .icons-flag-7 {
.icons-flag-7-white, .device-desktop .phabricator-action-view:hover .icons-flag-7, .device-desktop .phui-list-item-href:hover .icons-flag-7 {
background-position: -180px -150px;
}
.icons-flag-ghost-white, .device-desktop .phabricator-action-view:hover .icons-flag-ghost {
.icons-flag-ghost-white, .device-desktop .phabricator-action-view:hover .icons-flag-ghost, .device-desktop .phui-list-item-href:hover .icons-flag-ghost {
background-position: -195px -150px;
}
.icons-flag-white, .device-desktop .phabricator-action-view:hover .icons-flag {
.icons-flag-white, .device-desktop .phabricator-action-view:hover .icons-flag, .device-desktop .phui-list-item-href:hover .icons-flag {
background-position: 0px -165px;
}
.icons-folder-open-white, .device-desktop .phabricator-action-view:hover .icons-folder-open {
.icons-folder-open-white, .device-desktop .phabricator-action-view:hover .icons-folder-open, .device-desktop .phui-list-item-href:hover .icons-folder-open {
background-position: -15px -165px;
}
.icons-fork-white, .device-desktop .phabricator-action-view:hover .icons-fork {
.icons-fork-white, .device-desktop .phabricator-action-view:hover .icons-fork, .device-desktop .phui-list-item-href:hover .icons-fork {
background-position: -30px -165px;
}
.icons-herald-white, .device-desktop .phabricator-action-view:hover .icons-herald {
.icons-herald-white, .device-desktop .phabricator-action-view:hover .icons-herald, .device-desktop .phui-list-item-href:hover .icons-herald {
background-position: -45px -165px;
}
.icons-highlight-white, .device-desktop .phabricator-action-view:hover .icons-highlight {
.icons-highlight-white, .device-desktop .phabricator-action-view:hover .icons-highlight, .device-desktop .phui-list-item-href:hover .icons-highlight {
background-position: -60px -165px;
}
.icons-history-white, .device-desktop .phabricator-action-view:hover .icons-history {
.icons-history-white, .device-desktop .phabricator-action-view:hover .icons-history, .device-desktop .phui-list-item-href:hover .icons-history {
background-position: -75px -165px;
}
.icons-image-white, .device-desktop .phabricator-action-view:hover .icons-image {
.icons-image-white, .device-desktop .phabricator-action-view:hover .icons-image, .device-desktop .phui-list-item-href:hover .icons-image {
background-position: -90px -165px;
}
.icons-like-white, .device-desktop .phabricator-action-view:hover .icons-like {
.icons-like-white, .device-desktop .phabricator-action-view:hover .icons-like, .device-desktop .phui-list-item-href:hover .icons-like {
background-position: -105px -165px;
}
.icons-link-white, .device-desktop .phabricator-action-view:hover .icons-link {
.icons-link-white, .device-desktop .phabricator-action-view:hover .icons-link, .device-desktop .phui-list-item-href:hover .icons-link {
background-position: -120px -165px;
}
.icons-lint-info-white, .device-desktop .phabricator-action-view:hover .icons-lint-info {
.icons-lint-info-white, .device-desktop .phabricator-action-view:hover .icons-lint-info, .device-desktop .phui-list-item-href:hover .icons-lint-info {
background-position: -135px -165px;
}
.icons-lint-ok-white, .device-desktop .phabricator-action-view:hover .icons-lint-ok {
.icons-lint-ok-white, .device-desktop .phabricator-action-view:hover .icons-lint-ok, .device-desktop .phui-list-item-href:hover .icons-lint-ok {
background-position: -150px -165px;
}
.icons-lint-warning-white, .device-desktop .phabricator-action-view:hover .icons-lint-warning {
.icons-lint-warning-white, .device-desktop .phabricator-action-view:hover .icons-lint-warning, .device-desktop .phui-list-item-href:hover .icons-lint-warning {
background-position: -165px -165px;
}
.icons-lock-white, .device-desktop .phabricator-action-view:hover .icons-lock {
.icons-lock-white, .device-desktop .phabricator-action-view:hover .icons-lock, .device-desktop .phui-list-item-href:hover .icons-lock {
background-position: -180px -165px;
}
.icons-love-white, .device-desktop .phabricator-action-view:hover .icons-love {
.icons-love-white, .device-desktop .phabricator-action-view:hover .icons-love, .device-desktop .phui-list-item-href:hover .icons-love {
background-position: -195px -165px;
}
.icons-merge-white, .device-desktop .phabricator-action-view:hover .icons-merge {
.icons-merge-white, .device-desktop .phabricator-action-view:hover .icons-merge, .device-desktop .phui-list-item-href:hover .icons-merge {
background-position: 0px -180px;
}
.icons-message-white, .device-desktop .phabricator-action-view:hover .icons-message {
.icons-message-white, .device-desktop .phabricator-action-view:hover .icons-message, .device-desktop .phui-list-item-href:hover .icons-message {
background-position: -15px -180px;
}
.icons-meta-mta-white, .device-desktop .phabricator-action-view:hover .icons-meta-mta {
.icons-meta-mta-white, .device-desktop .phabricator-action-view:hover .icons-meta-mta, .device-desktop .phui-list-item-href:hover .icons-meta-mta {
background-position: -30px -180px;
}
.icons-move-white, .device-desktop .phabricator-action-view:hover .icons-move {
.icons-move-white, .device-desktop .phabricator-action-view:hover .icons-move, .device-desktop .phui-list-item-href:hover .icons-move {
background-position: -45px -180px;
}
.icons-new-white, .device-desktop .phabricator-action-view:hover .icons-new, .phabricator-application-launch-create:hover .phabricator-application-create-icon.icons-new-grey {
.icons-new-white, .device-desktop .phabricator-action-view:hover .icons-new, .device-desktop .phui-list-item-href:hover .icons-new, .phabricator-application-launch-create:hover .phabricator-application-create-icon.icons-new-grey {
background-position: -60px -180px;
}
.icons-none-white, .device-desktop .phabricator-action-view:hover .icons-none {
.icons-none-white, .device-desktop .phabricator-action-view:hover .icons-none, .device-desktop .phui-list-item-href:hover .icons-none {
background-position: -75px -180px;
}
.icons-perflab-white, .device-desktop .phabricator-action-view:hover .icons-perflab {
.icons-perflab-white, .device-desktop .phabricator-action-view:hover .icons-perflab, .device-desktop .phui-list-item-href:hover .icons-perflab {
background-position: -90px -180px;
}
.icons-preview-white, .device-desktop .phabricator-action-view:hover .icons-preview {
.icons-preview-white, .device-desktop .phabricator-action-view:hover .icons-preview, .device-desktop .phui-list-item-href:hover .icons-preview {
background-position: -105px -180px;
}
.icons-refresh-white, .device-desktop .phabricator-action-view:hover .icons-refresh {
.icons-refresh-white, .device-desktop .phabricator-action-view:hover .icons-refresh, .device-desktop .phui-list-item-href:hover .icons-refresh {
background-position: -120px -180px;
}
.icons-remove-white, .device-desktop .phabricator-action-view:hover .icons-remove {
.icons-remove-white, .device-desktop .phabricator-action-view:hover .icons-remove, .device-desktop .phui-list-item-href:hover .icons-remove {
background-position: -135px -180px;
}
.icons-search-white, .device-desktop .phabricator-action-view:hover .icons-search {
.icons-search-white, .device-desktop .phabricator-action-view:hover .icons-search, .device-desktop .phui-list-item-href:hover .icons-search {
background-position: -150px -180px;
}
.icons-start-sandcastle-white, .device-desktop .phabricator-action-view:hover .icons-start-sandcastle {
.icons-start-sandcastle-white, .device-desktop .phabricator-action-view:hover .icons-start-sandcastle, .device-desktop .phui-list-item-href:hover .icons-start-sandcastle {
background-position: -165px -180px;
}
.icons-subscribe-add-white, .device-desktop .phabricator-action-view:hover .icons-subscribe-add {
.icons-subscribe-add-white, .device-desktop .phabricator-action-view:hover .icons-subscribe-add, .device-desktop .phui-list-item-href:hover .icons-subscribe-add {
background-position: -180px -180px;
}
.icons-subscribe-auto-white, .device-desktop .phabricator-action-view:hover .icons-subscribe-auto {
.icons-subscribe-auto-white, .device-desktop .phabricator-action-view:hover .icons-subscribe-auto, .device-desktop .phui-list-item-href:hover .icons-subscribe-auto {
background-position: -195px -180px;
}
.icons-subscribe-delete-white, .device-desktop .phabricator-action-view:hover .icons-subscribe-delete {
.icons-subscribe-delete-white, .device-desktop .phabricator-action-view:hover .icons-subscribe-delete, .device-desktop .phui-list-item-href:hover .icons-subscribe-delete {
background-position: 0px -195px;
}
.icons-tag-white, .device-desktop .phabricator-action-view:hover .icons-tag {
.icons-tag-white, .device-desktop .phabricator-action-view:hover .icons-tag, .device-desktop .phui-list-item-href:hover .icons-tag {
background-position: -15px -195px;
}
.icons-transcript-white, .device-desktop .phabricator-action-view:hover .icons-transcript {
.icons-transcript-white, .device-desktop .phabricator-action-view:hover .icons-transcript, .device-desktop .phui-list-item-href:hover .icons-transcript {
background-position: -30px -195px;
}
.icons-undo-white, .device-desktop .phabricator-action-view:hover .icons-undo {
.icons-undo-white, .device-desktop .phabricator-action-view:hover .icons-undo, .device-desktop .phui-list-item-href:hover .icons-undo {
background-position: -45px -195px;
}
.icons-unlock-white, .device-desktop .phabricator-action-view:hover .icons-unlock {
.icons-unlock-white, .device-desktop .phabricator-action-view:hover .icons-unlock, .device-desktop .phui-list-item-href:hover .icons-unlock {
background-position: -60px -195px;
}
.icons-unmerge-white, .device-desktop .phabricator-action-view:hover .icons-unmerge {
.icons-unmerge-white, .device-desktop .phabricator-action-view:hover .icons-unmerge, .device-desktop .phui-list-item-href:hover .icons-unmerge {
background-position: -75px -195px;
}
.icons-unpublish-white, .device-desktop .phabricator-action-view:hover .icons-unpublish {
.icons-unpublish-white, .device-desktop .phabricator-action-view:hover .icons-unpublish, .device-desktop .phui-list-item-href:hover .icons-unpublish {
background-position: -90px -195px;
}
.icons-upload-white, .device-desktop .phabricator-action-view:hover .icons-upload {
.icons-upload-white, .device-desktop .phabricator-action-view:hover .icons-upload, .device-desktop .phui-list-item-href:hover .icons-upload {
background-position: -105px -195px;
}
.icons-warning-white, .device-desktop .phabricator-action-view:hover .icons-warning {
.icons-warning-white, .device-desktop .phabricator-action-view:hover .icons-warning, .device-desktop .phui-list-item-href:hover .icons-warning {
background-position: -120px -195px;
}
.icons-world-white, .device-desktop .phabricator-action-view:hover .icons-world {
.icons-world-white, .device-desktop .phabricator-action-view:hover .icons-world, .device-desktop .phui-list-item-href:hover .icons-world {
background-position: -135px -195px;
}