sytle: number input / tab viewer (#208)

* style(scoring-tab): revert width back to 6 digit length

* style(tabs): left allign desktop view
This commit is contained in:
Samuel Chau
2025-06-18 07:06:50 +09:30
committed by GitHub
parent 5281752269
commit affb9cbf1f
4 changed files with 7 additions and 2 deletions

View File

@@ -71,6 +71,7 @@ const AdvancedView = ({formats, onScoreChange, onFormatRemove, showRemoveButton}
onChange={value => onChange={value =>
onScoreChange(format.id, value) onScoreChange(format.id, value)
} }
className="w-24"
/> />
{showRemoveButton && ( {showRemoveButton && (
<button <button

View File

@@ -55,6 +55,7 @@ const BasicView = ({formats, onScoreChange, onFormatRemove, showRemoveButton}) =
onChange={value => onChange={value =>
onScoreChange(format.id, value) onScoreChange(format.id, value)
} }
className="w-24"
/> />
{showRemoveButton && ( {showRemoveButton && (
<button <button

View File

@@ -27,6 +27,7 @@ const UpgradeSettings = ({
<NumberInput <NumberInput
value={minCustomFormatScore} value={minCustomFormatScore}
onChange={onMinScoreChange} onChange={onMinScoreChange}
className="w-20"
/> />
</div> </div>
@@ -49,6 +50,7 @@ const UpgradeSettings = ({
value={upgradeUntilScore} value={upgradeUntilScore}
onChange={onUpgradeUntilScoreChange} onChange={onUpgradeUntilScoreChange}
min={0} min={0}
className="w-20"
/> />
</div> </div>
@@ -68,6 +70,7 @@ const UpgradeSettings = ({
value={minScoreIncrement} value={minScoreIncrement}
onChange={onMinIncrementChange} onChange={onMinIncrementChange}
min={0} min={0}
className="w-20"
/> />
</div> </div>
</> </>

View File

@@ -140,7 +140,7 @@ const Modal = ({
{title} {title}
</h3> </h3>
{tabs && ( {tabs && (
<div className='ml-auto mr-3'> <div className='ml-auto mr-3 md:ml-4 md:mr-auto'>
<TabViewer <TabViewer
tabs={tabs} tabs={tabs}
activeTab={activeTab} activeTab={activeTab}
@@ -150,7 +150,7 @@ const Modal = ({
)} )}
<button <button
onClick={handleClose} onClick={handleClose}
className={`${tabs ? '' : 'ml-auto'} text-gray-600 dark:text-gray-300 hover:text-gray-900 dark:hover:text-white transition-colors`}> className='text-gray-600 dark:text-gray-300 hover:text-gray-900 dark:hover:text-white transition-colors'>
<svg <svg
className='w-6 h-6' className='w-6 h-6'
fill='none' fill='none'