callstack / callstack/react-native-paper
Color Picker Popup Is Obscured On "Guides -> Theming -> Creating Dynamic Theme Colors" Documentation On Both v5 and v6
- 主要言語
- TypeScript
- スター
- 14.5k
- フォーク
- 2.2k
- 平均マージ
- 5日 23時間
- マージ済み PR(30日)
- 12
説明
### Current behaviour
Color picker popup is not fully shown. I can't fill the color manually because the input is obscured. This happens for primary, secondary, and tertiary color pickers. I don't know if this happens on another platform, but I'm currently using Firefox 155.0 at the time of writing.
### Expected behaviour
The color picker should be fully shown.
### How to reproduce?
1. Go to **React Native Paper** documentation site (v5 or v6).
2. Navigate to **Guides -> Theming -> Creating Dynamic Theme Colors**.
3. Scroll down to the custom theme builder / color picker section and click any color input.
### Preview
**Primary Color Picker**
**Secondary Color Picker**
**Tertiary Color Picker**
### What have you tried so far?
I was able to show the whole thing by changing the "div" element with "color-picker-popup" class, "position" style to "relative" instead of "absolute". But it also grows the parent "tr" element.
**Modified Element**
### Your Environment
| software | version
| --------------------- | -------
| ios | N/A
| android | N/A
| react-native | N/A
| react-native-paper | v5 / v6 (docs site)
| node | N/A
| npm or yarn | N/A
| expo sdk | N/A
| Firefox | 155.0
コントリビューションガイド
調査の方向性
React Native Paper の Guides → Theming → Creating Dynamic Theme Colors のドキュメントページから始め、カスタムテーマビルダーを調査します。特に、color-picker-popup クラスを使用している要素を確認してください。各カラーピッカーで Firefox 上の問題を再現し、その後、周囲のレイアウトを崩すことなく、ポップアップと手動のカラー入力が完全に表示されることを確認してください。
索引モデルが issue の本文から書いたものです。
評価
- 技術スタック
- react-native, typescript
- 領域
- documentation, frontend
- issue の種類
- バグ
- 難易度
- 2/5
- 見積もり時間
- 1〜3時間
- 活発さ
- 活発
- 明瞭さ
- おおむね明確
- 初心者へのやさしさ
- 68/100