From 621c44e28c4ce7634101dcb19f89ec414c90b6dd Mon Sep 17 00:00:00 2001 From: Ivan Diaz Date: Thu, 4 Oct 2018 21:41:28 -0300 Subject: [PATCH] Fix private response css --- .gitignore | 1 + client/src/app-components/ticket-event.js | 17 ++++++++-- client/src/app-components/ticket-event.scss | 35 ++++++++------------ client/src/app-components/ticket-viewer.js | 24 ++++++++------ client/src/app-components/ticket-viewer.scss | 25 ++++++++------ client/src/core-components/text-editor.scss | 2 +- client/src/data/languages/en.js | 3 +- client/src/scss/_vars.scss | 2 +- server/.htaccess | 2 +- server/files/.htaccess | 1 + 10 files changed, 63 insertions(+), 49 deletions(-) create mode 100644 server/files/.htaccess diff --git a/.gitignore b/.gitignore index b580d704..592d789c 100644 --- a/.gitignore +++ b/.gitignore @@ -5,6 +5,7 @@ server/composer.lock server/vendor server/files/ !server/files/.gitkeep +!server/files/.htaccess server/.dbdata server/.fakemail server/apidoc diff --git a/client/src/app-components/ticket-event.js b/client/src/app-components/ticket-event.js index 3a925784..5eb22637 100644 --- a/client/src/app-components/ticket-event.js +++ b/client/src/app-components/ticket-event.js @@ -6,6 +6,7 @@ import API from 'lib-app/api-call'; import DateTransformer from 'lib-core/date-transformer'; import Icon from 'core-components/icon'; +import Tooltip from 'core-components/tooltip'; class TicketEvent extends React.Component { static propTypes = { @@ -84,8 +85,10 @@ class TicketEvent extends React.Component {
{this.props.author.name} - {i18n((this.props.author.staff) ? 'STAFF' : 'CUSTOMER')} - {(this.props.private*1) ? {i18n('PRIVATE')} : null} + + {i18n((this.props.author.staff) ? 'STAFF' : 'CUSTOMER')} + + {(this.props.private*1) ? this.renderPrivateBadge() : null}
{DateTransformer.transformToString(this.props.date)}
@@ -172,6 +175,16 @@ class TicketEvent extends React.Component { ); } + renderPrivateBadge() { + return ( + + + {i18n('PRIVATE')} + + + ); + } + renderFileRow(file) { let node = null; diff --git a/client/src/app-components/ticket-event.scss b/client/src/app-components/ticket-event.scss index ccd25dac..339b2200 100644 --- a/client/src/app-components/ticket-event.scss +++ b/client/src/app-components/ticket-event.scss @@ -47,7 +47,7 @@ &__comment { position: relative; - word-break: break-all; + word-wrap: break-word; &-pointer { right: 100%; @@ -64,17 +64,19 @@ position: relative; padding: 12px; color: $primary-black; + } - &-type { - font-size: 10.6px; - padding-left: 10px; - color: $secondary-blue; - background-color: very-light-grey; - border: 2px solid; - border-radius: 4px; - padding: 4px; - margin-left: 12px; - } + &-badge-container { + margin-left: 12px; + } + + &-badge { + font-size: 10.6px; + font-weight: bold; + color: $primary-blue; + background-color: $very-light-grey; + padding: 6px; + width: 100px; } &-date { @@ -109,10 +111,6 @@ .ticket-event__icon { background-color: $primary-blue; } - - .ticket-event__comment-author-type { - color: $primary-blue; - } } &_circled { @@ -190,16 +188,9 @@ background-color: $light-yellow; border-color: $light-yellow; } - .ticket-event__comment-content { - background-color: $very-light-yellow; - border-color: $very-light-yellow; - } .ticket-event__staff-pic { background-color: $light-yellow; border-color: $light-yellow; } - .ticket-event__file { - background-color: $light-yellow; - } } } diff --git a/client/src/app-components/ticket-viewer.js b/client/src/app-components/ticket-viewer.js index d558c6e4..7450ed1a 100644 --- a/client/src/app-components/ticket-viewer.js +++ b/client/src/app-components/ticket-viewer.js @@ -19,6 +19,7 @@ import Button from 'core-components/button'; import Message from 'core-components/message'; import Icon from 'core-components/icon'; import TextEditor from 'core-components/text-editor'; +import InfoTooltip from 'core-components/info-tooltip'; class TicketViewer extends React.Component { static propTypes = { @@ -214,9 +215,11 @@ class TicketViewer extends React.Component {
{i18n('RESPOND')}
-
- {this.renderCustomResponses()} - {this.renderPrivate()} +
+
+ {this.renderCustomResponses()} + {this.renderPrivate()} +
@@ -256,17 +259,12 @@ class TicketViewer extends React.Component { return customResponsesNode; } - renderCommentError() { - return ( - {i18n('TICKET_COMMENT_ERROR')} - ); - } - renderPrivate() { if (this.props.userStaff) { return ( -
+
+
); } else { @@ -274,6 +272,12 @@ class TicketViewer extends React.Component { } } + renderCommentError() { + return ( + {i18n('TICKET_COMMENT_ERROR')} + ); + } + getCommentFormProps() { return { onSubmit: this.onSubmit.bind(this), diff --git a/client/src/app-components/ticket-viewer.scss b/client/src/app-components/ticket-viewer.scss index 1ae5f598..a1b3ac36 100644 --- a/client/src/app-components/ticket-viewer.scss +++ b/client/src/app-components/ticket-viewer.scss @@ -10,9 +10,6 @@ font-size: 16px; padding: 6px 0; } - &__private { - - } &__number { color: white; @@ -74,12 +71,25 @@ text-align: left; } - &-custom { + &-actions { background-color: $very-light-grey; + display: flex; + justify-content: space-between; + } + + &-custom { padding: 20px 0 0 20px; text-align: left; } + &-private { + padding: 20px 20px 0 0; + + &-info { + margin-left: 5px; + } + } + &-buttons { display: flex; justify-content: space-between; @@ -87,11 +97,4 @@ } } - &__actions { - background-color: $very-light-grey; - - display:flex; - align-items:center;justify-content: space-between; - } - } diff --git a/client/src/core-components/text-editor.scss b/client/src/core-components/text-editor.scss index 4c516f8c..fbdd8d2b 100644 --- a/client/src/core-components/text-editor.scss +++ b/client/src/core-components/text-editor.scss @@ -7,7 +7,7 @@ border: 1px solid $grey; border-radius: 3px; - .ql-container { + .ql-editor { min-height: 200px; } } diff --git a/client/src/data/languages/en.js b/client/src/data/languages/en.js index 38c3a9cb..fa7cbaef 100644 --- a/client/src/data/languages/en.js +++ b/client/src/data/languages/en.js @@ -184,7 +184,7 @@ export default { 'HIMSELF': 'himself', 'ADD_USER': 'Add user', 'UPLOAD_FILE': 'Upload file', - 'PRIVATE': 'private', + 'PRIVATE': 'Private', 'ENABLE_USER': 'Enable User', 'DISABLE_USER': 'Disable User', @@ -301,6 +301,7 @@ export default { 'SMTP_SERVER_DESCRIPTION': 'The configuration of the SMTP server allows the application to send mails. If you do not configure it, no emails will be sent by OpenSupports.', 'ENABLE_USER_DESCRIPTION': 'This action allows the user to sign in and create tickets.', 'DISABLE_USER_DESCRIPTION': 'User will be disabled and will not be able to sign in and create tickets.', + 'PRIVATE_DESCRIPTION': 'This response will only be seen by staff members', //ERRORS 'EMAIL_OR_PASSWORD': 'Email or password invalid', diff --git a/client/src/scss/_vars.scss b/client/src/scss/_vars.scss index 352503ad..b37d8318 100644 --- a/client/src/scss/_vars.scss +++ b/client/src/scss/_vars.scss @@ -6,7 +6,7 @@ $primary-blue: #414A59; $secondary-blue: #20B8c5; $primary-yellow: #E5D151; -$light-yellow: rgba(229,209,81,0.6); +$light-yellow: #fff19c; $very-light-yellow: #ffffe0; $primary-green: #82CA9C; diff --git a/server/.htaccess b/server/.htaccess index 945b7599..c1d1ed02 100644 --- a/server/.htaccess +++ b/server/.htaccess @@ -1,4 +1,4 @@ RewriteEngine on RewriteCond %{REQUEST_FILENAME} !-f RewriteCond %{REQUEST_FILENAME} !-d -RewriteRule .* index.php [PT,L] \ No newline at end of file +RewriteRule .* index.php [PT,L] diff --git a/server/files/.htaccess b/server/files/.htaccess new file mode 100644 index 00000000..3a428827 --- /dev/null +++ b/server/files/.htaccess @@ -0,0 +1 @@ +Deny from all