From 7329fbd8a453bbd2fcbec8bd63b1390bfe7bc7b8 Mon Sep 17 00:00:00 2001
From: Eugen Rochko <eugen@zeonfederated.com>
Date: Thu, 26 Jan 2017 18:48:56 +0100
Subject: [PATCH] Fix up timeout, improve contrast on "show more", add
 responsive style for extremely wide monitors

---
 .../components/actions/notifications.jsx      |  2 +-
 .../features/ui/components/columns_area.jsx   |  5 +++-
 app/assets/stylesheets/components.scss        | 27 +++++++++++++++++--
 config/initializers/timeout.rb                |  5 +++-
 4 files changed, 34 insertions(+), 5 deletions(-)

diff --git a/app/assets/javascripts/components/actions/notifications.jsx b/app/assets/javascripts/components/actions/notifications.jsx
index 1731c1857..4caf9c75b 100644
--- a/app/assets/javascripts/components/actions/notifications.jsx
+++ b/app/assets/javascripts/components/actions/notifications.jsx
@@ -40,7 +40,7 @@ export function updateNotifications(notification, intlMessages, intlLocale) {
     // Desktop notifications
     if (typeof window.Notification !== 'undefined' && showAlert) {
       const title = new IntlMessageFormat(intlMessages[`notification.${notification.type}`], intlLocale).format({ name: notification.account.display_name.length > 0 ? notification.account.display_name : notification.account.username });
-      const body  = $('<p>').html(notification.status ? notification.status.content : '').text();
+      const body  = (notification.status && notification.status.spoiler_text.length > 0) ? notification.status.spoiler_text : $('<p>').html(notification.status ? notification.status.content : '').text();
 
       new Notification(title, { body, icon: notification.account.avatar, tag: notification.id });
     }
diff --git a/app/assets/javascripts/components/features/ui/components/columns_area.jsx b/app/assets/javascripts/components/features/ui/components/columns_area.jsx
index 8d316e26b..dd771900d 100644
--- a/app/assets/javascripts/components/features/ui/components/columns_area.jsx
+++ b/app/assets/javascripts/components/features/ui/components/columns_area.jsx
@@ -3,12 +3,15 @@ import PureRenderMixin from 'react-addons-pure-render-mixin';
 const style = {
   display: 'flex',
   flex: '1 1 auto',
-  justifyContent: 'flex-start',
   overflowX: 'auto'
 };
 
 const ColumnsArea = React.createClass({
 
+  propTypes: {
+    children: React.PropTypes.node
+  },
+
   mixins: [PureRenderMixin],
 
   render () {
diff --git a/app/assets/stylesheets/components.scss b/app/assets/stylesheets/components.scss
index 663969c32..f8f1b9d6c 100644
--- a/app/assets/stylesheets/components.scss
+++ b/app/assets/stylesheets/components.scss
@@ -139,10 +139,10 @@
   }
 
   .status__content__spoiler-link {
-    background: lighten($color1, 26%);
+    background: lighten($color1, 30%);
 
     &:hover {
-      background: lighten($color1, 29%);
+      background: lighten($color1, 33%);
       text-decoration: none;
     }
   }
@@ -261,6 +261,15 @@
   .status__avatar {
     opacity: 0.5;
   }
+
+  .status__content__spoiler-link {
+    background: lighten($color1, 26%);
+
+    &:hover {
+      background: lighten($color1, 29%);
+      text-decoration: none;
+    }
+  }
 }
 
 .notification__display-name {
@@ -354,6 +363,7 @@
 
 .columns-area {
   flex-direction: row;
+  justify-content: flex-start;
 }
 
 @media screen and (min-width: 360px) {
@@ -371,6 +381,19 @@
   width: 280px;
 }
 
+@media screen and (min-width: 2560px) {
+  .columns-area {
+    justify-content: center;
+  }
+
+  .column, .drawer {
+    width: 350px;
+    border-radius: 4px;
+    height: 90vh;
+    margin-top: 5vh;
+  }
+}
+
 .drawer__inner {
   background: linear-gradient(rgba(lighten($color1, 13%), 1), rgba(lighten($color1, 13%), 0.65));
 }
diff --git a/config/initializers/timeout.rb b/config/initializers/timeout.rb
index 1e6315b2b..643780884 100644
--- a/config/initializers/timeout.rb
+++ b/config/initializers/timeout.rb
@@ -1 +1,4 @@
-Rack::Timeout.timeout = 30 if Rails.env.production?
+if Rails.env.production?
+  Rack::Timeout.service_timeout = 15
+  Rack::Timeout::Logger.disable
+end