Merge branch 'feature/separate-reply-form-from-inside-status' into 'develop'

Make reply window not part of the inner status.

See merge request !60
This commit is contained in:
lambadalambda 2017-03-10 01:44:13 -05:00
commit 380adc6966
1 changed files with 19 additions and 3 deletions

View File

@ -73,18 +73,20 @@
<div class='status-actions'> <div class='status-actions'>
<div> <div>
<a href="#" v-on:click.prevent="toggleReplying"> <a href="#" v-on:click.prevent="toggleReplying">
<i class='fa icon-reply'></i> <i class="fa icon-reply" :class="{'icon-reply-active': replying}"></i>
</a> </a>
</div> </div>
<retweet-button :status=status></retweet-button> <retweet-button :status=status></retweet-button>
<favorite-button :status=status></favorite-button> <favorite-button :status=status></favorite-button>
<delete-button :status=status></delete-button> <delete-button :status=status></delete-button>
</div> </div>
<post-status-form v-if="replying" :reply-to="status.id" :attentions="status.attentions" :repliedUser="status.user" v-on:posted="toggleReplying"></post-status-form>
</div> </div>
</div> </div>
</div> </div>
<div class="status base00-background container" v-if="replying">
<div class="reply-left"/>
<post-status-form class="reply-body" :reply-to="status.id" :attentions="status.attentions" :repliedUser="status.user" v-on:posted="toggleReplying"/>
</div>
</template> </template>
</div> </div>
</template> </template>
@ -141,6 +143,10 @@
color: $blue; color: $blue;
} }
.icon-reply-active {
color: $blue;
}
.status .avatar { .status .avatar {
width: 48px; width: 48px;
} }
@ -172,4 +178,14 @@
margin-bottom: 1em; margin-bottom: 1em;
margin-top: 0.2em; margin-top: 0.2em;
} }
.reply-left {
flex: 0;
min-width: 48px;
}
.reply-body {
flex: 1;
}
</style> </style>