Merge pull request #12 from adsaf123/main
Merge grid rows and retain soft edges
This commit is contained in:
commit
2d624f8da9
3 changed files with 53 additions and 21 deletions
33
package-lock.json
generated
33
package-lock.json
generated
|
@ -11,8 +11,12 @@
|
|||
"@fontsource/material-icons": "^4.5.4",
|
||||
"@fontsource/roboto-mono": "^4.5.8",
|
||||
"@pixi/app": "~6.3.2",
|
||||
"@pixi/constants": "~6.3.2",
|
||||
"@pixi/core": "~6.3.2",
|
||||
"@pixi/particle-emitter": "^5.0.4",
|
||||
"@pixi/display": "~6.3.2",
|
||||
"@pixi/math": "~6.3.2",
|
||||
"@pixi/particle-emitter": "^5.0.7",
|
||||
"@pixi/sprite": "~6.3.2",
|
||||
"@pixi/ticker": "~6.3.2",
|
||||
"@vitejs/plugin-vue": "^2.3.3",
|
||||
"@vitejs/plugin-vue-jsx": "^1.3.10",
|
||||
|
@ -24,7 +28,7 @@
|
|||
"vite-tsconfig-paths": "^3.5.0",
|
||||
"vue": "^3.2.26",
|
||||
"vue-next-select": "^2.10.2",
|
||||
"vue-panzoom": "^1.1.6",
|
||||
"vue-panzoom": "https://github.com/thepaperpilot/vue-panzoom.git",
|
||||
"vue-textarea-autosize": "^1.1.1",
|
||||
"vue-toastification": "^2.0.0-rc.1",
|
||||
"vue-transition-expand": "^0.1.0",
|
||||
|
@ -1818,8 +1822,7 @@
|
|||
"node_modules/@pixi/constants": {
|
||||
"version": "6.3.2",
|
||||
"resolved": "https://registry.npmjs.org/@pixi/constants/-/constants-6.3.2.tgz",
|
||||
"integrity": "sha512-sUE8QEJNl4vWUybS0YqpVUBWoOyLkr5bSj1+3mpmbWJTMVmLB2voFXo7XpSNCBlLH1SBN5flcgJlUWOCgNyATg==",
|
||||
"peer": true
|
||||
"integrity": "sha512-sUE8QEJNl4vWUybS0YqpVUBWoOyLkr5bSj1+3mpmbWJTMVmLB2voFXo7XpSNCBlLH1SBN5flcgJlUWOCgNyATg=="
|
||||
},
|
||||
"node_modules/@pixi/core": {
|
||||
"version": "6.3.2",
|
||||
|
@ -1845,7 +1848,6 @@
|
|||
"version": "6.3.2",
|
||||
"resolved": "https://registry.npmjs.org/@pixi/display/-/display-6.3.2.tgz",
|
||||
"integrity": "sha512-D+WiM0BcyPK91RYxl7TXXVNz/5lOGs8Q6jtCMcWgTHwCXxWPOHFnNZ4KPJZpUQ7me8Tl2u+c9hfB5Oh1+17r/Q==",
|
||||
"peer": true,
|
||||
"peerDependencies": {
|
||||
"@pixi/math": "6.3.2",
|
||||
"@pixi/settings": "6.3.2",
|
||||
|
@ -1855,8 +1857,7 @@
|
|||
"node_modules/@pixi/math": {
|
||||
"version": "6.3.2",
|
||||
"resolved": "https://registry.npmjs.org/@pixi/math/-/math-6.3.2.tgz",
|
||||
"integrity": "sha512-REXrCKQaT2shJ3p2Rpq1ZYV4iUeAOUFKnLN2KteQWtB5HQpB8b+w5xBGI+TcnY0FUhx92fbKPYTTvCftNZF4Jw==",
|
||||
"peer": true
|
||||
"integrity": "sha512-REXrCKQaT2shJ3p2Rpq1ZYV4iUeAOUFKnLN2KteQWtB5HQpB8b+w5xBGI+TcnY0FUhx92fbKPYTTvCftNZF4Jw=="
|
||||
},
|
||||
"node_modules/@pixi/particle-emitter": {
|
||||
"version": "5.0.7",
|
||||
|
@ -1890,7 +1891,6 @@
|
|||
"version": "6.3.2",
|
||||
"resolved": "https://registry.npmjs.org/@pixi/sprite/-/sprite-6.3.2.tgz",
|
||||
"integrity": "sha512-T1KJ8l2f8Otn6Se6h4b2pz2nrUSe59Pnmj2WIzgBisM245h7dGATs05MisMaLV6Lg/3gTBTxsLBmKsbDSQqbNw==",
|
||||
"peer": true,
|
||||
"peerDependencies": {
|
||||
"@pixi/constants": "6.3.2",
|
||||
"@pixi/core": "6.3.2",
|
||||
|
@ -6726,8 +6726,8 @@
|
|||
},
|
||||
"node_modules/vue-panzoom": {
|
||||
"version": "1.1.6",
|
||||
"resolved": "https://registry.npmjs.org/vue-panzoom/-/vue-panzoom-1.1.6.tgz",
|
||||
"integrity": "sha512-yEE60C/gnc5NGL6YBD++CErD820va7fkBJE5dCWZZzXX2aMGklj/UKmtqu1u5xDkuOIjnGUr412LNHwOOE711w==",
|
||||
"resolved": "git+ssh://git@github.com/thepaperpilot/vue-panzoom.git#fa3cc91f6842cdfbd1bfb433c75cac01f177fe2d",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"panzoom": "^9.4.1"
|
||||
}
|
||||
|
@ -8442,8 +8442,7 @@
|
|||
"@pixi/constants": {
|
||||
"version": "6.3.2",
|
||||
"resolved": "https://registry.npmjs.org/@pixi/constants/-/constants-6.3.2.tgz",
|
||||
"integrity": "sha512-sUE8QEJNl4vWUybS0YqpVUBWoOyLkr5bSj1+3mpmbWJTMVmLB2voFXo7XpSNCBlLH1SBN5flcgJlUWOCgNyATg==",
|
||||
"peer": true
|
||||
"integrity": "sha512-sUE8QEJNl4vWUybS0YqpVUBWoOyLkr5bSj1+3mpmbWJTMVmLB2voFXo7XpSNCBlLH1SBN5flcgJlUWOCgNyATg=="
|
||||
},
|
||||
"@pixi/core": {
|
||||
"version": "6.3.2",
|
||||
|
@ -8457,14 +8456,12 @@
|
|||
"version": "6.3.2",
|
||||
"resolved": "https://registry.npmjs.org/@pixi/display/-/display-6.3.2.tgz",
|
||||
"integrity": "sha512-D+WiM0BcyPK91RYxl7TXXVNz/5lOGs8Q6jtCMcWgTHwCXxWPOHFnNZ4KPJZpUQ7me8Tl2u+c9hfB5Oh1+17r/Q==",
|
||||
"peer": true,
|
||||
"requires": {}
|
||||
},
|
||||
"@pixi/math": {
|
||||
"version": "6.3.2",
|
||||
"resolved": "https://registry.npmjs.org/@pixi/math/-/math-6.3.2.tgz",
|
||||
"integrity": "sha512-REXrCKQaT2shJ3p2Rpq1ZYV4iUeAOUFKnLN2KteQWtB5HQpB8b+w5xBGI+TcnY0FUhx92fbKPYTTvCftNZF4Jw==",
|
||||
"peer": true
|
||||
"integrity": "sha512-REXrCKQaT2shJ3p2Rpq1ZYV4iUeAOUFKnLN2KteQWtB5HQpB8b+w5xBGI+TcnY0FUhx92fbKPYTTvCftNZF4Jw=="
|
||||
},
|
||||
"@pixi/particle-emitter": {
|
||||
"version": "5.0.7",
|
||||
|
@ -8491,7 +8488,6 @@
|
|||
"version": "6.3.2",
|
||||
"resolved": "https://registry.npmjs.org/@pixi/sprite/-/sprite-6.3.2.tgz",
|
||||
"integrity": "sha512-T1KJ8l2f8Otn6Se6h4b2pz2nrUSe59Pnmj2WIzgBisM245h7dGATs05MisMaLV6Lg/3gTBTxsLBmKsbDSQqbNw==",
|
||||
"peer": true,
|
||||
"requires": {}
|
||||
},
|
||||
"@pixi/ticker": {
|
||||
|
@ -11866,9 +11862,8 @@
|
|||
"requires": {}
|
||||
},
|
||||
"vue-panzoom": {
|
||||
"version": "1.1.6",
|
||||
"resolved": "https://registry.npmjs.org/vue-panzoom/-/vue-panzoom-1.1.6.tgz",
|
||||
"integrity": "sha512-yEE60C/gnc5NGL6YBD++CErD820va7fkBJE5dCWZZzXX2aMGklj/UKmtqu1u5xDkuOIjnGUr412LNHwOOE711w==",
|
||||
"version": "git+ssh://git@github.com/thepaperpilot/vue-panzoom.git#fa3cc91f6842cdfbd1bfb433c75cac01f177fe2d",
|
||||
"from": "vue-panzoom@https://github.com/thepaperpilot/vue-panzoom.git",
|
||||
"requires": {
|
||||
"panzoom": "^9.4.1"
|
||||
}
|
||||
|
|
|
@ -56,6 +56,43 @@
|
|||
border-radius: var(--border-radius);
|
||||
}
|
||||
|
||||
.row-grid.mergeAdjacent > .feature:not(.dontMerge),
|
||||
.row-grid.mergeAdjacent > .tooltip-container > .feature:not(.dontMerge) {
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
margin-bottom: 0;
|
||||
margin-top: 0;
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
.row-grid.mergeAdjacent > .feature:not(.dontMerge):last-child,
|
||||
.row-grid.mergeAdjacent > .tooltip-container:last-child > .feature:not(.dontMerge) {
|
||||
border-radius: 0 0 0 0;
|
||||
}
|
||||
|
||||
|
||||
.row-grid.mergeAdjacent > .feature:not(.dontMerge):first-child,
|
||||
.row-grid.mergeAdjacent > .tooltip-container:first-child > .feature:not(.dontMerge) {
|
||||
border-radius: 0 0 0 0;
|
||||
}
|
||||
|
||||
.table-grid > .row-grid.mergeAdjacent:last-child > .feature:not(.dontMerge):first-child {
|
||||
border-radius: 0 0 0 var(--border-radius);
|
||||
}
|
||||
|
||||
.table-grid > .row-grid.mergeAdjacent:first-child > .feature:not(.dontMerge):last-child {
|
||||
border-radius: 0 var(--border-radius) 0 0;
|
||||
}
|
||||
|
||||
.table-grid > .row-grid.mergeAdjacent:first-child > .feature:not(.dontMerge):first-child {
|
||||
border-radius: var(--border-radius) 0 0 0;
|
||||
}
|
||||
|
||||
.table-grid > .row-grid.mergeAdjacent:last-child > .feature:not(.dontMerge):last-child {
|
||||
border-radius: 0 0 var(--border-radius) 0;
|
||||
}
|
||||
|
||||
|
||||
/*
|
||||
TODO how to implement mergeAdjacent for grids?
|
||||
.row.mergeAdjacent + .row.mergeAdjacent > .feature:not(.dontMerge) {
|
||||
|
|
|
@ -4,9 +4,9 @@
|
|||
:style="{
|
||||
visibility: unref(visibility) === Visibility.Hidden ? 'hidden' : undefined
|
||||
}"
|
||||
class="table"
|
||||
class="table-grid"
|
||||
>
|
||||
<div v-for="row in unref(rows)" class="row" :class="{ mergeAdjacent }" :key="row">
|
||||
<div v-for="row in unref(rows)" class="row-grid" :class="{ mergeAdjacent }" :key="row">
|
||||
<GridCell
|
||||
v-for="col in unref(cols)"
|
||||
:key="col"
|
||||
|
|
Loading…
Reference in a new issue