about summary refs log tree commit diff
path: root/app/assets/javascripts/components/features/notifications
diff options
context:
space:
mode:
authorJessica Stokes <hello@jessicastokes.net>2017-04-11 00:27:30 +1000
committerEugen <eugen@zeonfederated.com>2017-04-10 16:27:30 +0200
commitdb7c7d1af154a17808f3379a357c511b669be51c (patch)
treea5403258a23c41b7cf80fffcaf3192276fefc710 /app/assets/javascripts/components/features/notifications
parent42fb4faa0f3bb4c6c4c7675a2ffb0b3bd86ae960 (diff)
Improve scrolling behaviour (#1415)
* Replace column margin with padding

This improves horizontal scrolling behaviour significantly; scrolled flex elements are... a little weird.

* Move clear column button styling to css
Diffstat (limited to 'app/assets/javascripts/components/features/notifications')
-rw-r--r--app/assets/javascripts/components/features/notifications/components/clear_column_button.jsx12
1 files changed, 1 insertions, 11 deletions
diff --git a/app/assets/javascripts/components/features/notifications/components/clear_column_button.jsx b/app/assets/javascripts/components/features/notifications/components/clear_column_button.jsx
index 71877fb2b..debbfd01f 100644
--- a/app/assets/javascripts/components/features/notifications/components/clear_column_button.jsx
+++ b/app/assets/javascripts/components/features/notifications/components/clear_column_button.jsx
@@ -4,16 +4,6 @@ const messages = defineMessages({
   clear: { id: 'notifications.clear', defaultMessage: 'Clear notifications' }
 });
 
-const iconStyle = {
-  fontSize: '16px',
-  padding: '15px',
-  position: 'absolute',
-  right: '48px',
-  top: '0',
-  cursor: 'pointer',
-  zIndex: '2'
-};
-
 const ClearColumnButton = React.createClass({
 
   propTypes: {
@@ -25,7 +15,7 @@ const ClearColumnButton = React.createClass({
     const { intl } = this.props;
 
     return (
-      <div title={intl.formatMessage(messages.clear)} className='column-icon' tabIndex='0' style={iconStyle} onClick={this.props.onClick}>
+      <div title={intl.formatMessage(messages.clear)} className='column-icon column-icon-clear' tabIndex='0' onClick={this.props.onClick}>
         <i className='fa fa-eraser' />
       </div>
     );