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

fix(youtube-bot): 토글 knob 위치를 X봇과 동일하게 (상하좌우 여백 균일)

Browse source 
knob을 mt-0.5 margin 방식 대신 absolute top-0.5 left-0.5로 위치 지정,
트랙에 relative 추가. 위아래가 잘려 보이던 문제 해결, 4개 토글 모두
X봇 다이얼로그와 동일한 비율로 통일.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
This commit is contained in:
caadiq 2026-06-07 18:35:30 +09:00
parent 468bf1f3a7
commit 3d5f1d8a66
1 changed files with 12 additions and 12 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

24
frontend/src/components/pc/admin/bot/YouTubeBotDialog.jsx
View file

@ -696,13 +696,13 @@ function YouTubeBotDialog({ isOpen, onClose, botId = null, onSuccess }) {
<p className="text-sm text-gray-500">매주 특정 요일에 임시 일정을 미리 생성합니다</p> <p className="text-sm text-gray-500">매주 특정 요일에 임시 일정을 미리 생성합니다</p>
</div> </div>
<div <div
className={`w-11 h-6 rounded-full transition-colors ${ className={`relative w-11 h-6 rounded-full transition-colors ${
autoScheduleEnabled ? 'bg-red-500' : 'bg-gray-200' autoScheduleEnabled ? 'bg-red-500' : 'bg-gray-200'
}`} }`}
> >
<div <div
className={`w-5 h-5 bg-white rounded-full shadow-sm transform transition-transform mt-0.5 ${ className={`w-5 h-5 absolute top-0.5 left-0.5 bg-white rounded-full shadow transition-transform ${
autoScheduleEnabled ? 'translate-x-5' : 'translate-x-0.5' autoScheduleEnabled ? 'translate-x-5' : ''
}`} }`}
/> />
</div> </div>
@ -773,13 +773,13 @@ function YouTubeBotDialog({ isOpen, onClose, botId = null, onSuccess }) {
</p> </p>
</div> </div>
<div <div
className={`flex-shrink-0 w-11 h-6 rounded-full transition-colors ${ className={`flex-shrink-0 relative w-11 h-6 rounded-full transition-colors ${
includeDefaultMembers ? 'bg-red-500' : 'bg-gray-200' includeDefaultMembers ? 'bg-red-500' : 'bg-gray-200'
}`} }`}
> >
<div <div
className={`w-5 h-5 bg-white rounded-full shadow-sm transform transition-transform mt-0.5 ${ className={`w-5 h-5 absolute top-0.5 left-0.5 bg-white rounded-full shadow transition-transform ${
includeDefaultMembers ? 'translate-x-5' : 'translate-x-0.5' includeDefaultMembers ? 'translate-x-5' : ''
}`} }`}
/> />
</div> </div>
@ -870,13 +870,13 @@ function YouTubeBotDialog({ isOpen, onClose, botId = null, onSuccess }) {
<p className="text-xs text-gray-500">영상 설명에서 멤버 이름을 찾아 자동 연결</p> <p className="text-xs text-gray-500">영상 설명에서 멤버 이름을 찾아 자동 연결</p>
</div> </div>
<div <div
className={`w-10 h-5 rounded-full transition-colors ${ className={`relative w-10 h-5 rounded-full transition-colors ${
extractMembers ? 'bg-red-500' : 'bg-gray-200' extractMembers ? 'bg-red-500' : 'bg-gray-200'
}`} }`}
> >
<div <div
className={`w-4 h-4 bg-white rounded-full shadow-sm transform transition-transform mt-0.5 ${ className={`w-4 h-4 absolute top-0.5 left-0.5 bg-white rounded-full shadow transition-transform ${
extractMembers ? 'translate-x-5' : 'translate-x-0.5' extractMembers ? 'translate-x-5' : ''
}`} }`}
/> />
</div> </div>
@ -892,13 +892,13 @@ function YouTubeBotDialog({ isOpen, onClose, botId = null, onSuccess }) {
<p className="text-xs text-gray-500">영상 제목에서 멤버 이름을 찾아 자동 연결</p> <p className="text-xs text-gray-500">영상 제목에서 멤버 이름을 찾아 자동 연결</p>
</div> </div>
<div <div
className={`w-10 h-5 rounded-full transition-colors ${ className={`relative w-10 h-5 rounded-full transition-colors ${
extractMembersFromTitle ? 'bg-red-500' : 'bg-gray-200' extractMembersFromTitle ? 'bg-red-500' : 'bg-gray-200'
}`} }`}
> >
<div <div
className={`w-4 h-4 bg-white rounded-full shadow-sm transform transition-transform mt-0.5 ${ className={`w-4 h-4 absolute top-0.5 left-0.5 bg-white rounded-full shadow transition-transform ${
extractMembersFromTitle ? 'translate-x-5' : 'translate-x-0.5' extractMembersFromTitle ? 'translate-x-5' : ''
}`} }`}
/> />
</div> </div>