File tree Expand file tree Collapse file tree 2 files changed +12
-2
lines changed Expand file tree Collapse file tree 2 files changed +12
-2
lines changed Original file line number Diff line number Diff line change 7878 // Input is also touch target
7979 input {
8080 appearance : none ;
81- height : 48 px ;
81+ height : max ( 100 % , map . get ( $tokens , ' touch-target-size ' )) ;
8282 outline : none ;
8383 margin : 0 ;
8484 position : absolute ;
85- width : 100% ;
85+ width : max ( 100% , map . get ( $tokens , ' touch-target-size ' )) ;
8686 z-index : 1 ;
8787 cursor : inherit ;
88+ top : 50% ;
89+ left : 50% ;
90+ transform : translate (-50% , -50% );
8891 }
8992
9093 :host ([touch-target = ' none' ]) input {
Original file line number Diff line number Diff line change @@ -79,6 +79,7 @@ $supported-tokens: (
7979 ' selected-track-color' ,
8080 ' state-layer-shape' ,
8181 ' state-layer-size' ,
82+ ' touch-target-size' ,
8283 ' track-color' ,
8384 ' track-height' ,
8485 ' track-outline-color' ,
@@ -120,6 +121,12 @@ $_default: (
120121 ' handle-shape' ,
121122 ' track-shape'
122123 );
124+ $new-tokens : map .merge (
125+ $new-tokens ,
126+ (
127+ ' touch-target-size' : if ($exclude-hardcoded-values , null , 48px )
128+ )
129+ );
123130
124131 $tokens : validate .values (
125132 $tokens ,
You can’t perform that action at this time.
0 commit comments