Improve Bootstrap stream style
This commit is contained in:
Steffen van Bergerem
parent
1c83cf0299
commit
b083560266
15 changed files with 26 additions and 47 deletions
|
|
@ -3,9 +3,9 @@
|
|||
@import 'perfect-scrollbar';
|
||||
|
||||
@import "colors";
|
||||
@import 'sizes';
|
||||
@import 'mixins';
|
||||
@import 'new_styles/new_mixins';
|
||||
@import 'new_styles/variables';
|
||||
|
||||
/* core */
|
||||
@import 'flash_messages';
|
||||
|
|
|
|||
|
|
@ -8,14 +8,14 @@
|
|||
}
|
||||
.media { margin-top: 10px; }
|
||||
}
|
||||
.comments > .comment {
|
||||
.comments > .comment, .comment.new_comment_form_wrapper {
|
||||
.avatar {
|
||||
margin-top: 5px;
|
||||
height: 30px;
|
||||
width: 30px;
|
||||
}
|
||||
margin: 0;
|
||||
border-top: 1px dotted $border-grey;
|
||||
&.no-border { border: none; }
|
||||
padding: 10px 0;
|
||||
.comment-content p:last-of-type { margin-bottom: 0; }
|
||||
|
||||
|
|
|
|||
|
|
@ -101,7 +101,7 @@
|
|||
.img { line-height: 15px; }
|
||||
|
||||
.subject {
|
||||
font-size: 14px;
|
||||
font-size: $font-size-text;
|
||||
> * {
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
|
|
|
|||
|
|
@ -7,7 +7,7 @@
|
|||
#invitationsModal {
|
||||
.modal-header, .modal-body {
|
||||
color: $text;
|
||||
font-size: 14px;
|
||||
font-size: $font-size-text;
|
||||
text-align: initial;
|
||||
}
|
||||
#paste_link { font-weight: 700; }
|
||||
|
|
|
|||
|
|
@ -7,6 +7,7 @@ body {
|
|||
body {
|
||||
margin-top: 40px;
|
||||
padding : none;
|
||||
font-size: $font-size-text;
|
||||
|
||||
&.lock {
|
||||
overflow: hidden;
|
||||
|
|
|
|||
|
|
@ -40,7 +40,7 @@
|
|||
font-size: 16px;
|
||||
height: 40px;
|
||||
padding: 10px 10px 10px 130px;
|
||||
line-height: 20px;
|
||||
line-height: $line-height;
|
||||
box-sizing: border-box;
|
||||
width: 100%;
|
||||
border-bottom: 1px solid $border-grey;
|
||||
|
|
|
|||
|
|
@ -1,11 +0,0 @@
|
|||
$container-width : 1170;
|
||||
|
||||
$margin-between-columns : 30;
|
||||
$column-width : 295 - $margin-between-columns;
|
||||
$raw-two-column-width : ($column-width * 2) + ($margin-between-columns * 2) ;
|
||||
$two-column-width : $raw-two-column-width - 30; //simply subtract an arbitrary ammount :)
|
||||
|
||||
$margin-between-rows : 20;
|
||||
|
||||
$row-height : $column-width;
|
||||
$two-row-height : $raw-two-column-width - 20;
|
||||
|
|
@ -8,7 +8,7 @@
|
|||
display: block;
|
||||
font-size: 13px;
|
||||
font-weight: normal;
|
||||
line-height: 20px;
|
||||
line-height: $line-height;
|
||||
padding-left: 20px;
|
||||
|
||||
input[type=radio] {
|
||||
|
|
|
|||
|
|
@ -38,7 +38,7 @@
|
|||
margin-bottom: 20px;
|
||||
.tag {
|
||||
background-color: transparent;
|
||||
font-size: 14px;
|
||||
font-size: $font-size-text;
|
||||
}
|
||||
.tag:not(.entypo) {
|
||||
font-weight: 700;
|
||||
|
|
|
|||
|
|
@ -78,7 +78,7 @@
|
|||
}
|
||||
|
||||
.mentions-input-box .mentions {
|
||||
line-height: 20px !important;
|
||||
line-height: $line-height !important;
|
||||
}
|
||||
|
||||
&.with_attachments .row-fluid#photodropzone_container {
|
||||
|
|
|
|||
|
|
@ -17,7 +17,7 @@
|
|||
.post_scope { margin-right: 5px; }
|
||||
.status-message-location {
|
||||
padding-top: 2px;
|
||||
line-height: 14px;
|
||||
line-height: $font-size-text;
|
||||
}
|
||||
}
|
||||
.avatar.medium {
|
||||
|
|
@ -106,7 +106,7 @@
|
|||
}
|
||||
}
|
||||
a.post_report > i {
|
||||
font-size: 14px;
|
||||
font-size: $font-size-text;
|
||||
}
|
||||
i.cross {
|
||||
font-size: 20px;
|
||||
|
|
@ -162,24 +162,10 @@
|
|||
margin-left: 0;
|
||||
padding-left: 15px;
|
||||
|
||||
.comments .comment {
|
||||
border-top: none;
|
||||
border-bottom: solid 1px #cccccc;
|
||||
padding-top: 10px;
|
||||
padding-bottom: 10px;
|
||||
margin: 10px;
|
||||
p {
|
||||
margin: 0 0 1em 0;
|
||||
word-wrap: break-word;
|
||||
&:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
.avatar {
|
||||
height: 35px;
|
||||
width: 35px;
|
||||
}
|
||||
.comment.media .img {
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
.no_comments {
|
||||
padding-top: 10px;
|
||||
padding-bottom: 10px;
|
||||
|
|
@ -189,9 +175,6 @@
|
|||
margin-bottom: 30px;
|
||||
}
|
||||
|
||||
.new_comment_form_wrapper {
|
||||
border-bottom: none;
|
||||
}
|
||||
a {
|
||||
color: $blue;
|
||||
}
|
||||
|
|
|
|||
2
app/assets/stylesheets/sizes.scss
Normal file
2
app/assets/stylesheets/sizes.scss
Normal file
|
|
@ -0,0 +1,2 @@
|
|||
$font-size-text: 13px;
|
||||
$line-height: 20px;
|
||||
|
|
@ -1,7 +1,7 @@
|
|||
#selected_aspect_contacts .avatar {
|
||||
height: 32px;
|
||||
width: 32px;
|
||||
margin-bottom: -2px;
|
||||
margin-bottom: 2px;
|
||||
}
|
||||
|
||||
.stream-faces a:hover { text-decoration: none; }
|
||||
|
|
|
|||
|
|
@ -46,9 +46,12 @@
|
|||
border-bottom: 1px solid $border-grey;
|
||||
padding: 10px;
|
||||
& > .media {
|
||||
& > .img > .avatar.small {
|
||||
height: 50px;
|
||||
width: 50px;
|
||||
& > .img > .avatar {
|
||||
margin-top: 5px;
|
||||
&.small {
|
||||
height: 50px;
|
||||
width: 50px;
|
||||
}
|
||||
}
|
||||
.author {
|
||||
font-weight: bold;
|
||||
|
|
@ -122,6 +125,7 @@
|
|||
margin-top: 3px;
|
||||
|
||||
& > .media .avatar {
|
||||
margin-top: 5px;
|
||||
height: 30px;
|
||||
width: 30px;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -11,7 +11,7 @@
|
|||
<div class="comments"> </div>
|
||||
|
||||
{{#if loggedIn}}
|
||||
<div class="comment no-border media new_comment_form_wrapper {{#unless commentsCount}} hidden {{/unless}}">
|
||||
<div class="comment media new_comment_form_wrapper {{#unless commentsCount}} hidden {{/unless}}">
|
||||
{{#with current_user}}
|
||||
<a href="/people/{{guid}}" class="img">
|
||||
{{{personImage this}}}
|
||||
|
|
|
|||
Loading…
Reference in a new issue