1
0
Fork 0
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:
Chad Little 2015-06-25 12:17:33 -07:00
parent a85010c9bf
commit aa22a578d0
4 changed files with 43 additions and 57 deletions

View file

@ -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',

View file

@ -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,
),

View file

@ -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,
));
}

View file

@ -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;
}