Discource-C
/
discourse
mirror of https://github.com/discourse/discourse.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

FEATURE: usernames are now on top.

This commit is contained in:
Sam 2014-04-30 12:13:16 +10:00
parent cd6ab981f3
commit 1d2cabc2a6
5 changed files with 94 additions and 149 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
app/assets/javascripts/discourse/lib/utilities.js
View File

@ -13,6 +13,7 @@ Discourse.Utilities = {
case 'small': return 25;
case 'medium': return 32;
case 'large': return 45;
case 'extra_large': return 60;
case 'huge': return 120;
}
return size;

4
app/assets/javascripts/discourse/templates/post.js.handlebars
View File

@ -17,11 +17,10 @@
{{/if}}
</a>
{{/if}}
<div class='topic-meta-data span2'>
{{#unless userDeleted}}
<div {{bind-attr class=":contents byTopicCreator:topic-creator :trigger-expansion"}}>
<a href='{{unbound usernameUrl}}' {{action showPosterExpansion this}}>{{avatar this imageSize="large"}}</a>
<a class="main-avatar" href='{{unbound usernameUrl}}' {{action showPosterExpansion this}}>{{avatar this imageSize="large"}}</a>
<div class="names">
<h3 {{bind-attr class="staff new_user :username"}}><a href='{{unbound usernameUrl}}' {{action showPosterExpansion this}}>{{{breakUp username name}}}</a></h3>
@ -36,6 +35,7 @@
<div class="user-title" {{action showPosterExpansion this}}>{{unbound user_title}}</div>
{{/if}}
{{/if}}
</div>
</div>
{{else}}

76
app/assets/stylesheets/customizations/username-on-top.scss
View File

@ -1,76 +0,0 @@
@import "common/foundation/variables";
.topic-post {
article > .row {
& > .topic-meta-data {
width: 79%;
.contents {
text-align: left;
padding-left: 3%;
position: relative;
}
.names {
z-index: 1;
position: absolute;
top: -2px;
left: 10%;
width: 100%;
}
h3, .user-title {
display: inline;
padding-left: 5px;
font-size: $base-font-size;
a {
color: #6f6f6f;
font-weight: bold;
}
}
}
& > .topic-body {
width: 70.5%;
margin-left: 7.5%;
margin-top: -85px;
border-top: none;
padding-left: 10px;
& > .contents {
&.avoid-tab { padding-top: 0; }
.topic-meta-data-inside, .avoid-tab .topic-meta-data-inside {
margin-top: -52px;
}
.cooked, .avoid-tab .cooked {
margin-top: 48px;
z-index: 2;
}
}
}
& > .reply-to-tab {
left: 9%;
padding: 2px 12px;
.avatar {
height: 15px;
width: 15px;
}
}
}
.embedded-posts {
&.top {
margin-left: 7.5%;
}
position: relative;
.contents h5 {
position: absolute;
top: 12px;
left: 93px;
width: 500px;
text-align: left;
z-index: 1;
font-size: $base-font-size;
}
.topic-body {
margin-top: 15px;
.topic-meta-data-inside {
margin-top: -15px;
}
}
}
}

156
app/assets/stylesheets/desktop/topic-post.scss
View File

@ -51,27 +51,28 @@ h1 .topic-statuses .topic-status i {
.reply-to-tab {
display: block;
position: absolute;
left: 120px;
right: 300px;
z-index: 400;
padding: 5px 12px;
border: 1px solid $primary_border_color;
font-size: 12px;
margin-left: -8px;
background: $primary_background_color;
color: $secondary_text_color;
@include medium-width {
left: 107px;
right: 260px;
}
@include small-width {
left: 103px;
right: 200px;
}
}
.avoid-tab {
padding-top: 25px;
.topic-meta-data-inside {margin-top: -30px;}
.topic-meta-data-inside {
float: right;
margin-top: -36px;
float: right;
font-size: 12px;
}
.gutter {
@ -212,23 +213,68 @@ nav.post-controls {
}
}
}
}
}
.embedded-posts {
background: lighten($secondary_background_color, 76%);
.quote .title, blockquote, .onebox, .onebox-result {
background: lighten($secondary_background_color, 70%);
border-left: 5px solid lighten($secondary_background_color, 60%);
.embedded-posts {
h1, h2, h3 {margin: 10px 0;}
a.mention {background: lighten($secondary_background_color, 70%);}
&.bottom {
.topic-meta-data {padding-left: 13px;}
&.hidden {display: block; opacity: 0; }
}
&.bottom .arrow {float: right; margin: 0 0 0 0;}
&.top {
margin-left: 112px;
max-width: 775px;
.topic-meta-data {padding-left: 13px;}
@include medium-width {
margin-left: 99px;
}
&.bottom { margin-top: -11px;}
.topic-meta-data h5 {margin: 5px;}
.topic-meta-data-inside {
margin: -3px 0 0 0;
color: $secondary_text_color;
@include small-width {
margin-left: 95px;
max-width: 720px;
}
.topic-meta-data {padding-top: 20px;}
}
&.top.span14 {padding-left: 0;}
.topic-body, .topic-meta-data {border: none;}
.row {border-top: 1px solid $primary_border_color; padding-top: 7px;}
.reply:first-of-type .row {border-top: none;}
background: lighten($secondary_background_color, 76%);
.quote .title, blockquote, .onebox, .onebox-result {
background: lighten($secondary_background_color, 70%);
border-left: 5px solid lighten($secondary_background_color, 60%);
}
&.bottom { margin-top: -11px;}
.topic-meta-data {
position: relative;
.avatar {
margin-left: 10px;
margin-top: -10px;
}
}
.topic-meta-data h5 {
position: absolute;
left: 100px;
top: 0px;
z-index: 1;
width: 100%;
a {
font-weight: bold;
color: lighten($primary_text_color, 25%);
}
}
.topic-meta-data-inside {
margin: -3px 0 0 0;
color: $secondary_text_color;
}
.topic-meta-data {padding-top: 20px;}
}
.bottom-round nav.post-controls .show-replies {
background: lighten($secondary_background_color, 76%);
@ -513,29 +559,42 @@ iframe {
.topic-meta-data {
margin-bottom: 10px;
width: 92px;
border-top: 1px solid $primary_border_color;
padding-top: 30px;
width: 92px;
img {
text-align: center;
.names {
position: absolute;
left: 110px;
top: 5px;
width: 400px;
z-index: 1;
}
.names, .user-title {
display: inline;
}
.main-avatar img {
width: 45px;
height: 45px;
position: absolute;
left: 30px;
top: 10px;
}
.contents {
text-align: center;
a {
margin: 0 auto;
width: 45px;
word-wrap: break-word;
color: $primary_text_color;
font-weight: normal;
line-height: 1.3;
}
.username a {
font-weight: bold;
color: lighten($primary_text_color, 25%);
}
.new-user a {
color: $secondary_text_color;
}
@ -547,7 +606,6 @@ iframe {
h3 a {
width: auto;
}
h3.full-name {
@ -558,7 +616,7 @@ iframe {
}
}
h3 { display: block; }
h3 { display: inline; }
}
@ -586,7 +644,7 @@ iframe {
.contents .cooked {
margin-right: 50px;
margin-top: 15px;
margin-top: 30px;
word-wrap: break-word;
h1, h2, h3, h4, h5, h6 { margin: 30px 0 10px; }
@ -664,9 +722,6 @@ iframe {
}
.topic-meta-data {
float: left;
position: relative;
h3 {
font-size: 13px;
margin-top: 5px;
@ -768,9 +823,9 @@ blockquote { /* solo quotes */
}
.topic-body {
border-top: 1px solid $primary_border_color;
float: left;
position: relative;
border-top: 1px solid $primary_border_color;
padding: 10px 0 15px 0;
&.highlighted {
background-color: $emphasis_background_color;
@ -806,35 +861,6 @@ blockquote { /* solo quotes */
.row:after {clear: both;}
.embedded-posts {
h1, h2, h3 {margin: 10px 0;}
a.mention {background: lighten($secondary_background_color, 70%);}
&.bottom {
.topic-meta-data {padding-left: 13px;}
&.hidden {display: block; opacity: 0; }
}
&.bottom .arrow {float: right; margin: 0 0 0 0;}
&.top {
margin-left: 112px;
max-width: 775px;
.topic-meta-data {padding-left: 13px;}
@include medium-width {
margin-left: 99px;
}
@include small-width {
margin-left: 95px;
max-width: 720px;
}
}
&.top.span14 {padding-left: 0;}
.topic-body, .topic-meta-data {border: none;}
.row {border-top: 1px solid $primary_border_color; padding-top: 7px;}
.reply:first-of-type .row {border-top: none;}
}
.dropdown {
position: relative;

6
app/assets/stylesheets/desktop/topic.scss
View File

@ -3,12 +3,6 @@
padding-right: 5px;
}
.topic-meta-data-inside {
float: right;
margin-top: -22px;
float: right;
font-size: 12px;
}
.post-actions {
@include unselectable;