IntenseWebs/discourse
3
0
Fork 0
mirror of https://github.com/discourse/discourse.git synced 2025-02-25 18:55:32 -06:00
Code Issues Packages Projects Releases Wiki Activity

UX: Replace composer cancel and upload with icons

Browse Source
This commit is contained in:
Kris 2018-03-09 22:29:42 -05:00
parent 9522469f6a
commit 257950e8bd
2 changed files with 11 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
app/assets/javascripts/discourse/templates/composer.hbs
View File

@ -105,7 +105,7 @@
label=model.saveLabel label=model.saveLabel
disableSubmit=disableSubmit}} disableSubmit=disableSubmit}}
<a href {{action "cancel"}} class='cancel' tabindex="6">{{i18n 'cancel'}}</a> <a href {{action "cancel"}} class='cancel' tabindex="6" title="{{i18n 'cancel'}}">{{d-icon "times"}}</a>
{{#if site.mobileView}} {{#if site.mobileView}}
{{#if whisperOrUnlistTopic}} {{#if whisperOrUnlistTopic}}
@ -133,7 +133,7 @@
<div class="composer-bottom-right"> <div class="composer-bottom-right">
{{#if site.mobileView}} {{#if site.mobileView}}
{{#if allowUpload}} {{#if allowUpload}}
<a class="mobile-file-upload {{if isUploading 'hidden'}}">{{i18n 'upload'}}</a> <a class="btn btn-default no-text mobile-file-upload {{if isUploading 'hidden'}}">{{d-icon "upload"}}</a>
{{/if}} {{/if}}
{{#if showPreview}} {{#if showPreview}}

15
app/assets/stylesheets/common/base/compose.scss
View File

@ -249,7 +249,7 @@
.submit-panel { .submit-panel {
display: flex; display: flex;
flex-shrink: 0; flex-shrink: 0;
margin-top: 10px; margin: 7px 0 3px 0;
} }
.save-or-cancel { .save-or-cancel {
@ -260,7 +260,14 @@
flex: 0 0 auto; flex: 0 0 auto;
} }
.cancel { .cancel {
margin-left: 10px; margin-left: .65em;
font-size: 1.75em;
line-height: normal;
color: $primary-medium;
transition: color 250ms;
&:hover {
color: $danger;
}
} }
#draft-status, #draft-status,
#file-uploading { #file-uploading {
@ -287,10 +294,6 @@
} }
} }
.create {
margin-right: 5px;
}
#draft-status, #file-uploading { #draft-status, #file-uploading {
color: $primary-high; color: $primary-high;
} }