fix(link): Keybind, scroll behaviour, restrict drag to vertical (#176)

* chore: expose scrollActiveElementIntoView

* feat(utils): editable element

* fix: memoize exceptionRefs, use animation frame and check editable element

* fix: improve btn on mobile

* chore(drps): bump framer motion version

* fix(link): big fix

* chore: remove comment code

* feat: touch device

web/components/routes/link/header.tsx

@@ -42,7 +42,7 @@ export const LinkHeader = React.memo(() => {
 			</ContentHeader>
 
 			{isTablet && (
-				<div className="flex min-h-10 flex-row items-start justify-between border-b px-6 py-2 max-lg:pl-4">
+				<div className="flex min-h-10 flex-row items-start justify-between border-b px-6 pb-4 pt-2 max-lg:pl-4">
 					<LearningTab />
 				</div>
 			)}
@@ -115,7 +115,7 @@ const FilterAndSort = React.memo(() => {
 			<div className="flex items-center gap-2">
 				<Popover open={sortOpen} onOpenChange={setSortOpen}>
 					<PopoverTrigger asChild>
-						<Button size="sm" type="button" variant="secondary" className="gap-x-2 text-sm">
+						<Button size="sm" type="button" variant="secondary" className="min-w-8 gap-x-2 text-sm max-sm:p-0">
 							<ListFilterIcon size={16} className="text-primary/60" />
 							<span className="hidden md:block">Filter: {getFilterText()}</span>
 						</Button>