ashpie/swaf
1
0
Fork 0
Code Issues 22 Pull Requests Releases 11 Wiki Activity

data-table: add data-table-container to overflow-x scroll, use it on relevant pages

Browse Source
This commit is contained in:
Alice Gaudon 2021-11-09 19:27:33 +01:00
parent 5336940dc3
commit 7650238183
4 changed files with 56 additions and 47 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
src/assets/scss/data-table.scss
View File

@ -24,3 +24,8 @@
background-color: transparent; background-color: transparent;
} }
} }
.data-table-container {
overflow-x: auto;
max-width: 100%;
}

2
src/assets/views/auth/account/account.svelte
View File

@ -41,6 +41,7 @@
<section class="panel"> <section class="panel">
<h2 id="emails"><i data-feather="shield"></i> Email addresses</h2> <h2 id="emails"><i data-feather="shield"></i> Email addresses</h2>
<div class="data-table-container">
<table class="data-table"> <table class="data-table">
<thead> <thead>
<tr> <tr>
@ -84,6 +85,7 @@
{/each} {/each}
</tbody> </tbody>
</table> </table>
</div>
<Form action={$locals.route('add-email')} class="sub-panel" <Form action={$locals.route('add-email')} class="sub-panel"
submitIcon="plus" submitText="Add email address"> submitIcon="plus" submitText="Add email address">

2
src/assets/views/backend/accounts_approval.svelte
View File

@ -25,7 +25,7 @@
<Pagination pagination={$locals.pagination} routeName="accounts-approval" contextSize="3" /> <Pagination pagination={$locals.pagination} routeName="accounts-approval" contextSize="3" />
<div class="panel"> <div class="panel data-table-container">
<table class="data-table"> <table class="data-table">
<thead> <thead>
<tr> <tr>

6
test/assets/views/AllTests.svelte
View File

@ -14,7 +14,8 @@
<div class="render-mode">{$locals.isPreRender ? 'SSR' : 'CSR'}</div> <div class="render-mode">{$locals.isPreRender ? 'SSR' : 'CSR'}</div>
<table> <div class="data-table-container">
<table class="data-table">
<thead> <thead>
<tr> <tr>
<th>Name</th> <th>Name</th>
@ -26,4 +27,5 @@
<tbody> <tbody>
<LocalsTest/> <LocalsTest/>
</tbody> </tbody>
</table> </table>
</div>