2013-04-02 18:15:33 +02:00
|
|
|
/**
|
2016-02-03 17:26:30 +01:00
|
|
|
* @provides phui-hovercard-view-css
|
2013-04-02 18:15:33 +02:00
|
|
|
*/
|
|
|
|
|
Hovercard front-end code & stuff
Summary:
Refs T1048; Depends on D5557, D5558
They hover right above your eyes. Try it out at home :D (in that case, don't forget to checkout D5557 and D5558)
Worth a lot of improvement. But it's great for now after a little bit of styling.
Scrape load (search current document for all hovercards and pre-load them) and lazy load (e.g. previewing comments which is not covered by scrape load) implemented.
Added some seemingly useful graceful situations. Too much to the left, too much to the top.
Test Plan:
Tested on Ubuntu, Chrome and FF. No Windows yet, since I have it live at no place. Works pretty fine, at least it will appear.
Could test left graceful fallback. Don't know what happens if you place it too far to the top. I expect either good results or placement about the center of the screen in case of glitches.
For now, they'll disappear right away once the mouse leaves the object tag. Intended is when leaving both tag and hovercard.
Reviewers: epriestley, chad, btrahan
CC: aran, Korvin
Maniphest Tasks: T1048
Differential Revision: https://secure.phabricator.com/D5563
Conflicts:
src/__celerity_resource_map__.php
2013-04-05 17:31:35 +02:00
|
|
|
.jx-hovercard-container {
|
|
|
|
position: absolute;
|
|
|
|
}
|
|
|
|
|
2016-02-03 17:26:30 +01:00
|
|
|
.phui-hovercard-wrapper {
|
2013-04-02 18:15:33 +02:00
|
|
|
width: 400px;
|
|
|
|
}
|
|
|
|
|
2016-02-03 17:26:30 +01:00
|
|
|
.device-phone .phui-hovercard-wrapper {
|
2013-04-02 18:15:33 +02:00
|
|
|
width: 300px;
|
|
|
|
}
|
|
|
|
|
2016-02-03 17:26:30 +01:00
|
|
|
.phui-hovercard-container {
|
2014-03-11 01:10:31 +01:00
|
|
|
width: 100%;
|
2015-04-14 18:48:59 +02:00
|
|
|
box-shadow: {$dropshadow};
|
2016-02-05 05:11:36 +01:00
|
|
|
border: 1px solid {$lightblueborder};
|
2014-06-02 20:45:30 +02:00
|
|
|
border-radius: 3px;
|
2017-07-17 20:08:17 +02:00
|
|
|
background-color: {$page.content};
|
2013-04-02 18:15:33 +02:00
|
|
|
}
|
|
|
|
|
2016-02-03 17:26:30 +01:00
|
|
|
.phui-hovercard-head .phui-header-shell {
|
2015-06-26 00:58:00 +02:00
|
|
|
padding: 6px 8px 6px 12px;
|
|
|
|
background-color: {$bluebackground};
|
2015-06-20 14:12:52 +02:00
|
|
|
border-top-left-radius: 3px;
|
|
|
|
border-top-right-radius: 3px;
|
|
|
|
}
|
|
|
|
|
2016-02-03 17:26:30 +01:00
|
|
|
.phui-hovercard-head .phui-header-header {
|
2016-02-05 05:11:36 +01:00
|
|
|
font-size: {$biggerfontsize};
|
2014-06-03 23:36:31 +02:00
|
|
|
}
|
|
|
|
|
2016-02-03 17:26:30 +01:00
|
|
|
.phui-hovercard-head .phui-tag-type-state {
|
2015-05-18 19:00:15 +02:00
|
|
|
color: {$darkbluetext};
|
2014-06-03 23:36:31 +02:00
|
|
|
text-shadow: none;
|
2015-05-18 19:00:15 +02:00
|
|
|
font-weight: normal;
|
2014-06-03 23:36:31 +02:00
|
|
|
}
|
|
|
|
|
2016-02-03 17:26:30 +01:00
|
|
|
.phui-hovercard-tags {
|
2013-04-02 18:15:33 +02:00
|
|
|
float: right;
|
|
|
|
white-space: normal;
|
|
|
|
}
|
|
|
|
|
2016-02-03 17:26:30 +01:00
|
|
|
.phui-hovercard-body {
|
2015-06-20 14:12:52 +02:00
|
|
|
padding: 12px;
|
2013-09-07 18:13:55 +02:00
|
|
|
color: {$darkgreytext};
|
2014-06-02 20:45:30 +02:00
|
|
|
border-bottom-right-radius: 3px;
|
|
|
|
border-bottom-left-radius: 3px;
|
2014-06-09 20:46:57 +02:00
|
|
|
position: relative;
|
2014-03-11 01:10:31 +01:00
|
|
|
}
|
|
|
|
|
2016-02-03 17:26:30 +01:00
|
|
|
.phui-hovercard-body-item {
|
2015-07-17 02:17:21 +02:00
|
|
|
margin: 4px 0 0 0;
|
2018-11-15 13:15:43 +01:00
|
|
|
overflow: hidden;
|
|
|
|
text-overflow: ellipsis;
|
2014-06-03 23:36:31 +02:00
|
|
|
}
|
|
|
|
|
2016-02-03 17:26:30 +01:00
|
|
|
.phui-hovercard-body-header {
|
2014-06-02 20:45:30 +02:00
|
|
|
font-size: 14px;
|
|
|
|
padding-bottom: 4px;
|
2013-09-07 18:13:55 +02:00
|
|
|
color: {$darkgreytext};
|
2014-06-03 23:36:31 +02:00
|
|
|
line-height: 18px;
|
2013-04-02 18:15:33 +02:00
|
|
|
}
|
|
|
|
|
2016-02-03 17:26:30 +01:00
|
|
|
.phui-hovercard-body .phui-hovercard-body-image {
|
2014-03-11 01:10:31 +01:00
|
|
|
width: 58px;
|
|
|
|
}
|
|
|
|
|
2016-02-03 17:26:30 +01:00
|
|
|
.phui-hovercard-body .phui-hovercard-body-details {
|
2014-06-09 20:46:57 +02:00
|
|
|
margin-left: 58px;
|
2014-03-11 01:10:31 +01:00
|
|
|
}
|
|
|
|
|
2016-02-03 17:26:30 +01:00
|
|
|
.phui-hovercard-body .profile-header-picture-frame {
|
2013-04-02 18:15:33 +02:00
|
|
|
float: left;
|
|
|
|
width: 50px;
|
|
|
|
height: 50px;
|
2013-04-06 20:26:43 +02:00
|
|
|
background-position: center;
|
|
|
|
background-repeat: no-repeat;
|
2015-05-14 20:15:04 +02:00
|
|
|
background-size: 100%;
|
2013-04-02 18:15:33 +02:00
|
|
|
}
|
2015-07-17 02:17:21 +02:00
|
|
|
|
|
|
|
.hovercard-badges {
|
2017-02-21 23:18:17 +01:00
|
|
|
margin: 6px 0 0 0;
|
|
|
|
padding: 4px;
|
|
|
|
background: {$page.background};
|
|
|
|
border-bottom-left-radius: 3px;
|
|
|
|
border-bottom-right-radius: 3px;
|
2015-07-17 02:17:21 +02:00
|
|
|
}
|
|
|
|
|
|
|
|
.hovercard-badges .phui-badge-flex-item {
|
|
|
|
float: left;
|
|
|
|
}
|
|
|
|
|
2016-02-03 17:26:30 +01:00
|
|
|
.phui-hovercard-tail {
|
2014-03-11 01:10:31 +01:00
|
|
|
width: 396px;
|
|
|
|
float: left;
|
2014-06-03 23:36:31 +02:00
|
|
|
padding: 2px;
|
|
|
|
border-top: 1px solid {$thinblueborder};
|
|
|
|
border-bottom-left-radius: 3px;
|
|
|
|
border-bottom-right-radius: 3px;
|
2013-04-02 18:15:33 +02:00
|
|
|
}
|
|
|
|
|
2016-02-03 17:26:30 +01:00
|
|
|
.phui-hovercard-tail button,
|
|
|
|
.phui-hovercard-tail a.button {
|
2013-04-02 18:15:33 +02:00
|
|
|
margin: 3px;
|
|
|
|
}
|
2017-04-23 21:32:27 +02:00
|
|
|
|
|
|
|
.phui-hovercard-wrapper .hovercard-task-view {
|
|
|
|
box-shadow: 0px 4px 16px rgba(0,0,0,.2);
|
|
|
|
}
|
2017-04-25 17:40:20 +02:00
|
|
|
|
|
|
|
.hovercard-task-view .phui-oi-disabled.phui-workcard {
|
|
|
|
background-color: #fff;
|
|
|
|
}
|
Implements a more informative hovercard for wiki documents
Summary:
The current hovercard of a wiki document has no further information except the title. This commit adds object type, project tags, parent documents, last author and last edited time to the card.
Preview:
{F313614}
Preview in a pessimistic case:
{F325478}
Closes T15433
Test Plan: Edit a wiki document with/without project tags and parent documents and see the hovercard in the feed.
Reviewers: O1 Blessed Committers, valerio.bozzolan, avivey, Cigaryno
Reviewed By: O1 Blessed Committers, valerio.bozzolan, avivey, Cigaryno
Subscribers: avivey, speck, tobiaswiese, valerio.bozzolan, Matthew, Cigaryno
Maniphest Tasks: T15433
Differential Revision: https://we.phorge.it/D25303
2023-06-19 09:13:25 +02:00
|
|
|
|
|
|
|
.phui-hovercard-object-type {
|
|
|
|
font-size: 12px;
|
|
|
|
}
|
|
|
|
|
|
|
|
.phui-hovercard-object-type .phui-icon-view {
|
|
|
|
margin-right: 6px;
|
|
|
|
}
|
|
|
|
|
|
|
|
.phui-hovercard-object-type .phui-crumb-divider {
|
|
|
|
margin: 0px 6px;
|
|
|
|
}
|
|
|
|
|
|
|
|
.phui-hovercard-object-type .phabricator-handle-tag-list {
|
|
|
|
margin-top: 10px;
|
|
|
|
}
|
|
|
|
|
|
|
|
.phui-hovercard-object-type .phabricator-handle-tag-list-item {
|
|
|
|
display: inline-block;
|
|
|
|
margin: 0 4px 2px 0;
|
|
|
|
}
|