feat: hide single day header with css (#1019)

* No longer hiding the header when we only show one day * Now hiding header w/ css
jquense · Nov 7, 2018 · 5857d8f · 5857d8f
1 parent 0d5ed30
commit 5857d8f
Show file tree

Hide file tree

Showing 3 changed files with 15 additions and 6 deletions.
diff --git a/src/TimeGridHeader.js b/src/TimeGridHeader.js
@@ -175,12 +175,13 @@ class TimeGridHeader extends React.Component {
                 </div>
               </div>
             )}
-            {/* For rendering only one day no need to show the headers */}
-            {range.length > 1 && (
-              <div className="rbc-row rbc-time-header-cell">
-                {this.renderHeaderCells(range)}
-              </div>
-            )}
+            <div
+              className={`rbc-row rbc-time-header-cell${
+                range.length <= 1 ? ' rbc-time-header-cell-single-day' : ''
+              }`}
+            >
+              {this.renderHeaderCells(range)}
+            </div>
             <DateContentRow
               isAllDay
               rtl={rtl}

diff --git a/src/less/time-column.less b/src/less/time-column.less
@@ -97,6 +97,10 @@
     flex-basis: 0px;
   }
 
+  .rbc-time-header-cell-single-day {
+    display: none;
+  }
+
   .rbc-day-slot {
     min-width: 140px;
   }

diff --git a/src/less/time-grid.less b/src/less/time-grid.less
@@ -79,6 +79,10 @@
   // }
 }
 
+.rbc-time-header-cell-single-day {
+  display: none;
+}
+
 .rbc-time-header-content {
   flex: 1;
   display: flex;