microsoft
/
fluentui-react-native
зеркало из https://github.com/microsoft/fluentui-react-native.git
1
0
Форкнуть 0
Код Задачи Пакеты Проекты Релизы Вики Активность

RadioGroup Style Fixes 2.0 (#2740) 

* fixed radio variant and radio gap

* update screenshots

* Change files

* updated custom test radio button size

* Update CustomizedRadioGroup.tsx

* update snapshots
This commit is contained in:
Gulnaz Sayed 2023-03-30 09:46:15 -07:00 коммит произвёл GitHub
Родитель 066be5483c
Коммит 87e30e155a
Не найден ключ, соответствующий данной подписи
Идентификатор ключа GPG: 4AEE18F83AFDEB23
12 изменённых файлов: 51 добавлений и 43 удалений
Показать статистику Скачать Patch файл Скачать Diff файл Показать все файлы Свернуть все файлы

7
change/@fluentui-react-native-experimental-radio-group-4f77e469-1f0b-42cf-ac97-b2a772a15f3f.json Normal file
Просмотреть файл

@ -0,0 +1,7 @@
{
"type": "patch",
"comment": "fixed radio variant and radio gap",
"packageName": "@fluentui-react-native/experimental-radio-group",
"email": "gulnazsayed@microsoft.com",
"dependentChangeType": "patch"
}

Двоичные данные
packages/experimental/RadioGroup/assets/controlled_radiogroup.png
Просмотреть файл

Двоичный файл не отображается.
Режим "рядом" Свайп Оверлей

До

Ширина:  |  Высота:  |  Размер: 4.7 KiB

После

Ширина:  |  Высота:  |  Размер: 12 KiB

Двоичные данные
packages/experimental/RadioGroup/assets/disabled_item.png
Просмотреть файл

Двоичный файл не отображается.
Режим "рядом" Свайп Оверлей

До

Ширина:  |  Высота:  |  Размер: 6.0 KiB

После

Ширина:  |  Высота:  |  Размер: 12 KiB

Двоичные данные
packages/experimental/RadioGroup/assets/disabled_radiogroup.png
Просмотреть файл

Двоичный файл не отображается.
Режим "рядом" Свайп Оверлей

До

Ширина:  |  Высота:  |  Размер: 3.7 KiB

После

Ширина:  |  Высота:  |  Размер: 11 KiB

Двоичные данные
packages/experimental/RadioGroup/assets/horizontal_radiogroup.png
Просмотреть файл

Двоичный файл не отображается.
Режим "рядом" Свайп Оверлей

До

Ширина:  |  Высота:  |  Размер: 3.8 KiB

После

Ширина:  |  Высота:  |  Размер: 7.4 KiB

Двоичные данные
packages/experimental/RadioGroup/assets/horizontal_stacked_radiogroup.png
Просмотреть файл

Двоичный файл не отображается.
Режим "рядом" Свайп Оверлей

До

Ширина:  |  Высота:  |  Размер: 4.4 KiB

После

Ширина:  |  Высота:  |  Размер: 8.6 KiB

Двоичные данные
packages/experimental/RadioGroup/assets/required_radiogroup.png
Просмотреть файл

Двоичный файл не отображается.
Режим "рядом" Свайп Оверлей

До

Ширина:  |  Высота:  |  Размер: 4.7 KiB

После

Ширина:  |  Высота:  |  Размер: 12 KiB

Двоичные данные
packages/experimental/RadioGroup/assets/subtext_radiogroup.png
Просмотреть файл

Двоичный файл не отображается.
Режим "рядом" Свайп Оверлей

До

Ширина:  |  Высота:  |  Размер: 5.3 KiB

После

Ширина:  |  Высота:  |  Размер: 15 KiB

Двоичные данные
packages/experimental/RadioGroup/assets/uncontrolled_radiogroup.png
Просмотреть файл

Двоичный файл не отображается.
Режим "рядом" Свайп Оверлей

До

Ширина:  |  Высота:  |  Размер: 6.4 KiB

После

Ширина:  |  Высота:  |  Размер: 13 KiB

7
packages/experimental/RadioGroup/src/Radio/RadioTokens.win32.ts
Просмотреть файл

@ -13,21 +13,21 @@ export const defaultRadioTokens: TokenSettings<RadioTokens, Theme> = (t: Theme)
borderRadius: globalTokens.corner.radius40,
radioBorderWidth: globalTokens.stroke.width10,
radioVisibility: 0,
variant: 'subheaderStandard',
variant: 'body1',
radioBorderStyle: 'solid',
radioBorder: t.colors.neutralStrokeAccessible,
color: t.colors.neutralForeground1,
radioOuterCircleSize: globalTokens.size160,
radioInnerCircleSize: globalTokens.size80,
radioOuterCircleBackground: t.colors.neutralBackground1,
labelMarginVertical: globalTokens.size20,
labelMarginVertical: globalTokens.size40,
labelMarginRight: globalTokens.sizeNone,
labelMarginLeft: globalTokens.sizeNone,
subtextVariant: 'caption1',
subtextMarginTop: globalTokens.sizeNone,
subtextMarginBottom: globalTokens.size40 + 1,
marginTop: globalTokens.size60,
marginRight: globalTokens.size40,
marginRight: globalTokens.sizeNone,
marginBottom: globalTokens.size60,
marginLeft: globalTokens.size40,
flexDirection: 'row',
@ -43,6 +43,7 @@ export const defaultRadioTokens: TokenSettings<RadioTokens, Theme> = (t: Theme)
labelPadding: globalTokens.size20,
marginLeft: globalTokens.size60,
marginRight: globalTokens.size60,
marginBottom: globalTokens.sizeNone,
},
disabled: {

12
packages/experimental/RadioGroup/src/Radio/__snapshots__/RadioExperimental.test.tsx.snap
Просмотреть файл

@ -91,7 +91,7 @@ exports[`Radio component tests Radio default 1`] = `
"justifyContent": "center",
"marginBottom": 6,
"marginLeft": 4,
"marginRight": 4,
"marginRight": 0,
"marginTop": 6,
"width": 16,
}
@ -133,11 +133,11 @@ exports[`Radio component tests Radio default 1`] = `
Object {
"color": "#242424",
"fontFamily": "Segoe UI",
"fontSize": 16,
"fontSize": 12,
"fontWeight": "400",
"margin": 0,
"marginHorizontal": 2,
"marginVertical": 2,
"marginVertical": 4,
}
}
>
@ -243,7 +243,7 @@ exports[`Radio component tests Radio disabled 1`] = `
"justifyContent": "center",
"marginBottom": 6,
"marginLeft": 4,
"marginRight": 4,
"marginRight": 0,
"marginTop": 6,
"width": 16,
}
@ -285,11 +285,11 @@ exports[`Radio component tests Radio disabled 1`] = `
Object {
"color": "#bdbdbd",
"fontFamily": "Segoe UI",
"fontSize": 16,
"fontSize": 12,
"fontWeight": "400",
"margin": 0,
"marginHorizontal": 2,
"marginVertical": 2,
"marginVertical": 4,
}
}
>

68
packages/experimental/RadioGroup/src/RadioGroup/__snapshots__/RadioGroupExperimental.test.tsx.snap
Просмотреть файл

@ -150,7 +150,7 @@ exports[`RadioGroup component tests Radio not direct child of radio group 1`] =
"justifyContent": "center",
"marginBottom": 6,
"marginLeft": 4,
"marginRight": 4,
"marginRight": 0,
"marginTop": 6,
"width": 16,
}
@ -192,11 +192,11 @@ exports[`RadioGroup component tests Radio not direct child of radio group 1`] =
Object {
"color": "#242424",
"fontFamily": "Segoe UI",
"fontSize": 16,
"fontSize": 12,
"fontWeight": "400",
"margin": 0,
"marginHorizontal": 2,
"marginVertical": 2,
"marginVertical": 4,
}
}
>
@ -294,7 +294,7 @@ exports[`RadioGroup component tests Radio not direct child of radio group 1`] =
"justifyContent": "center",
"marginBottom": 6,
"marginLeft": 4,
"marginRight": 4,
"marginRight": 0,
"marginTop": 6,
"width": 16,
}
@ -336,11 +336,11 @@ exports[`RadioGroup component tests Radio not direct child of radio group 1`] =
Object {
"color": "#242424",
"fontFamily": "Segoe UI",
"fontSize": 16,
"fontSize": 12,
"fontWeight": "400",
"margin": 0,
"marginHorizontal": 2,
"marginVertical": 2,
"marginVertical": 4,
}
}
>
@ -503,7 +503,7 @@ exports[`RadioGroup component tests RadioGroup default 1`] = `
"justifyContent": "center",
"marginBottom": 6,
"marginLeft": 4,
"marginRight": 4,
"marginRight": 0,
"marginTop": 6,
"width": 16,
}
@ -545,11 +545,11 @@ exports[`RadioGroup component tests RadioGroup default 1`] = `
Object {
"color": "#242424",
"fontFamily": "Segoe UI",
"fontSize": 16,
"fontSize": 12,
"fontWeight": "400",
"margin": 0,
"marginHorizontal": 2,
"marginVertical": 2,
"marginVertical": 4,
}
}
>
@ -647,7 +647,7 @@ exports[`RadioGroup component tests RadioGroup default 1`] = `
"justifyContent": "center",
"marginBottom": 6,
"marginLeft": 4,
"marginRight": 4,
"marginRight": 0,
"marginTop": 6,
"width": 16,
}
@ -689,11 +689,11 @@ exports[`RadioGroup component tests RadioGroup default 1`] = `
Object {
"color": "#242424",
"fontFamily": "Segoe UI",
"fontSize": 16,
"fontSize": 12,
"fontWeight": "400",
"margin": 0,
"marginHorizontal": 2,
"marginVertical": 2,
"marginVertical": 4,
}
}
>
@ -861,7 +861,7 @@ exports[`RadioGroup component tests RadioGroup disabled 1`] = `
"justifyContent": "center",
"marginBottom": 6,
"marginLeft": 4,
"marginRight": 4,
"marginRight": 0,
"marginTop": 6,
"width": 16,
}
@ -903,11 +903,11 @@ exports[`RadioGroup component tests RadioGroup disabled 1`] = `
Object {
"color": "#bdbdbd",
"fontFamily": "Segoe UI",
"fontSize": 16,
"fontSize": 12,
"fontWeight": "400",
"margin": 0,
"marginHorizontal": 2,
"marginVertical": 2,
"marginVertical": 4,
}
}
>
@ -1010,7 +1010,7 @@ exports[`RadioGroup component tests RadioGroup disabled 1`] = `
"justifyContent": "center",
"marginBottom": 6,
"marginLeft": 4,
"marginRight": 4,
"marginRight": 0,
"marginTop": 6,
"width": 16,
}
@ -1052,11 +1052,11 @@ exports[`RadioGroup component tests RadioGroup disabled 1`] = `
Object {
"color": "#bdbdbd",
"fontFamily": "Segoe UI",
"fontSize": 16,
"fontSize": 12,
"fontWeight": "400",
"margin": 0,
"marginHorizontal": 2,
"marginVertical": 2,
"marginVertical": 4,
}
}
>
@ -1220,7 +1220,7 @@ exports[`RadioGroup component tests RadioGroup horizontal 1`] = `
"justifyContent": "center",
"marginBottom": 6,
"marginLeft": 4,
"marginRight": 4,
"marginRight": 0,
"marginTop": 6,
"width": 16,
}
@ -1262,11 +1262,11 @@ exports[`RadioGroup component tests RadioGroup horizontal 1`] = `
Object {
"color": "#242424",
"fontFamily": "Segoe UI",
"fontSize": 16,
"fontSize": 12,
"fontWeight": "400",
"margin": 0,
"marginHorizontal": 2,
"marginVertical": 2,
"marginVertical": 4,
}
}
>
@ -1364,7 +1364,7 @@ exports[`RadioGroup component tests RadioGroup horizontal 1`] = `
"justifyContent": "center",
"marginBottom": 6,
"marginLeft": 4,
"marginRight": 4,
"marginRight": 0,
"marginTop": 6,
"width": 16,
}
@ -1406,11 +1406,11 @@ exports[`RadioGroup component tests RadioGroup horizontal 1`] = `
Object {
"color": "#242424",
"fontFamily": "Segoe UI",
"fontSize": 16,
"fontSize": 12,
"fontWeight": "400",
"margin": 0,
"marginHorizontal": 2,
"marginVertical": 2,
"marginVertical": 4,
}
}
>
@ -1572,7 +1572,7 @@ exports[`RadioGroup component tests RadioGroup horizontal-stacked 1`] = `
"borderWidth": 1,
"height": 16,
"justifyContent": "center",
"marginBottom": 6,
"marginBottom": 0,
"marginLeft": 6,
"marginRight": 6,
"marginTop": 6,
@ -1616,7 +1616,7 @@ exports[`RadioGroup component tests RadioGroup horizontal-stacked 1`] = `
Object {
"color": "#242424",
"fontFamily": "Segoe UI",
"fontSize": 16,
"fontSize": 12,
"fontWeight": "400",
"margin": 0,
"marginHorizontal": 2,
@ -1716,7 +1716,7 @@ exports[`RadioGroup component tests RadioGroup horizontal-stacked 1`] = `
"borderWidth": 1,
"height": 16,
"justifyContent": "center",
"marginBottom": 6,
"marginBottom": 0,
"marginLeft": 6,
"marginRight": 6,
"marginTop": 6,
@ -1760,7 +1760,7 @@ exports[`RadioGroup component tests RadioGroup horizontal-stacked 1`] = `
Object {
"color": "#242424",
"fontFamily": "Segoe UI",
"fontSize": 16,
"fontSize": 12,
"fontWeight": "400",
"margin": 0,
"marginHorizontal": 2,
@ -1944,7 +1944,7 @@ exports[`RadioGroup component tests RadioGroup required 1`] = `
"justifyContent": "center",
"marginBottom": 6,
"marginLeft": 4,
"marginRight": 4,
"marginRight": 0,
"marginTop": 6,
"width": 16,
}
@ -1986,11 +1986,11 @@ exports[`RadioGroup component tests RadioGroup required 1`] = `
Object {
"color": "#242424",
"fontFamily": "Segoe UI",
"fontSize": 16,
"fontSize": 12,
"fontWeight": "400",
"margin": 0,
"marginHorizontal": 2,
"marginVertical": 2,
"marginVertical": 4,
}
}
>
@ -2088,7 +2088,7 @@ exports[`RadioGroup component tests RadioGroup required 1`] = `
"justifyContent": "center",
"marginBottom": 6,
"marginLeft": 4,
"marginRight": 4,
"marginRight": 0,
"marginTop": 6,
"width": 16,
}
@ -2130,11 +2130,11 @@ exports[`RadioGroup component tests RadioGroup required 1`] = `
Object {
"color": "#242424",
"fontFamily": "Segoe UI",
"fontSize": 16,
"fontSize": 12,
"fontWeight": "400",
"margin": 0,
"marginHorizontal": 2,
"marginVertical": 2,
"marginVertical": 4,
}
}
>