0
0
mirror of https://github.com/naturalcrit/homebrewery.git synced 2026-01-06 16:32:40 +00:00

dynamic input width

This commit is contained in:
Víctor Losada Hernández
2024-10-11 00:32:28 +02:00
parent 2118142faa
commit 3e6884b506
2 changed files with 4 additions and 3 deletions

View File

@@ -139,6 +139,7 @@ const ToolBar = ({ onZoomChange, currentPage, onPageChange, totalPages })=>{
name='page' name='page'
inputMode='numeric' inputMode='numeric'
pattern='[0-9]' pattern='[0-9]'
style={{width:`${pageNum.toString().length + 2}ch`}}
value={pageNum} value={pageNum}
onClick={(e)=>e.target.select()} onClick={(e)=>e.target.select()}
onChange={(e)=>handlePageInput(e.target.value)} onChange={(e)=>handlePageInput(e.target.value)}

View File

@@ -50,10 +50,10 @@
color : #D3D3D3; color : #D3D3D3;
accent-color : #D3D3D3; accent-color : #D3D3D3;
&::-webkit-slider-thumb, &::-moz-slider-thumb { &::-webkit-slider-thumb, &::-moz-range-thumb {
width : 5px; width : 5px;
height : 5px; height : 5px;
cursor : pointer; cursor : ew-resize;
outline : none; outline : none;
} }
@@ -76,7 +76,7 @@
// `.text-input` if generic to all range inputs, or `#page-input` if only for current page input // `.text-input` if generic to all range inputs, or `#page-input` if only for current page input
&#page-input { &#page-input {
width : 4ch; max-width : 7ch;
margin-right : 1ch; margin-right : 1ch;
text-align : center; text-align : center;
} }