mirror of
https://github.com/sky-systems/sky_phone.git
synced 2026-08-28 17:01:18 +00:00
FIX - increase Sky settings row spacing
This commit is contained in:
@@ -109,11 +109,6 @@ button.sky-settings-row__frame:focus-visible {
|
||||
outline-offset: -2px;
|
||||
}
|
||||
|
||||
.sky-settings-row--toggle .sky-settings-row__frame {
|
||||
padding-top: var(--sky-space-1);
|
||||
padding-bottom: var(--sky-space-1);
|
||||
}
|
||||
|
||||
.sky-settings-row__leading,
|
||||
.sky-settings-row__accessory,
|
||||
.sky-settings-row__trailing {
|
||||
|
||||
@@ -1,14 +1,33 @@
|
||||
import { readFileSync } from 'node:fs'
|
||||
|
||||
import { createSSRApp, h } from 'vue'
|
||||
import { renderToString } from 'vue/server-renderer'
|
||||
import { describe, expect, it } from 'vitest'
|
||||
|
||||
import SkySettingsRow from '@/ui/settings/SkySettingsRow.vue'
|
||||
|
||||
const settingsStyles = readFileSync(
|
||||
new URL('../settings.css', import.meta.url),
|
||||
'utf8',
|
||||
)
|
||||
|
||||
async function renderRow(props: Record<string, unknown>): Promise<string> {
|
||||
return renderToString(createSSRApp(SkySettingsRow, props))
|
||||
}
|
||||
|
||||
describe('SkySettingsRow', () => {
|
||||
it('uses the regular row padding for toggles without compacting them', () => {
|
||||
expect(settingsStyles).toMatch(
|
||||
/\.sky-settings-row__frame,\s*\.sky-settings-range-row__frame\s*\{[^}]*padding:\s*8px 16px/s,
|
||||
)
|
||||
expect(settingsStyles).not.toMatch(
|
||||
/\.sky-settings-row--toggle\s+\.sky-settings-row__frame\s*\{[^}]*padding-(?:top|bottom):/s,
|
||||
)
|
||||
expect(settingsStyles).toMatch(
|
||||
/\.sky-settings-group--compact\s+\.sky-settings-row__frame,[^}]*padding-top:\s*6px;[^}]*padding-bottom:\s*6px/s,
|
||||
)
|
||||
})
|
||||
|
||||
it('renders navigation as a full-row button with value and chevron', async () => {
|
||||
const html = await renderRow({
|
||||
kind: 'navigation',
|
||||
|
||||
Reference in New Issue
Block a user