fix: table indication for sideway scroll

This commit is contained in:
Alexander Daichendt 2022-07-27 00:27:30 +02:00
parent 256ffc4370
commit 5be4f06cdf
2 changed files with 12 additions and 3 deletions

View file

@ -39,7 +39,6 @@
color: var(--special-color);
text-decoration: none;
font-weight: 550;
white-space: nowrap;
}
a:hover {
color: var(--outline-color);

View file

@ -1,7 +1,7 @@
<script>
</script>
<div>
<div tabindex="0">
<table id="table">
<slot />
</table>
@ -13,8 +13,18 @@
padding: 1rem;
box-shadow: 0px 0px 2px var(--shadow-color);
border: 1px solid var(--outline-color);
overflow-x: auto;
overflow: auto;
background: linear-gradient(to right, white 30%, rgba(255, 255, 255, 0)),
linear-gradient(to right, rgba(255, 255, 255, 0), white 70%) 0 100%,
radial-gradient(farthest-side at 0% 50%, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0)),
radial-gradient(farthest-side at 100% 50%, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0)) 0 100%;
background-repeat: no-repeat;
background-color: white;
background-size: 40px 100%, 40px 100%, 14px 100%, 14px 100%;
background-position: 0 0, 100%, 0 0, 100%;
background-attachment: local, local, scroll, scroll;
}
table {
border-collapse: collapse;
width: 100%;