jeffemmett
/
folk-canvas
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

styles

This commit is contained in:
“chrisshank” 2024-10-11 23:17:38 -07:00
parent 47a336333d
commit a1201311c2
2 changed files with 8 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
demo/spreadsheet.html
View File

@ -22,7 +22,7 @@
</style> </style>
</head> </head>
<body> <body>
<spatial-geometry x="50" y="50" height="800" width="700"> <spatial-geometry x="50" y="50" height="300" width="500">
<s-table></s-table> <s-table></s-table>
</spatial-geometry> </spatial-geometry>

10
src/spreadsheet/spreadsheet.ts
View File

@ -13,7 +13,7 @@ styles.replaceSync(`
overflow: scroll; overflow: scroll;
scroll-snap-type: both mandatory; scroll-snap-type: both mandatory;
scroll-padding-top: var(--cell-height); scroll-padding-top: var(--cell-height);
scroll-padding-left: var(--cell-width); scroll-padding-left: 50px;
} }
s-columns { s-columns {
@ -25,6 +25,7 @@ s-columns {
grid-template-rows: subgrid; grid-template-rows: subgrid;
position: sticky; position: sticky;
top: 0; top: 0;
z-index: 2;
} }
s-rows { s-rows {
@ -36,6 +37,7 @@ s-rows {
grid-template-rows: subgrid; grid-template-rows: subgrid;
position: sticky; position: sticky;
left: 0; left: 0;
z-index: 2;
s-header { s-header {
font-size: 0.75rem; font-size: 0.75rem;
@ -51,17 +53,17 @@ s-header {
justify-content: center; justify-content: center;
&[empty] { &[empty] {
background-color: #f8f9fa;
box-shadow: 3px 3px 3px 0px rgba(173, 168, 168, 0.4); box-shadow: 3px 3px 3px 0px rgba(173, 168, 168, 0.4);
grid-area: 1; grid-area: 1;
position: sticky; position: sticky;
top: 0; top: 0;
left: 0; left: 0;
z-index: 2; z-index: 3;
} }
} }
s-body { s-body {
background-color: #f8f9fa;
display: grid; display: grid;
grid-column: 2 / -1; grid-column: 2 / -1;
grid-row: 2 / -1; grid-row: 2 / -1;
@ -84,6 +86,7 @@ s-body {
::slotted(s-cell:focus) { ::slotted(s-cell:focus) {
border: 2px solid #1b73e8; border: 2px solid #1b73e8;
outline: none;
} }
`); `);
@ -179,6 +182,7 @@ export class SpreadsheetCell extends HTMLElement {
} }
connectedCallback() { connectedCallback() {
// this should run after all of the other cells have run
this.expression = this.getAttribute('expression') || ''; this.expression = this.getAttribute('expression') || '';
} }