caadiq/maplestory
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

비활성 요소의 금지 커서 제거

Browse source 
index.css 의 전역 button:disabled { cursor: not-allowed } 규칙과 개별
컴포넌트의 disabled:cursor-not-allowed / cursor-not-allowed 클래스를 모두
제거해 비활성 상태에서 기본 화살표 커서를 유지한다. opacity 등 기존 시각
피드백은 유지.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
caadiq 2026-04-20 17:59:19 +09:00
parent edbaaf09aa
commit dc48f57501
11 changed files with 12 additions and 16 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
frontend/src/components/common/Checkbox.jsx
View file

@ -15,7 +15,7 @@ export default function Checkbox({ checked, onChange, disabled, className = '',
tabIndex={tabIndex}
onClick={(e) => { e.stopPropagation(); !disabled && onChange?.(!checked) }}
className={`${sizeCls} shrink-0 rounded-md border-2 flex items-center justify-center ${
disabled ? 'opacity-40 cursor-not-allowed' : 'cursor-pointer'
disabled ? 'opacity-40' : 'cursor-pointer'
} ${className}`}
style={checked ? {
borderColor: 'var(--accent)',

2
frontend/src/components/common/DatePicker.jsx
View file

@ -135,7 +135,7 @@ export default function DatePicker({ value, onChange, placeholder = '날짜 선
type="button"
onClick={(e) => stop(e, viewMode === 'years' ? prevYearRange : prevMonth)}
disabled={viewMode === 'years' ? !canGoPrevYearRange : (year === minYear && month === 0)}
className="p-1.5 rounded hover:bg-[var(--row-hover-bg)] disabled:opacity-30 disabled:cursor-not-allowed"
className="p-1.5 rounded hover:bg-[var(--row-hover-bg)] disabled:opacity-30"
style={{ color: 'var(--text-muted)' }}
>
<ChevronIcon dir="left" size={18} />

2
frontend/src/features/admin/pc/AdminImages.jsx
View file

@ -152,7 +152,7 @@ export default function AdminImages() {
<button
onClick={requestDelete}
disabled={selectedIds.size === 0}
className="rounded-lg px-3 py-2 text-sm font-medium disabled:opacity-50 disabled:cursor-not-allowed hover:bg-[var(--btn-danger-bg-hover)]"
className="rounded-lg px-3 py-2 text-sm font-medium disabled:opacity-50 hover:bg-[var(--btn-danger-bg-hover)]"
style={{
background: 'var(--btn-danger-bg)',
color: 'var(--btn-primary-text)',

4
frontend/src/features/admin/pc/components/ImagePicker.jsx
View file

@ -172,7 +172,7 @@ export default function ImagePicker({ open, onClose, onSelect, currentImageId })
<button
onClick={() => setPage((p) => Math.max(1, p - 1))}
disabled={page === 1}
className="w-8 h-8 rounded border hover:bg-[var(--btn-bg-hover)] disabled:opacity-30 disabled:cursor-not-allowed flex items-center justify-center text-sm"
className="w-8 h-8 rounded border hover:bg-[var(--btn-bg-hover)] disabled:opacity-30 flex items-center justify-center text-sm"
style={{
background: 'var(--btn-bg)',
borderColor: 'var(--btn-border)',
@ -185,7 +185,7 @@ export default function ImagePicker({ open, onClose, onSelect, currentImageId })
<button
onClick={() => setPage((p) => Math.min(totalPages, p + 1))}
disabled={page === totalPages}
className="w-8 h-8 rounded border hover:bg-[var(--btn-bg-hover)] disabled:opacity-30 disabled:cursor-not-allowed flex items-center justify-center text-sm"
className="w-8 h-8 rounded border hover:bg-[var(--btn-bg-hover)] disabled:opacity-30 flex items-center justify-center text-sm"
style={{
background: 'var(--btn-bg)',
borderColor: 'var(--btn-border)',

4
frontend/src/features/admin/pc/components/Pagination.jsx
View file

@ -20,7 +20,7 @@ export default function Pagination({ page, totalPages, onChange }) {
<button
onClick={() => onChange(page - 1)}
disabled={page === 1}
className={`${baseBtn} disabled:opacity-30 disabled:cursor-not-allowed`}
className={`${baseBtn} disabled:opacity-30`}
style={btnStyle}
>
‹
@ -61,7 +61,7 @@ export default function Pagination({ page, totalPages, onChange }) {
<button
onClick={() => onChange(page + 1)}
disabled={page === totalPages}
className={`${baseBtn} disabled:opacity-30 disabled:cursor-not-allowed`}
className={`${baseBtn} disabled:opacity-30`}
style={btnStyle}
>
›

2
frontend/src/features/admin/pc/components/UploadModal.jsx
View file

@ -163,7 +163,7 @@ export default function UploadModal({ open, onClose, onUpload, uploading, existi
<button
type="submit"
disabled={!canSubmit || uploading}
className="flex-1 rounded-lg px-4 py-2 text-sm font-medium disabled:opacity-50 disabled:cursor-not-allowed hover:bg-[var(--btn-primary-bg-hover)]"
className="flex-1 rounded-lg px-4 py-2 text-sm font-medium disabled:opacity-50 hover:bg-[var(--btn-primary-bg-hover)]"
style={{
background: 'var(--btn-primary-bg)',
color: 'var(--btn-primary-text)',

2
frontend/src/features/boss-crystal/pc/admin/BossForm.jsx
View file

@ -283,7 +283,7 @@ export default function BossForm() {
}}
disabled={!v.enabled}
placeholder="결정 가격"
className="w-full rounded-lg border pl-4 pr-28 py-2 text-sm outline-none focus:border-[var(--input-border-focus)] disabled:opacity-50 disabled:cursor-not-allowed"
className="w-full rounded-lg border pl-4 pr-28 py-2 text-sm outline-none focus:border-[var(--input-border-focus)] disabled:opacity-50"
style={{
background: 'var(--input-bg)',
borderColor: priceErr ? 'var(--icon-danger-border)' : 'var(--input-border)',

2
frontend/src/features/liberation/pc/components/WeeklyDefault.jsx
View file

@ -61,7 +61,7 @@ export function BossRow({ boss, sel, onChange, monthly = false, showDone = true
type="button"
disabled={disabled}
onClick={() => onChange({ done: !sel.done })}
className="shrink-0 w-20 rounded-md h-8 text-xs font-semibold border disabled:cursor-not-allowed"
className="shrink-0 w-20 rounded-md h-8 text-xs font-semibold border"
style={disabled ? {
borderColor: 'var(--panel-border)',
color: 'var(--text-dim)',

2
frontend/src/features/liberation/pc/components/WeeklyScheduler.jsx
View file

@ -250,7 +250,7 @@ export default function WeeklyScheduler({ startDate, weeks: weeksProp, onChangeW
onClick={() => removeWeek(w.id)}
disabled={weeks.length <= 1}
title={weeks.length <= 1 ? '최소 한 주차는 유지되어야 합니다' : '이 주차 삭제'}
className="shrink-0 w-8 h-8 rounded-md hover:bg-[var(--danger-bg-hover)] hover:text-[var(--danger-text)] disabled:opacity-30 disabled:hover:bg-transparent disabled:cursor-not-allowed flex items-center justify-center"
className="shrink-0 w-8 h-8 rounded-md hover:bg-[var(--danger-bg-hover)] hover:text-[var(--danger-text)] disabled:opacity-30 disabled:hover:bg-transparent flex items-center justify-center"
style={{ color: 'var(--text-dim)' }}
>
<svg width="14" height="14" viewBox="0 0 14 14" fill="none">

2
frontend/src/features/symbol/pc/user/SymbolCard.jsx
View file

@ -119,7 +119,7 @@ function SymbolCard({ symbol, equipped, charId }) {
type="button"
onClick={() => patch({ dailyDone: !dailyDone })}
title="오늘 일퀘 완료 여부"
className="shrink-0 rounded-md h-8 px-3 text-xs font-semibold border disabled:opacity-40 disabled:cursor-not-allowed"
className="shrink-0 rounded-md h-8 px-3 text-xs font-semibold border disabled:opacity-40"
style={dailyDone ? {
background: 'var(--selected-bg)',
borderColor: 'var(--selected-border)',

4
frontend/src/index.css
View file

@ -354,10 +354,6 @@ a {
cursor: pointer;
}
button:disabled {
cursor: not-allowed;
}
/* number input 화살표 숨기기 */
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {