diff --git a/app/assets/javascripts/discourse/widgets/topic-timeline.js.es6 b/app/assets/javascripts/discourse/widgets/topic-timeline.js.es6
index 0b4d32661a6..a82525157f6 100644
--- a/app/assets/javascripts/discourse/widgets/topic-timeline.js.es6
+++ b/app/assets/javascripts/discourse/widgets/topic-timeline.js.es6
@@ -5,11 +5,17 @@ import { relativeAge } from 'discourse/lib/formatter';
 import { iconNode } from 'discourse-common/lib/icon-library';
 import RawHtml from 'discourse/widgets/raw-html';
 
-const SCROLLAREA_HEIGHT = 300;
 const SCROLLER_HEIGHT = 50;
-const SCROLLAREA_REMAINING = SCROLLAREA_HEIGHT - SCROLLER_HEIGHT;
 const LAST_READ_HEIGHT = 20;
 
+function scrollareaHeight() {
+  return ($(window).height() < 425) ? 150 : 300;
+}
+
+function scrollareaRemaining() {
+  return scrollareaHeight() - SCROLLER_HEIGHT;
+}
+
 function clamp(p, min=0.0, max=1.0) {
   return Math.max(Math.min(p, max), min);
 }
@@ -27,7 +33,7 @@ createWidget('timeline-last-read', {
   tagName: 'div.timeline-last-read',
 
   buildAttributes(attrs) {
-    const bottom = SCROLLAREA_HEIGHT - (LAST_READ_HEIGHT / 2);
+    const bottom = scrollareaHeight() - (LAST_READ_HEIGHT / 2);
     const top = attrs.top > bottom ? bottom : attrs.top;
     return { style: `height: ${LAST_READ_HEIGHT}px; top: ${top}px` };
   },
@@ -115,7 +121,7 @@ createWidget('timeline-scrollarea', {
   buildKey: () => `timeline-scrollarea`,
 
   buildAttributes() {
-    return { style: `height: ${SCROLLAREA_HEIGHT}px` };
+    return { style: `height: ${scrollareaHeight()}px` };
   },
 
   defaultState(attrs) {
@@ -168,8 +174,8 @@ createWidget('timeline-scrollarea', {
     const percentage = state.percentage;
     if (percentage === null) { return; }
 
-    const before = SCROLLAREA_REMAINING * percentage;
-    const after = (SCROLLAREA_HEIGHT - before) - SCROLLER_HEIGHT;
+    const before = scrollareaRemaining() * percentage;
+    const after = (scrollareaHeight() - before) - SCROLLER_HEIGHT;
 
     let showButton = false;
     const hasBackPosition =
@@ -179,13 +185,13 @@ createWidget('timeline-scrollarea', {
       (position.lastRead && position.lastRead !== position.total);
 
     if (hasBackPosition) {
-      const lastReadTop = Math.round(position.lastReadPercentage * SCROLLAREA_HEIGHT);
+      const lastReadTop = Math.round(position.lastReadPercentage * scrollareaHeight());
       showButton = ((before + SCROLLER_HEIGHT - 5) < lastReadTop) ||
                     (before > (lastReadTop + 25));
 
 
       // Don't show if at the bottom of the timeline
-      if (lastReadTop > (SCROLLAREA_HEIGHT - (LAST_READ_HEIGHT / 2))) {
+      if (lastReadTop > (scrollareaHeight() - (LAST_READ_HEIGHT / 2))) {
         showButton = false;
       }
     }
@@ -200,7 +206,7 @@ createWidget('timeline-scrollarea', {
     ];
 
     if (hasBackPosition) {
-      const lastReadTop = Math.round(position.lastReadPercentage * SCROLLAREA_HEIGHT);
+      const lastReadTop = Math.round(position.lastReadPercentage * scrollareaHeight());
       result.push(this.attach('timeline-last-read', {
         top: lastReadTop,
         lastRead: position.lastRead,
diff --git a/app/assets/stylesheets/common/topic-timeline.scss b/app/assets/stylesheets/common/topic-timeline.scss
index b3d84c056ea..6a9899154d7 100644
--- a/app/assets/stylesheets/common/topic-timeline.scss
+++ b/app/assets/stylesheets/common/topic-timeline.scss
@@ -32,6 +32,9 @@
   &.timeline-fullscreen.show {
     max-height: 700px;
     transition: max-height 0.4s ease-out;
+    @media screen and (max-height: 425px) {
+      max-height: 75vh;
+    }      
     .topic-timeline {
       .timeline-footer-controls {
         display: inherit;
@@ -52,6 +55,9 @@
     box-shadow: 0px -2px 4px -1px rgba(0,0,0,.25);
     padding-top: 20px;
     z-index: z("fullscreen");
+    @media screen and (max-height: 425px) {
+      padding-top: 10px;
+    }
     .back-button {
       display: none;
     }
@@ -77,6 +83,9 @@
         display: block;
         display: -webkit-box;
         -webkit-line-clamp: 8;
+        @media screen and (max-height: 425px) {
+          -webkit-line-clamp: 5;          
+        }
         -webkit-box-orient: vertical;
       }
       .username {