Tweak user bio editing styles

This commit is contained in:
Toby Zerner 2015-03-17 17:01:19 +10:30
parent a4d0691a47
commit ccd8619d24
3 changed files with 20 additions and 12 deletions

View File

@ -24,10 +24,14 @@ export default Ember.Component.extend({
this.set('editing', true);
var component = this;
var height = this.$().height();
Ember.run.scheduleOnce('afterRender', this, function() {
this.$('textarea').focus().blur(function() {
var save = function(e) {
if (e.shiftKey) { return; }
e.preventDefault();
component.send('save', $(this).val());
});
};
this.$('textarea').css('height', height).focus().bind('blur', save).bind('keydown', 'return', save);
});
},

View File

@ -70,25 +70,27 @@
}
}
& .user-bio {
padding: 10px 10px 1px;
margin: -10px -10px 10px;
border: 1px dashed transparent;
border-radius: @border-radius-base;
&.editable:not(.editing) {
cursor: text;
&:hover {
border: 1px dashed rgba(255, 255, 255, 0.5);
border-radius: @border-radius-base;
padding: 9px 9px 0;
border-color: rgba(255, 255, 255, 0.5);
}
}
.bio-content {
padding: 10px 10px 1px;
}
&, & textarea {
font-size: 14px;
}
& textarea {
padding: 10px;
margin: -10px -10px 0;
font-size: 14px;
}
}

View File

@ -1,9 +1,11 @@
{{#if editing}}
{{textarea value=user.bio class="form-control"}}
{{else}}
{{#if user.bioHtml}}
{{{user.bioHtml}}}
{{else if isEditable}}
<p>Write something about yourself...</p>
{{/if}}
<div class="bio-content">
{{#if user.bioHtml}}
{{{user.bioHtml}}}
{{else if isEditable}}
<p>Write something about yourself...</p>
{{/if}}
</div>
{{/if}}