Make switch larger on touchscreen devices (#6546)

Followup to https://codeberg.org/forgejo/forgejo/pulls/6459.

Usually it's quite hard to have inputs with balanced size that works for both desktop and mobile: it's either too large or too small for one of them. I think this can be a solution for this new element.

I tried it locally, it feels good on a phone. There's likely one downside which is that the switch will still be larger on touch devices even when they're wide, like on tablets. I think it can be resolved separately at some point. It isn't a problem on small devices because usually these elements go on separate rows.

## Preview

This change only affects touch devices.

|Before|After|
|-|-|
|||

Reviewed-on: https://codeberg.org/forgejo/forgejo/pulls/6546
Reviewed-by: Michael Kriese <[e-mail]>
Reviewed-by: Otto <[e-mail]>
Co-authored-by: 0ko <[e-mail]>
Co-committed-by: 0ko <[e-mail]>

web_src/css/modules/switch.css

···
   outline: 1px solid var(--color-input-border);
 }
 
-.switch .item svg {
-  vertical-align: sub;
+@media (pointer: coarse) {
+  .switch .item {
+    padding: .75em 1.125em;
+  }
 }
 
 .switch button.item {