vue-floatThead
vue-floatThead copied to clipboard
Floating when shouldn't
I feel like I must be missing something here but please see the linked video
https://youtu.be/-QpPF-Lvaf4
It seems like the header is floating when it shouldn't be. But I'm unclear from looking at your code and documentation what I'm doing wrong to cause this
<float-thead-table class="developer-table" position='fixed' :debug="true">
<thead class="sticky-head">
<tr class="table-top-header">
<th class="blank-header developer"></th>
<th class="divider"></th>
<th colspan=7 class="settings-header">Persistent Settings</th>
<th class="divider"></th>
<th colspan=10 class="status-header">{{monthYear}} Status</th>
</tr>
<tr>
<th class="developer sortable" :class="isSortProperty('developer_name')" @click="sortBy('developer_name')">Developer</th>
<th class="divider"></th>
<th class="center sortable toggle-column" :class="isSortProperty('pdf_setting')" @click="sortBy('pdf_setting')">PDF</th>
<th class="center sortable toggle-column" :class="isSortProperty('xero_setting')" @click="sortBy('xero_setting')">Xero</th>
<th class="center sortable toggle-column" :class="isSortProperty('payment_setting')" @click="sortBy('payment_setting')">Payment</th>
<th class="center sortable toggle-column" :class="isSortProperty('email_setting')" @click="sortBy('email_setting')">Email</th>
<th class="sortable recipients-column" :class="isSortProperty('recipients')" @click="sortBy('recipients')">Recipients</th>
<th class="sortable" :class="isSortProperty('notes_setting')" @click="sortBy('notes_setting')">Notes</th>
<th>Save</th>
<th class="divider"></th>
<th class="center sortable" :class="isSortProperty('pdf')" @click="sortBy('pdf')">PDF</th>
<th class="center sortable" :class="isSortProperty('xero')" @click="sortBy('xero')">Xero</th>
<th class="center sortable" :class="isSortProperty('payment')" @click="sortBy('payment')">Payment</th>
<th class="center sortable" :class="isSortProperty('email')" @click="sortBy('email')">Email</th>
<th class="center sortable" :class="isSortProperty('processed')" @click="sortBy('processed')">Processed</th>
<th class="center sortable" :class="isSortProperty('cad_value')" @click="sortBy('cad_value')">CAD</th>
<th class="center sortable" :class="isSortProperty('usd_value')" @click="sortBy('usd_value')">USD</th>
<th class="center sortable" :class="isSortProperty('reviewed')" @click="sortBy('reviewed')">Memo</th>
<th class="center sortable" :class="isSortProperty('notes')" @click="sortBy('notes')">Notes</th>
<th class="center">Edit</th>
</tr>
</thead>
<tbody>
<DeveloperRow
v-for="(developer, index) in developers"
:key="developer.game_developer_id"
:index="index"
:developer="developer"
:monthYear="monthYear"
:ref="developer.game_developer_id"
v-on:error="onError"
v-on:preview-pdf="preview"
v-on:edit-note="editNotes"
/>
</tbody>
<!-- </table> -->
</float-thead-table>