fc-sticky class, header cushion

fullcalendar · Apr 8, 2020 · 31c32e9 · 31c32e9
1 parent 8110169
commit 31c32e9
Show file tree

Hide file tree

Showing 3 changed files with 29 additions and 6 deletions.
diff --git a/packages-premium b/packages-premium
diff --git a/packages/core/src/common/TableDateCell.tsx b/packages/core/src/common/TableDateCell.tsx
@@ -19,6 +19,7 @@ export interface TableDateCellProps {
   colCnt: number
   dayHeaderFormat: DateFormatter
   colSpan?: number
+  isSticky?: boolean // TODO: get this outta here somehow
   extraDataAttrs?: object
   extraHookProps?: object
 }
@@ -31,7 +32,7 @@ export interface DateHeaderCellHookProps extends DateMeta { // is used publicly
   [otherProp: string]: any
 }
 
-const CLASS_NAME = 'fc-col-header-cell'
+const CLASS_NAME = 'fc-col-header-cell' // do the cushion too? no
 
 
 export default class TableDateCell extends BaseComponent<TableDateCellProps> { // BAD name for this class now. used in the Header
@@ -69,7 +70,17 @@ export default class TableDateCell extends BaseComponent<TableDateCellProps> { /
             data-date={!dayMeta.isDisabled ? formatDayString(date) : undefined}
             colSpan={props.colSpan > 1 ? props.colSpan : undefined}
             {...props.extraDataAttrs}
-          >{innerContent}</th>
+          >
+            <span
+              class={[
+                'fc-col-header-cell-cushion',
+                props.isSticky ? 'fc-sticky' : ''
+              ].join(' ')}
+              ref={innerElRef}
+            >
+              {innerContent}
+            </span>
+          </th>
         )}
       </RenderHook>
     )
@@ -82,6 +93,7 @@ export interface TableDowCellProps {
   dow: number
   dayHeaderFormat: DateFormatter
   colSpan?: number
+  isSticky?: boolean // TODO: get this outta here somehow
   extraHookProps?: object
   extraDataAttrs?: object
   extraClassNames?: string[]
@@ -128,7 +140,17 @@ export class TableDowCell extends BaseComponent<TableDowCellProps> {
             className={classNames.concat(customClassNames).join(' ')}
             colSpan={props.colSpan > 1 ? props.colSpan : undefined}
             {...props.extraDataAttrs}
-          >{innerContent}</th>
+          >
+            <span
+              class={[
+                'fc-col-header-cell-cushion',
+                props.isSticky ? 'fc-sticky' : ''
+              ].join(' ')}
+              ref={innerElRef}
+            >
+              {innerContent}
+            </span>
+          </th>
         )}
       </RenderHook>
     )

diff --git a/packages/core/src/styles/_col-header.scss b/packages/core/src/styles/_col-header.scss
@@ -1,4 +1,5 @@
 
-.fc .fc-col-header-cell { // extra precedence to OVERCOME RESET
-  padding: 2px;
+.fc-col-header-cell-cushion {
+  display: inline-block; // mostly for sticky
+  padding: 2px 4px;
 }