fix(workbench): stretch profile tag card
This commit is contained in:
@@ -136,18 +136,19 @@ watch([() => props.visible, tagIdentity], ([visible]) => {
|
||||
|
||||
<style scoped>
|
||||
.profile-tag-pager {
|
||||
height: 100%;
|
||||
min-height: 308px;
|
||||
display: grid;
|
||||
grid-template-rows: 272px 26px;
|
||||
grid-template-rows: minmax(0, 1fr) 26px;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.profile-tag-list {
|
||||
display: grid;
|
||||
grid-template-rows: repeat(5, 48px);
|
||||
align-content: start;
|
||||
grid-template-rows: repeat(5, minmax(48px, 1fr));
|
||||
align-content: stretch;
|
||||
gap: 8px;
|
||||
min-height: 272px;
|
||||
min-height: 0;
|
||||
animation: profileTagPageIn 180ms cubic-bezier(0.2, 0, 0, 1) both;
|
||||
}
|
||||
|
||||
@@ -159,7 +160,7 @@ watch([() => props.visible, tagIdentity], ([visible]) => {
|
||||
grid-template-columns: minmax(0, 1fr) auto;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
min-height: 48px;
|
||||
min-height: 0;
|
||||
padding: 7px 10px;
|
||||
border: 1px solid rgba(var(--tag-accent-rgb), 0.2);
|
||||
border-left: 3px solid rgb(var(--tag-accent-rgb));
|
||||
|
||||
16
web/tests/expense-profile-tag-pager.test.mjs
Normal file
16
web/tests/expense-profile-tag-pager.test.mjs
Normal file
@@ -0,0 +1,16 @@
|
||||
import assert from 'node:assert/strict'
|
||||
import { readFileSync } from 'node:fs'
|
||||
import test from 'node:test'
|
||||
import { fileURLToPath } from 'node:url'
|
||||
|
||||
const pager = readFileSync(
|
||||
fileURLToPath(new URL('../src/components/business/ExpenseProfileTagPager.vue', import.meta.url)),
|
||||
'utf8'
|
||||
)
|
||||
|
||||
test('profile tag pager stretches tag rows to the bottom of the card', () => {
|
||||
assert.match(pager, /\.profile-tag-pager\s*\{[\s\S]*height:\s*100%;/)
|
||||
assert.match(pager, /\.profile-tag-pager\s*\{[\s\S]*grid-template-rows:\s*minmax\(0,\s*1fr\) 26px;/)
|
||||
assert.match(pager, /\.profile-tag-list\s*\{[\s\S]*grid-template-rows:\s*repeat\(5,\s*minmax\(48px,\s*1fr\)\);/)
|
||||
assert.match(pager, /\.profile-tag-list\s*\{[\s\S]*align-content:\s*stretch;/)
|
||||
})
|
||||
Reference in New Issue
Block a user