+
{sessionData.map((_, index) => (
{
screen.getByRole('button', { name: '深煎り' }),
].forEach((chip) => {
expect(chip).toHaveClass('!min-h-[40px]');
- expect(chip).toHaveClass('!rounded-lg');
- expect(chip).toHaveClass('!py-2');
+ expect(chip).toHaveClass('rounded-lg!');
+ expect(chip).toHaveClass('py-2!');
});
[
@@ -85,7 +85,7 @@ describe('TastingSessionFilterModal', () => {
screen.getByRole('button', { name: '古い順' }),
screen.getByRole('button', { name: '名前順' }),
].forEach((row) => {
- expect(row).toHaveClass('!rounded-lg');
+ expect(row).toHaveClass('rounded-lg!');
expect(row).toHaveClass('!justify-start');
});
});
@@ -148,8 +148,8 @@ describe('TastingSessionFilterModal', () => {
inputs.forEach((input) => {
expect(input).toHaveClass('!min-h-[40px]');
- expect(input).toHaveClass('!rounded-lg');
- expect(input).toHaveClass('!text-sm');
+ expect(input).toHaveClass('rounded-lg!');
+ expect(input).toHaveClass('text-sm!');
});
});
});
diff --git a/components/TastingSessionFilterModal.tsx b/components/TastingSessionFilterModal.tsx
index 986da832..3f6e6ee3 100644
--- a/components/TastingSessionFilterModal.tsx
+++ b/components/TastingSessionFilterModal.tsx
@@ -13,7 +13,7 @@ import {
type SortOption = 'newest' | 'oldest' | 'beanName';
-const inputControlClassName = '!min-h-[40px] !rounded-lg !py-2 !text-sm';
+const inputControlClassName = '!min-h-[40px] rounded-lg! py-2! text-sm!';
interface TastingSessionFilterModalProps {
isOpen: boolean;
onClose: () => void;
@@ -120,7 +120,7 @@ export function TastingSessionFilterModal({
size="sm"
type="button"
onClick={handleReset}
- className="!min-h-0 !px-0 !py-0 !rounded-none !text-xs !font-semibold !text-spot underline underline-offset-2 hover:!text-spot-hover"
+ className="min-h-0! !px-0 !py-0 !rounded-none !text-xs !font-semibold !text-spot underline underline-offset-2 hover:!text-spot-hover"
>
リセット
@@ -128,10 +128,10 @@ export function TastingSessionFilterModal({
}
footer={
<>
-
diff --git a/components/Toast.tsx b/components/Toast.tsx
index dfa7e46f..9cd4c4c0 100644
--- a/components/Toast.tsx
+++ b/components/Toast.tsx
@@ -79,13 +79,13 @@ function ToastItem({ toast, onClose }: { toast: ToastType; onClose: () => void }
className={`w-full sm:w-auto sm:min-w-[300px] sm:max-w-[420px] rounded-lg border border-edge border-l-4 bg-surface shadow-card px-4 py-3 flex items-start gap-3 pointer-events-auto animate-in slide-in-from-bottom-2 sm:slide-in-from-right-4 fade-in duration-200 ${styles.border}`}
role="alert"
>
-
{getIcon()}
+
{getIcon()}
{toast.message}
diff --git a/components/TodaySchedule.tsx b/components/TodaySchedule.tsx
index 8525689a..a30cd411 100644
--- a/components/TodaySchedule.tsx
+++ b/components/TodaySchedule.tsx
@@ -126,7 +126,7 @@ function TodayScheduleInner({ data, onUpdate, selectedDate, currentSchedule, onC
onHourChange={handleHourInputChange}
onMinuteChange={handleMinuteInputChange}
onAdd={addTimeLabel}
- wrapperClassName="flex items-center gap-1.5 md:gap-2 flex-shrink-0"
+ wrapperClassName="flex items-center gap-1.5 md:gap-2 shrink-0"
/>
@@ -145,7 +145,7 @@ function TodayScheduleInner({ data, onUpdate, selectedDate, currentSchedule, onC
{/* 時間表示 */}
handleEditGroup(group.time)}
- className="flex-shrink-0 w-16 md:w-18 text-center px-2 py-1 rounded-lg text-sm md:text-base font-semibold cursor-pointer transition-colors tabular-nums shadow-sm bg-surface text-ink border border-edge group-hover:border-header-bg/40 group-hover:text-header-bg"
+ className="shrink-0 w-16 md:w-18 text-center px-2 py-1 rounded-lg text-sm md:text-base font-semibold cursor-pointer transition-colors tabular-nums shadow-sm bg-surface text-ink border border-edge group-hover:border-header-bg/40 group-hover:text-header-bg"
>
{group.time || '--:--'}
@@ -183,7 +183,7 @@ function TodayScheduleInner({ data, onUpdate, selectedDate, currentSchedule, onC
{label.assignee && (
-
+
{label.assignee}
diff --git a/components/camera-capture/CameraCapture.tsx b/components/camera-capture/CameraCapture.tsx
index f8b5d78c..b1640425 100644
--- a/components/camera-capture/CameraCapture.tsx
+++ b/components/camera-capture/CameraCapture.tsx
@@ -73,7 +73,7 @@ export function CameraCapture({ onCapture, onCancel }: CameraCaptureProps) {
onClick={capturePhoto}
disabled={!canCapture}
rounded
- className={`w-20 h-20 bg-white border-4 border-gray-300 min-h-[80px] min-w-[80px] ${
+ className={`w-20 h-20 bg-white border-4 border-gray-300 min-h-20 min-w-20 ${
canCapture ? 'hover:bg-gray-100' : ''
}`}
aria-label="撮影"
diff --git a/components/camera-capture/CameraPreview.tsx b/components/camera-capture/CameraPreview.tsx
index 850db44e..c4aa976c 100644
--- a/components/camera-capture/CameraPreview.tsx
+++ b/components/camera-capture/CameraPreview.tsx
@@ -83,7 +83,7 @@ export function CameraPreview({
{/* 中央の縦長エリア */}
-
+
{/* 縦長の枠線 */}
{/* 角のマーカー */}
diff --git a/components/clock/ClockHeaderNav.tsx b/components/clock/ClockHeaderNav.tsx
index bf385ed9..a858b82b 100644
--- a/components/clock/ClockHeaderNav.tsx
+++ b/components/clock/ClockHeaderNav.tsx
@@ -20,7 +20,7 @@ interface ClockHeaderNavProps {
*/
export function ClockHeaderNav({ colors, onOpenChimeSchedule, onOpenSettings }: ClockHeaderNavProps) {
// 規約 local/no-raw-button に従い Button を使用。色はテーマ追従のためインラインstyleで上書き。
- const pillClassName = 'gap-2 !rounded-full !px-3.5 active:scale-95';
+ const pillClassName = 'gap-2 rounded-full! px-3.5! active:scale-95';
const pillStyle = { backgroundColor: colors.uiBg, color: colors.uiText };
return (
diff --git a/components/clock/ClockSettingsModal.tsx b/components/clock/ClockSettingsModal.tsx
index afc1d132..a55e5f8d 100644
--- a/components/clock/ClockSettingsModal.tsx
+++ b/components/clock/ClockSettingsModal.tsx
@@ -77,7 +77,7 @@ export function ClockSettingsModal({
onClick={() => onUpdate({ theme: key })}
variant="ghost"
size="sm"
- className="flex flex-col items-center gap-1.5 min-w-[52px] !p-1 !min-h-0 !min-w-0 h-auto"
+ className="flex flex-col items-center gap-1.5 min-w-13 p-1! min-h-0! min-w-0! h-auto"
aria-label={`テーマ: ${theme.label}`}
>
onUpdate({ fontKey: key })}
variant="ghost"
size="sm"
- className="flex items-center justify-between px-4 py-3 !rounded-xl text-left !min-h-0 w-full !font-normal"
+ className="flex items-center justify-between px-4 py-3 rounded-xl! text-left min-h-0! w-full font-normal!"
style={{
backgroundColor: isSelected ? `${themeColors.accent}18` : themeColors.uiBg,
borderWidth: '1.5px',
@@ -198,19 +198,19 @@ export function ClockSettingsModal({
表示オプション
-
+
24時間表示
onUpdate({ use24Hour: e.target.checked })} />
-
+
秒を表示
onUpdate({ showSeconds: e.target.checked })} />
-
+
日付を表示
@@ -223,7 +223,7 @@ export function ClockSettingsModal({
作業チャイム
-
+
作業チャイム
@@ -240,7 +240,7 @@ export function ClockSettingsModal({
{workChimeSettings.enabled && (
<>
-
+
音を鳴らす
@@ -254,7 +254,7 @@ export function ClockSettingsModal({
{workChimeSettings.soundEnabled && (
-
+
チャイム音
@@ -274,7 +274,7 @@ export function ClockSettingsModal({
variant="primary"
size="sm"
onClick={onEnableWorkChimeAudio}
- className="!px-3"
+ className="px-3!"
style={{
backgroundColor: themeColors.accent,
color: themeColors.bg,
@@ -305,7 +305,7 @@ export function ClockSettingsModal({
size="sm"
onClick={() => onTestWorkChime('break')}
aria-label="休憩開始をテスト"
- className="w-full !px-3"
+ className="w-full px-3!"
>
休憩開始
@@ -315,7 +315,7 @@ export function ClockSettingsModal({
size="sm"
onClick={() => onTestWorkChime('work-start')}
aria-label="作業開始をテスト"
- className="w-full !px-3"
+ className="w-full px-3!"
>
作業開始
@@ -325,14 +325,14 @@ export function ClockSettingsModal({
size="sm"
onClick={() => onTestWorkChime('cleanup-start')}
aria-label="掃除開始をテスト"
- className="w-full !px-3"
+ className="w-full px-3!"
>
掃除開始
-
+
音声アナウンス（未実装）
diff --git a/components/clock/NextChimeStrip.tsx b/components/clock/NextChimeStrip.tsx
index bd2b0402..6364a5eb 100644
--- a/components/clock/NextChimeStrip.tsx
+++ b/components/clock/NextChimeStrip.tsx
@@ -14,7 +14,7 @@ export function NextChimeStrip({ currentPeriod, nextChime, colors }: NextChimeSt
return (
updatePeriod(period.id, { kind: 'work' })}
- className="!min-h-[36px] !rounded-md !border !px-4 transition-colors"
+ className="min-h-9! rounded-md! border! px-4! transition-colors"
style={getKindButtonStyle('work', period.kind)}
>
作業
@@ -135,7 +135,7 @@ export function WorkChimeScheduleModal({ show, settings, onUpdate, onClose }: Wo
variant="ghost"
size="sm"
onClick={() => updatePeriod(period.id, { kind: 'break' })}
- className="!min-h-[36px] !rounded-md !border !px-4 transition-colors"
+ className="min-h-9! rounded-md! border! px-4! transition-colors"
style={getKindButtonStyle('break', period.kind)}
>
休憩
@@ -145,7 +145,7 @@ export function WorkChimeScheduleModal({ show, settings, onUpdate, onClose }: Wo
variant="ghost"
size="sm"
onClick={() => updatePeriod(period.id, { kind: 'cleanup' })}
- className="!min-h-[36px] !rounded-md !border !px-4 transition-colors"
+ className="min-h-9! rounded-md! border! px-4! transition-colors"
style={getKindButtonStyle('cleanup', period.kind)}
>
掃除
@@ -170,7 +170,7 @@ export function WorkChimeScheduleModal({ show, settings, onUpdate, onClose }: Wo
type="time"
value={period.start}
onChange={(e) => updatePeriod(period.id, { start: e.target.value })}
- className="!px-3 !py-2 !text-base"
+ className="px-3! py-2! text-base!"
/>
-
updatePeriod(period.id, { end: e.target.value })}
- className="!px-3 !py-2 !text-base"
+ className="px-3! py-2! text-base!"
/>
@@ -186,7 +186,7 @@ export function WorkChimeScheduleModal({ show, settings, onUpdate, onClose }: Wo
-
@@ -185,7 +185,7 @@ export const RecipeList: React.FC
= ({ recipes, onDelete }) =>
variant="primary"
fullWidth
onClick={() => handleOpenStart(recipe.id)}
- className={clsx('mt-auto gap-2 !rounded-lg active:scale-[0.98] touch-manipulation')}
+ className={clsx('mt-auto gap-2 rounded-lg! active:scale-[0.98] touch-manipulation')}
>
ガイド開始
diff --git a/components/drip-guide/Start46Dialog.tsx b/components/drip-guide/Start46Dialog.tsx
index 2d7bafdd..78b9bc14 100644
--- a/components/drip-guide/Start46Dialog.tsx
+++ b/components/drip-guide/Start46Dialog.tsx
@@ -113,14 +113,14 @@ export const Start46Dialog: React.FC = ({ isOpen, onClose, i