starred/sky_phone
1
0
Fork 0
mirror of https://github.com/sky-systems/sky_phone.git synced 2026-08-28 17:01:18 +00:00
Code Issues Packages Projects Releases Wiki Activity

FIX - unify VaultX sheet grabber

Browse Source 
Render the sheet gradient once on the panel so the transparent drag area joins the content without a background seam. Make the grabber an accessible close button while preserving swipe dismissal.
This commit is contained in:
smx.pusha
2026-08-18 13:46:40 +02:00
parent 667c83a3d4
commit 23ed75f8f3
2 changed files with 19 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/views/apps/CryptoApp.contract.test.ts
+3
View File
@@ -180,6 +180,9 @@ describe('VaultX crypto app contracts', () => {
expect(source).toContain('class="sheet-close"')
expect(source).toContain("v-if=\"sheet === 'trade' || sheet === 'send'\"")
expect(source).toContain('class="sheet-market-summary"')
expect(source).toContain('grabber-clickable')
expect(source).toContain('@grabberclick="closeSheet"')
expect(source).toContain('.crypto-app :deep(.sky-sheet__grabber::after)')
})
it('uses a wide close-free settlement form with composed fields', () => {
frontend/src/views/apps/CryptoApp.vue
+16 -10
View File
@@ -1618,8 +1618,11 @@ onUnmounted(() => {
<SkySheet
:opened="sheet !== null"
swipe-to-close
grabber-clickable
:grabber-label="phone.t('Common.close')"
@backdropclick="closeSheet"
@escape="closeSheet"
@grabberclick="closeSheet"
@swipeclose="closeSheet"
><div
v-if="sheet"
@@ -4065,16 +4068,6 @@ onUnmounted(() => {
max-height: calc(100% - var(--sky-safe-area-top) - 20px);
overflow-y: auto;
color: #f8fbfd;
background: #0d1219;
border: 1px solid rgba(255, 255, 255, 0.09);
border-bottom: 0;
border-radius: 28px 28px 0 0;
box-shadow: 0 -22px 70px rgba(0, 0, 0, 0.52);
}
.crypto-app :deep(.sky-sheet__grabber) {
background: rgba(255, 255, 255, 0.2);
}
.sheet {
background:
radial-gradient(
circle at 92% 0%,
@@ -4082,6 +4075,19 @@ onUnmounted(() => {
transparent 27%
),
#0d1219;
border: 1px solid rgba(255, 255, 255, 0.09);
border-bottom: 0;
border-radius: 28px 28px 0 0;
box-shadow: 0 -22px 70px rgba(0, 0, 0, 0.52);
}
.crypto-app :deep(.sky-sheet__grabber) {
background: transparent;
}
.crypto-app :deep(.sky-sheet__grabber::after) {
background: rgba(255, 255, 255, 0.2);
}
.sheet {
background: transparent;
}
.sheet-header,
.sheet-heading,