EBernhardson has uploaded a new change for review.
https://gerrit.wikimedia.org/r/93002
Change subject: Design changes via meeting with may
......................................................................
Design changes via meeting with may
Change-Id: I222ace88b1621170edde30925a1fc8aa3ada42dd
---
M modules/base/styles/container.less
M modules/base/styles/various.less
M modules/discussion/styles/post.less
M modules/discussion/styles/topic.less
M modules/mediawiki.ui/styles/mixins/buttons.less
M templates/topic.html.php
M templates/topiclist.html.php
7 files changed, 84 insertions(+), 45 deletions(-)
git pull ssh://gerrit.wikimedia.org:29418/mediawiki/extensions/Flow
refs/changes/02/93002/1
diff --git a/modules/base/styles/container.less
b/modules/base/styles/container.less
index ec45ad4..c7de33d 100644
--- a/modules/base/styles/container.less
+++ b/modules/base/styles/container.less
@@ -53,5 +53,5 @@
font-size: 16px;
// based on width in Flow Prototype/Design/Iteration 5 "Talkpage_*"
- width: 660px;
+ width: 800px;
}
diff --git a/modules/base/styles/various.less b/modules/base/styles/various.less
index 773c6c4..ef2d95c 100644
--- a/modules/base/styles/various.less
+++ b/modules/base/styles/various.less
@@ -13,3 +13,7 @@
.flow-datestamp {
color: #aaa;
}
+
+.flow-container .mw-ui-button {
+ text-shadow: 0 0 0;
+}
diff --git a/modules/discussion/styles/post.less
b/modules/discussion/styles/post.less
index a8bfcdc..6a5f835 100644
--- a/modules/discussion/styles/post.less
+++ b/modules/discussion/styles/post.less
@@ -5,13 +5,13 @@
clear: both;
.flow-post {
- margin-top: 20px;
- margin-bottom: 20px;
+ margin: 10px 0;
padding-left: 16px;
}
.flow-post-title {
- padding-bottom: 22px;
+ padding-bottom: 8px;
+ padding-top: 10px;
.flow-creator {
font-weight: bold;
@@ -24,7 +24,7 @@
font-weight: normal;
color: @post-content-color;
- padding-bottom: 20px;
+ padding-bottom: 13px;
*:first-child {
margin-top: 0;
@@ -36,7 +36,7 @@
}
.flow-edit-post-link {
- margin-top: -60px !important; // default -40px + -20px to be
pushed up (because of .flow-post-content bottom padding)
+ margin-top: -73px !important; // default -40px + -20px to be
pushed up (because of .flow-post-content bottom padding)
background-position: center;
background-size: 20px auto;
@@ -49,7 +49,7 @@
}
.flow-icon-permalink {
- margin-top: -30px !important;
+ margin-top: -40px !important;
background-position: center;
background-size: 20px auto;
@@ -69,6 +69,7 @@
.flow-datestamp {
float: right;
padding-right: 22px;
+ font-size: 14px;
a.flow-action-history-link {
color: inherit;
@@ -114,7 +115,7 @@
@onclick-icon,
@onclick-fallback-icon
) {
- padding-left: 42px;
+ padding-left: 41px;
// !important to overwrite MW core's background image
.background-image-svg(@normal-icon, @normal-fallback-icon)
!important;
@@ -186,7 +187,7 @@
.flow-post-replies {
margin-left: 22px;
- border-left: 1px solid #999;
+ border-left: 2px dotted #CCC;
.flow-post-replies {
border-left: 0px solid transparent;
@@ -194,11 +195,18 @@
}
}
+ .flow-thank-link, .flow-reply-link {
+ height: 16px;
+ padding-bottom: 9px;
+ padding-top: 5px;
+ font-size: 14px;
+ margin-right: 8px;
+ }
.flow-thank-link {
- padding-left: 46px;
+ padding-left: 41px;
.background-image-svg('../../base/images/thank.svg',
'../../base/images/thank.png');
- background-position: 16px;
+ background-position: 12px 4px;
background-size: 20px auto;
background-repeat: no-repeat;
}
@@ -317,7 +325,9 @@
.flow-post-container {
// hacky way to flatten conversation;
// make anything over 2 indentation levels appear on same level
- margin-top: 0px;
+ margin-top: 20px;
+ font-size: 14px;
+
.flow-post-container {
padding-left: 0px;
}
diff --git a/modules/discussion/styles/topic.less
b/modules/discussion/styles/topic.less
index c9679a9..0d7cd2d 100644
--- a/modules/discussion/styles/topic.less
+++ b/modules/discussion/styles/topic.less
@@ -2,16 +2,19 @@
@import 'mediawiki.mixins.less';
.flow-topic-container {
- padding-bottom: 54px;
+ padding-bottom: 20px;
.flow-titlebar {
position: relative;
+
+ .flow-topic-children-container {
+ padding-top: 10px;
+ }
// override mw-ui-button style
text-align: left;
display: block;
- padding: 24px 22px;
- margin-bottom: 30px;
+ padding: 15px 22px;
font-weight: normal;
background: @topic-titlebar-background-color;
@@ -25,7 +28,7 @@
}
.flow-topic-title {
- padding-bottom: 30px;
+ padding-bottom: 15px;
// leave some room for .flow-topic-actions-link on the
right
margin-right: 44px;
@@ -75,7 +78,7 @@
li {
line-height: 16px;
- padding: 0 0 14px 0;
+ padding: 0 0 9px 0;
&:last-child {
padding: 0;
@@ -92,7 +95,8 @@
position: absolute;
right: 22px;
- bottom: 22px;
+ bottom: 16px;
+ font-size: 14px;
a.flow-action-history-link {
color: inherit;
@@ -101,14 +105,14 @@
.flow-icon {
// additional push to the right because of container's
padding & border
- margin-right: -23px; // container's right padding +
right border
+ margin-right: -20px; // container's right padding +
right border
&.flow-icon-top-aligned {
- margin-top: -12px; // half of container's top
padding
+ margin-top: -2px;
}
&.flow-icon-bottom-aligned {
- margin-top: -28px; // -40px - half of
container's bottom padding
+ margin-top: -31px;
}
}
@@ -162,12 +166,16 @@
}
}
-.flow-new-topic-container {
- .flow-newtopic-form {
+.flow-new-topic-container {;
+ .flow-newtopic-form {;
padding-bottom: 30px;
+ height: 42px;
.flow-newtopic-title {
font-weight: bold;
+
+ padding-left: 45px;
+ padding-top: 3px;
}
.flow-post-form-controls {
@@ -175,6 +183,10 @@
}
.flow-new-topic-link {
+ margin-left: -44px;
+ margin-top: 1px;
+ float: left;
+
background-position: center center;
background-size: 25px auto;
background-repeat: no-repeat;
@@ -190,6 +202,7 @@
.flow-topic-reply-container {
padding-left: 22px;
margin-top: 20px;
+ margin-bottom: 20px;
.flow-creator {
font-weight: bold;
@@ -198,10 +211,17 @@
}
.flow-topic-reply-form {
- margin-top: 22px;
+ margin-top: 8px;
+ height: 42px;
.flow-post-form-controls {
text-align: right;
+ }
+
+ textarea {
+ padding: 9px 0 9px 15px;
+ resize: none;
+ height: 42px;
}
}
@@ -213,8 +233,8 @@
// will shrink the textarea, and the "submit" button will be missed.
&:not(:active) {
.flow-topic-reply-content:empty:not(:focus) {
- height: 34px;
- padding-top: 6px;
+ // height: 34px;
+ //padding-top: 6px;
}
}
}
@@ -230,4 +250,4 @@
font-weight: bold;
}
-}
\ No newline at end of file
+}
diff --git a/modules/mediawiki.ui/styles/mixins/buttons.less
b/modules/mediawiki.ui/styles/mixins/buttons.less
index 3fc0546..2673648 100644
--- a/modules/mediawiki.ui/styles/mixins/buttons.less
+++ b/modules/mediawiki.ui/styles/mixins/buttons.less
@@ -26,9 +26,9 @@
color: @hover-primary-contrast-color !important;
background: @hover-primary-color;
- box-shadow: 0px 1px 0px 0px rgba(0,0,0,.20), inset 0px -3px 0px
0px rgba(0,0,0,.20);
- -webkit-box-shadow: 0px 1px 0px 0px rgba(0,0,0,.20), inset 0px
-3px 0px 0px rgba(0,0,0,.20);
- -moz-box-shadow: 0px 1px 0px 0px rgba(0,0,0,.20), inset 0px
-3px 0px 0px rgba(0,0,0,.20);
+ box-shadow: 0px 1px 0px 0px rgba(0,0,0,.05), inset 0px -2px 0px
0px rgba(0,0,0,.20);
+ -webkit-box-shadow: 0px 1px 0px 0px rgba(0,0,0,.05), inset 0px
-2px 0px 0px rgba(0,0,0,.20);
+ -moz-box-shadow: 0px 1px 0px 0px rgba(0,0,0,.05), inset 0px
-2px 0px 0px rgba(0,0,0,.20);
}
&:active,
diff --git a/templates/topic.html.php b/templates/topic.html.php
index 0adade3..9219f9b 100644
--- a/templates/topic.html.php
+++ b/templates/topic.html.php
@@ -65,18 +65,6 @@
?>
</p>
- <?php
- echo Html::element(
- 'a',
- array(
- 'class' => 'flow-icon-permalink
flow-icon flow-icon-top-aligned',
- 'title' => wfMessage(
'flow-topic-action-view' )->text(),
- 'href' => $this->generateUrl( $topic ),
- ),
- wfMessage( 'flow-topic-action-view' )->text()
- );
- ?>
-
<ul class="flow-topic-posts-meta">
<li class="flow-topic-participants">
<?php echo $this->printParticipants( $root,
$indexParticipants ); ?>
@@ -85,6 +73,7 @@
<a href="#" class="flow-reply-link"
data-topic-id="<?php echo $topic->getId()->getHex() ?>">
<?php
// get total number of posts in
topic
+ // @todo : the number of
comments should not be a part of the link
$comments =
$root->getRecursiveResult( $indexDescendantCount );
echo wfMessage(
'flow-topic-comments', $comments )->text();
?>
@@ -93,9 +82,23 @@
</ul>
<?php
- // @todo: afaik, there's no watchlist functionality
yet; this blurb is just to position it correctly already
+ echo Html::element(
+ 'a',
+ array(
+ 'class' => 'flow-icon-permalink
flow-icon flow-icon-bottom-aligned',
+ 'title' => wfMessage(
'flow-topic-action-view' )->text(),
+ 'href' => $this->generateUrl( $topic ),
+ ),
+ wfMessage( 'flow-topic-action-view' )->text()
+ );
+ ?>
+
+ <?php
$watchlistActive = false; // @todo: true if already
watchlisted, false if not
+ /* @todo: afaik, there's no watchlist functionality
yet; this blurb is just to
+ * position it correctly already
+ *
echo Html::element(
'a',
array(
@@ -107,6 +110,7 @@
),
wfMessage( 'flow-topic-action-watchlist'
)->text()
);
+ */
?>
</div>
</div>
@@ -149,6 +153,7 @@
Html::textarea( $block->getName() . '[topic-reply-content]', '', array(
'placeholder' => wfMessage( 'flow-reply-topic-placeholder',
$user->getName(), $title )->text(),
'class' => 'flow-input mw-ui-input flow-topic-reply-content',
+ 'title' => wfMessage( 'flow-reply-submit', $this->getUserText(
$root->getCreator( $user ), $root ) )->text(),
) ),
Html::openElement( 'div', array( 'class' => 'flow-post-form-controls' )
),
Html::element( 'input', array(
diff --git a/templates/topiclist.html.php b/templates/topiclist.html.php
index bd7e017..c630a54 100644
--- a/templates/topiclist.html.php
+++ b/templates/topiclist.html.php
@@ -20,7 +20,7 @@
// @Todo - Update href to a real link for no-js support
echo Html::element( 'a', array(
- 'class' => array( 'flow-new-topic-link', 'flow-icon',
'flow-icon-bottom-aligned' ),
+ 'class' => array( 'flow-new-topic-link', 'flow-icon-bottom-aligned' ),
'href' => '#'
), wfMessage( 'flow-newtopic-start-placeholder' )->text() );
@@ -59,4 +59,4 @@
if ( $page && $page->getPagingLink( 'fwd' ) ) {
$linkData = $page->getPagingLink( 'fwd' );
echo $this->getPagingLink( $block, 'fwd', $linkData['offset'],
$linkData['limit'] );
-}
\ No newline at end of file
+}
--
To view, visit https://gerrit.wikimedia.org/r/93002
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: newchange
Gerrit-Change-Id: I222ace88b1621170edde30925a1fc8aa3ada42dd
Gerrit-PatchSet: 1
Gerrit-Project: mediawiki/extensions/Flow
Gerrit-Branch: master
Gerrit-Owner: EBernhardson <[email protected]>
_______________________________________________
MediaWiki-commits mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
