mirror of
https://we.phorge.it/source/phorge.git
synced 2024-11-18 12:52:42 +01:00
[Redesign] Clean up Slowvote
Summary: Ref T8099, A cleaner, more standard UI for Slowvotes. Because Slowvote is important. Test Plan: Test a number of poll layouts and embeds. Reviewers: btrahan, epriestley Reviewed By: epriestley Subscribers: epriestley, Korvin Maniphest Tasks: T8099 Differential Revision: https://secure.phabricator.com/D13445
This commit is contained in:
parent
a85010c9bf
commit
aa22a578d0
4 changed files with 43 additions and 57 deletions
|
@ -104,7 +104,7 @@ return array(
|
|||
'rsrc/css/application/releeph/releeph-request-differential-create-dialog.css' => '8d8b92cd',
|
||||
'rsrc/css/application/releeph/releeph-request-typeahead.css' => '667a48ae',
|
||||
'rsrc/css/application/search/search-results.css' => '7dea472c',
|
||||
'rsrc/css/application/slowvote/slowvote.css' => '266df6a1',
|
||||
'rsrc/css/application/slowvote/slowvote.css' => '7c27f0f9',
|
||||
'rsrc/css/application/tokens/tokens.css' => '3d0f239e',
|
||||
'rsrc/css/application/uiexample/example.css' => '528b19de',
|
||||
'rsrc/css/core/core.css' => 'a76cefc9',
|
||||
|
@ -736,7 +736,7 @@ return array(
|
|||
'phabricator-search-results-css' => '7dea472c',
|
||||
'phabricator-shaped-request' => '7cbe244b',
|
||||
'phabricator-side-menu-view-css' => '4f2cd343',
|
||||
'phabricator-slowvote-css' => '266df6a1',
|
||||
'phabricator-slowvote-css' => '7c27f0f9',
|
||||
'phabricator-source-code-view-css' => '098e9b75',
|
||||
'phabricator-standard-page-view' => '43045fb4',
|
||||
'phabricator-textareautils' => '5c93c52c',
|
||||
|
|
|
@ -67,12 +67,7 @@ final class PhabricatorSlowvotePollController
|
|||
array(
|
||||
$crumbs,
|
||||
$object_box,
|
||||
phutil_tag(
|
||||
'div',
|
||||
array(
|
||||
'class' => 'mlt mml mmr',
|
||||
),
|
||||
$poll_view),
|
||||
$poll_view,
|
||||
$timeline,
|
||||
$add_comment,
|
||||
),
|
||||
|
|
|
@ -71,21 +71,8 @@ final class SlowvoteEmbedView extends AphrontView {
|
|||
if ($this->headless) {
|
||||
$header = null;
|
||||
} else {
|
||||
$header = phutil_tag(
|
||||
'div',
|
||||
array(
|
||||
'class' => 'slowvote-header',
|
||||
),
|
||||
phutil_tag(
|
||||
'div',
|
||||
array(
|
||||
'class' => 'slowvote-header-content',
|
||||
),
|
||||
array(
|
||||
'V'.$poll->getID(),
|
||||
' ',
|
||||
$link_to_slowvote,
|
||||
)));
|
||||
$header = id(new PHUIHeaderView())
|
||||
->setHeader($link_to_slowvote);
|
||||
|
||||
$description = null;
|
||||
if ($poll->getDescription()) {
|
||||
|
@ -147,7 +134,7 @@ final class SlowvoteEmbedView extends AphrontView {
|
|||
'button',
|
||||
array(
|
||||
),
|
||||
pht('Engage in Deliberations')),
|
||||
pht('Enrage in Deliberations')),
|
||||
)));
|
||||
}
|
||||
|
||||
|
@ -168,7 +155,7 @@ final class SlowvoteEmbedView extends AphrontView {
|
|||
$submit,
|
||||
));
|
||||
|
||||
return javelin_tag(
|
||||
$embed = javelin_tag(
|
||||
'div',
|
||||
array(
|
||||
'class' => 'slowvote-embed',
|
||||
|
@ -177,7 +164,11 @@ final class SlowvoteEmbedView extends AphrontView {
|
|||
'pollID' => $poll->getID(),
|
||||
),
|
||||
),
|
||||
array($header, $body));
|
||||
array($body));
|
||||
|
||||
return id(new PHUIObjectBoxView())
|
||||
->setHeader($header)
|
||||
->appendChild($embed);
|
||||
}
|
||||
|
||||
private function renderLabel(PhabricatorSlowvoteOption $option, $selected) {
|
||||
|
@ -213,9 +204,9 @@ final class SlowvoteEmbedView extends AphrontView {
|
|||
),
|
||||
array(
|
||||
$this->renderControl($option, $selected),
|
||||
$status,
|
||||
)),
|
||||
)),
|
||||
$status,
|
||||
$voters,
|
||||
));
|
||||
}
|
||||
|
|
|
@ -3,14 +3,9 @@
|
|||
*/
|
||||
|
||||
.slowvote-embed {
|
||||
margin: 24px 12px;
|
||||
background: #ffffff;
|
||||
border-color: {$lightgreytext};
|
||||
border-style: solid;
|
||||
border-width: 1px;
|
||||
border-radius: 4px;
|
||||
box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.20),
|
||||
inset 0 0 2px rgba(0, 0, 0, 0.10);
|
||||
background: #fff;
|
||||
border-color: {$lightblueborder};
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.slowvote-header {
|
||||
|
@ -21,30 +16,31 @@
|
|||
|
||||
.slowvote-description {
|
||||
color: {$greytext};
|
||||
padding: 8px;
|
||||
border-bottom: 1px solid #bbbbbb;
|
||||
font-size: 14px;
|
||||
padding: 12px 4px 4px;
|
||||
}
|
||||
|
||||
.slowvote-header-content {
|
||||
padding: 8px;
|
||||
}
|
||||
|
||||
.slowvote-body {
|
||||
}
|
||||
|
||||
.slowvote-body-content {
|
||||
padding: 4px 16px;
|
||||
padding: 8px 4px 0;
|
||||
}
|
||||
|
||||
.slowvote-option-label {
|
||||
border: 1px solid {$greytext};
|
||||
border: 1px solid {$sh-lightgreyborder};
|
||||
display: block;
|
||||
position: relative;
|
||||
padding: 8px 4px;
|
||||
cursor: pointer;
|
||||
font-weight: bold;
|
||||
overflow: hidden;
|
||||
background-color: {$lightblue};
|
||||
background-color: {$lightgreybackground};
|
||||
}
|
||||
|
||||
.device-desktop .slowvote-option-label:hover {
|
||||
border-color: {$sh-blueborder};
|
||||
}
|
||||
|
||||
.slowvote-bar {
|
||||
|
@ -53,7 +49,7 @@
|
|||
left: 0;
|
||||
bottom: 0;
|
||||
overflow: hidden;
|
||||
background-color: {$blue};
|
||||
background-color: {$sh-bluebackground};
|
||||
}
|
||||
|
||||
.slowvote-control-offset {
|
||||
|
@ -62,17 +58,12 @@
|
|||
left: 32px;
|
||||
top: 8px;
|
||||
width: 100%;
|
||||
color: #000000;
|
||||
text-shadow: 0 1px 0 #ffffff;
|
||||
}
|
||||
|
||||
.slowvote-bar .slowvote-control-offset {
|
||||
color: #ffffff;
|
||||
text-shadow: 0 1px 0 #000000;
|
||||
color: {$darkbluetext};
|
||||
text-shadow: {$whitetextshadow};
|
||||
}
|
||||
|
||||
.slowvote-option-label-group {
|
||||
margin: 8px 0 16px;
|
||||
margin: 0 0 12px;
|
||||
}
|
||||
|
||||
.slowvote-option-label input[type="radio"],
|
||||
|
@ -86,27 +77,36 @@
|
|||
}
|
||||
|
||||
.slowvote-status {
|
||||
text-align: right;
|
||||
color: #333333;
|
||||
color: {$darkbluetext};
|
||||
font-weight: normal;
|
||||
padding: 2px 0;
|
||||
line-height: 15px;
|
||||
text-align: right;
|
||||
font-size: 11px;
|
||||
font-size: 12px;
|
||||
top: 0;
|
||||
right: 8px;
|
||||
position: absolute;
|
||||
text-shadow: {$whitetextshadow};
|
||||
}
|
||||
|
||||
.slowvote-voters {
|
||||
padding-top: 8px;
|
||||
}
|
||||
|
||||
.slowvote-voter {
|
||||
display: inline-block;
|
||||
width: 25px;
|
||||
height: 25px;
|
||||
background: #f3f3f3;
|
||||
background-size: 25px 25px;
|
||||
border-radius: 3px;
|
||||
margin: 0 4px;
|
||||
box-shadow: {$borderinset};
|
||||
}
|
||||
|
||||
.slowvote-footer {
|
||||
border-top-width: 1px;
|
||||
border-top-style: solid;
|
||||
border-top-color: #bbbbbb;
|
||||
border-top-color: {$thinblueborder};
|
||||
position: relative;
|
||||
}
|
||||
|
||||
|
|
Loading…
Reference in a new issue