Updated ad placeholder graphics, update Modrinth App sidebar to mockup designs (#4584)

* Update ad placeholders to new green graphic

* Remove rounded corners from app ad frame

* Improve web ad placeholder styling

* Revamp app sidebar to match mockups more closely, greatly improve friends UX, fix up context menus and typify shit

* only show overflow on hover

* lint

* intl:extract

* clean up the inline code in FriendsSection

packages/ui/src/components/base/OverflowMenu.vue

@@ -5,9 +5,11 @@
 		:disabled="disabled"
 		:dropdown-id="dropdownId"
 		:tooltip="tooltip"
+		:placement="placement"
 	>
 		<slot></slot>
 		<template #menu>
+			<slot name="menu-header" />
 			<template v-for="(option, index) in options.filter((x) => x.shown === undefined || x.shown)">
 				<div
 					v-if="isDivider(option)"
@@ -96,12 +98,14 @@ withDefaults(
 		disabled?: boolean
 		dropdownId?: string
 		tooltip?: string
+		placement?: string
 	}>(),
 	{
 		options: () => [],
 		disabled: false,
 		dropdownId: undefined,
 		tooltip: undefined,
+		placement: 'bottom-end',
 	},
 )