enhancing reply design

This commit is contained in:
Nicolas Constant 2018-10-13 18:23:09 -04:00
parent 0d80f56c7c
commit 7aed4569e5
No known key found for this signature in database
GPG Key ID: 1E9F677FB01A5688
5 changed files with 29 additions and 23 deletions

View File

@ -1,5 +1,5 @@
<form (ngSubmit)="onSubmit()">
<textarea [(ngModel)]="status" name="status" class="form-control form-control-sm" style="min-width: 100%" rows="5" required placeholder="What's in your mind?" (keydown.control.enter)="onCtrlEnter()"></textarea>
<textarea [(ngModel)]="status" name="status" class="form-control form-control-sm" rows="5" required placeholder="What's in your mind?" (keydown.control.enter)="onCtrlEnter()"></textarea>
<select class="form-control form-control-sm form-control--privacy" id="privacy" name="privacy" [(ngModel)]="selectedPrivacy">
<option *ngFor="let p of privacyList" [ngValue]="p">{{p}}</option>

View File

@ -1,16 +1,22 @@
@import "variables";
@import "panel";
@import "buttons";
$btn-send-status-width: 60px;
.form-control {
margin-bottom: 5px;
margin: 0 0 5px 5px;
width: calc(100% - 10px);
background-color: $column-color;
border-color: $status-secondary-color;
color: #fff;
font-size: $default-font-size;
&:focus {
box-shadow: none;
}
&--privacy {
display: inline-block;
width: calc(100% - 5px - #{$btn-send-status-width});
width: calc(100% - 15px - #{$btn-send-status-width});
}
}
@ -19,18 +25,12 @@ $btn-send-status-width: 60px;
width: $btn-send-status-width;
position: relative;
top: -1px;
left: 5px;
// background-color: orange;
left: 5px; // background-color: orange;
// border-color: orange;
// color: black;
font-weight: 500;
// &:hover {
font-weight: 500; // &:hover {
// }
// &:focus {
// border-color: darkblue;
// }
}

View File

@ -56,7 +56,7 @@ export class ReplyToStatusComponent implements OnInit {
let spoiler = this.statusReplyingTo.spoiler_text;
for (const acc of selectedAccounts) {
this.mastodonService.postNewStatus(acc, this.status, visibility, spoiler)
this.mastodonService.postNewStatus(acc, this.status, visibility, spoiler, this.statusReplyingTo.id)
.then((res: Status) => {
console.log(res);
this.status = '';

View File

@ -2,7 +2,7 @@
.stream-column {
width: $stream-column-width;
height: calc(100%);
background-color: #0f111a;
background-color: $column-color;
margin: 0 0 0 $stream-column-separator;
&__stream-header {
width: calc(100%);

View File

@ -4,16 +4,22 @@ $font-link-primary: #595c67;
$font-link-primary-hover: #8f93a2;
$color-primary: #141824;
$color-secondary: #090b10;
$column-color: #0f111a;
$default-font-size: 15px;
$small-font-size: 12px;
$btn-primary-color: #515a62;
$btn-primary-color: #254d6f;
// $btn-primary-color: #515a62;
// $btn-primary-color: #254d6f;
$btn-primary-color: #444f74;
$btn-primary-color-hover: darken($btn-primary-color, 10);
$btn-primary-font-color: white;
// TEST 1
$status-primary-color: #fff;
$status-secondary-color: #353e64;
// $status-secondary-color: #353e64;
$status-secondary-color: #4e5572;
$status-links-color: #d9e1e8;
// $status-primary-color : #8f93a2;